Changing menu from1.9 site to 2.2

Changing menu from1.9 site to 2.2

by Alice XOMOBA -
Number of replies: 4

I’ve been trying build a theme for 2.2 Moodle site, that would be a mirror copy of an existing web site created in version 1.9.

At the moment I am stuck with re-creating the menu. In 2.2 building a custom menu is easy enough, but I have trouble finding a way to insert individual images into its buttons.

In Moodle 1.9 it was done with hard coding the image names:

                <div class="navbar clearfix">

                <div id="nav">

                <ul>

                <li><a href="<?php echo $CFG->wwwroot; ?>/index.php"><img src="<?php echo $CFG->wwwroot; ?>/theme/myCool/pix/icons/icon8.png"/> home</a></li>

                <li><a href="<?php echo $CFG->wwwroot; ?>/mod/resource/view.php?id=25"><img src="<?php echo $CFG->wwwroot; ?>/theme/myCool/pix/icons/icon9.png"/> about</a></li>

                <li><a href="<?php echo $CFG->wwwroot; ?>/mod/resource/view.php?id=49"><img src="<?php echo $CFG->wwwroot; ?>/theme/myCool/pix/icons/icon12.png"/> contact</a></li>

                </ul>

                </div>

Can somebody point me into a right direction how to tackle this problem, please?  Is there a proper way of using individual images in buttons?

Average of ratings: -
In reply to Alice XOMOBA

Re: Changing menu from1.9 site to 2.2

by Aparup Banerjee -

Hi, you may want to check out http://docs.moodle.org/dev/Themes_2.0_creating_your_first_theme#Adding_some_CSS

on using CSS. The example mentions a change to button classes too. You will need CSS knowledge.

ps: We've moved so far away from hardcoding now.

In reply to Aparup Banerjee

Re: Changing menu from1.9 site to 2.2

by Alice XOMOBA -

Thanks, Aparup!

I have read the "creating first theme" many times and refer to it ofter.

Unfortunately, it doesn't give any clues on how to use images in buttons dynamically. mixed

In reply to Alice XOMOBA

Re: Changing menu from1.9 site to 2.2

by Mary Evans -
Picture of Core developers Picture of Documentation writers Picture of Peer reviewers Picture of Plugin developers Picture of Testers

Hi,

Have you tried using CSS by adding a background image?

In Afterburner theme, if you look in the menu.css you can see there are arrows added as a background image for all the submenus so it should be possible to add an icon.

Of course the problem is targeting the li as there is no way of adding unique selector ids, but you could try nth child psuedo class and/or attribute selectors this last one is a great way to target menus as you use the a href like this...

ul.dropdown li > a[href="http://mymoodlesite.com/"] {
    background: url([[pix:theme|home]]) no-repeat scroll center center;
    height: 17px;
}

Alternatively, there is nothing stopping you using the old Moodle 1.9 Menu in the same way it was added in Moodle 1.9.

Just add the old menu in the same place as the custommenu code is found in layout/general.php and layout/frontpage.php.

HTH

Mary

In reply to Mary Evans

Re: Changing menu from1.9 site to 2.2

by Alice XOMOBA -

I'm afraid, hard coding is not an option for alternative sad

Thank you for reply.