Hi there,
Have just been playing with the Moodlebar contributed by Lewis Carr.
Managed to modify a few things (bg colour, border and width) to suit the Aardvark theme I'm using, however as you can see in the screen shot - not quite there yet.
What do I modify in the moodle_bar.html to centre and add it flush to the bottom of footer (ie so there is no gap or overlap)?
Appreciate any help.
Chris
check out the zebra theme in the downloads section, I added a lot of extra CSS to the moodlebar so you can see what it does and how you would want to do it.
There's a "moodlebar" section of the css in the main theme CSS that you can grab.
There's a "moodlebar" section of the css in the main theme CSS that you can grab.
Thanks Dan,
I have had a look at the Zebra theme and to be honest, I still don't get it. Tried a variety of things and can't work it out.....
Thanks anyway.
I have had a look at the Zebra theme and to be honest, I still don't get it. Tried a variety of things and can't work it out.....
Thanks anyway.
normally, you would add something like margin: 0 auto; to the div you want to center.
In the moodlebar you want to center: #dockbottom
However, I couldn't center it with normal methods. So, when I used it, I just added a percent margin to the left. So:
#dockbottom {
margin-left: 5%;
}
(Note, #dockbottom is in moodle_bar.html).
In the moodlebar you want to center: #dockbottom
However, I couldn't center it with normal methods. So, when I used it, I just added a percent margin to the left. So:
#dockbottom {
margin-left: 5%;
}
(Note, #dockbottom is in moodle_bar.html).
Hi Chris,
I got your message in the other forum thread, but thought for simplicities sake I would answer in this as I am drowning in all those threads in the Aardvark Aquarium! LOL
Moodle Bar is a pain...but so useful!!! Will have a real play with this soon....and let you know the outcome.
Mary
I got your message in the other forum thread, but thought for simplicities sake I would answer in this as I am drowning in all those threads in the Aardvark Aquarium! LOL
Moodle Bar is a pain...but so useful!!! Will have a real play with this soon....and let you know the outcome.
Mary
Try this...
#dockbottom {left: 0;} that fixes the little critter!
#dockbottom {left: 0;} that fixes the little critter!
More styling...
#dockbottom-inner {background: #ABBA47 url(<?php echo $CFG->themewww .'/'. current_theme() ?>/images/header/img2.gif) repeat-x;
Just as an example, this is the css I added to my moodlebar in the new theme I've just created and is now in the Moodle Themes' Database, as you can see in the uploaded image the moodlebar spans the whole of the page and styled to fit the theme...
#dockbottom-inner {background: #ABBA47 url(<?php echo $CFG->themewww .'/'. current_theme() ?>/images/header/img2.gif) repeat-x;
Just as an example, this is the css I added to my moodlebar in the new theme I've just created and is now in the Moodle Themes' Database, as you can see in the uploaded image the moodlebar spans the whole of the page and styled to fit the theme...
Mary,
Downloaded new theme - unable to see where you used the Moodlebar....... sorry?
Downloaded new theme - unable to see where you used the Moodlebar....... sorry?
I haven't added it in yet! At the moment it's on my home server, as I only finished it last night trying to fix the positioning you asked about! LOL
Anyway...did that left: 0 fix the positioning, or are you still no wiser with this Moodle Bar?
Mary
Anyway...did that left: 0 fix the positioning, or are you still no wiser with this Moodle Bar?
Mary
Issue is currently with the width of the Moodlebar, my theme is 1200px so I have the following. Must be missing something????????
/* Moodle Bar - main container (set width to actual page size in pixels if not using 100% on your Moodle theme) */
#dockbottom {
bottom:0;
position:fixed;
clear:both;
width:1200px;
border-top: 0px solid #ffffff;
border-left: 5px solid #ffffff;
border-right: 5px solid #ffffff;
border-bottom: 5px solid #ffffff;
padding:0px;
height:28px;
z-index:11000; /*Allow layering*/
}
Just noticed Lewis' site has it as I would like....
http://moodle.leedscitycollege.ac.uk/
/* Moodle Bar - main container (set width to actual page size in pixels if not using 100% on your Moodle theme) */
#dockbottom {
bottom:0;
position:fixed;
clear:both;
width:1200px;
border-top: 0px solid #ffffff;
border-left: 5px solid #ffffff;
border-right: 5px solid #ffffff;
border-bottom: 5px solid #ffffff;
padding:0px;
height:28px;
z-index:11000; /*Allow layering*/
}
Just noticed Lewis' site has it as I would like....
http://moodle.leedscitycollege.ac.uk/
Try this and tell me if anything changes?
#dockbottom {
bottom:0;
left:0;
position:fixed;
clear:both;
width:100%;
border-top: 0px solid #ffffff;
border-left: 5px solid #ffffff;
border-right: 5px solid #ffffff;
border-bottom: 5px solid #ffffff;
padding:0px;
height:28px;
z-index:11000; /*Allow layering*/
}
Mary
#dockbottom {
bottom:0;
left:0;
position:fixed;
clear:both;
width:100%;
border-top: 0px solid #ffffff;
border-left: 5px solid #ffffff;
border-right: 5px solid #ffffff;
border-bottom: 5px solid #ffffff;
padding:0px;
height:28px;
z-index:11000; /*Allow layering*/
}
Mary
New screenshot attached.
Just spread the Moodle bar across the entire page.
Just spread the Moodle bar across the entire page.
Hi Chris,
In Lewis's site the include is added after page closing </div> but before a surround closing </div>. It's this which is keeping the Moodle Bar in place.
You could try adding a surround container to your page, and add the Moodle Bar inside that in your footer.html in the same way.
Hope this helps?
Mary
In Lewis's site the include is added after page closing </div> but before a surround closing </div>. It's this which is keeping the Moodle Bar in place.
You could try adding a surround container to your page, and add the Moodle Bar inside that in your footer.html in the same way.
Hope this helps?
Mary
I'm sorry Mary,
I even tried using Firebug to understand what you were explaining, but I don't know enough about all this code stuff.
Apologies. Please don't waste any more time with this..... thanks anyway.
Cheers
I even tried using Firebug to understand what you were explaining, but I don't know enough about all this code stuff.
Apologies. Please don't waste any more time with this..... thanks anyway.
Cheers
Had some help - it's been sorted. Will post up when I get my head around it.
Thanks
Thanks
Had I realised it was Aardvark you were trying to add this bar to then the penny might have dropped!
The footer in Aardvark is very buggy. If you hadn't noticed, there are 2 </div> tags which are redundant as they are not connected to any opening <div>.
This, I would suspect, was your main problem and not, as I had first thought, Moodle Bar itself.
Anyway, glad you got it fixed!
Mary
The footer in Aardvark is very buggy. If you hadn't noticed, there are 2 </div> tags which are redundant as they are not connected to any opening <div>.
This, I would suspect, was your main problem and not, as I had first thought, Moodle Bar itself.
Anyway, glad you got it fixed!
Mary
The Aardvark theme pushes the MoodleBar out to the left.
A simple fix is to place the <?php include ('moodlebar/moodle_bar.html') ; ?> underneath the copyright notices in the footer rather than before the </body> tag.
Like this:
<P><font size="1">This site is maintained and operated by PDHPE teachers at St Agnes Parish Secondary Schools.
<br>For more information please <a href="mailto:chris@pdhpe.org">contact us</a>. SAPSS are not responsible for the content of external sites.</P>
<P>Original theme created by Shaun Daubney (Newbury College)</a>.</font></P></div>
<?php include ('moodlebar/moodle_bar.html'); ?>
<?php
if (debugging()) {
?>
Hope this helps.
Regards,
Lewis
A simple fix is to place the <?php include ('moodlebar/moodle_bar.html') ; ?> underneath the copyright notices in the footer rather than before the </body> tag.
Like this:
<P><font size="1">This site is maintained and operated by PDHPE teachers at St Agnes Parish Secondary Schools.
<br>For more information please <a href="mailto:chris@pdhpe.org">contact us</a>. SAPSS are not responsible for the content of external sites.</P>
<P>Original theme created by Shaun Daubney (Newbury College)</a>.</font></P></div>
<?php include ('moodlebar/moodle_bar.html'); ?>
<?php
if (debugging()) {
?>
Hope this helps.
Regards,
Lewis