Menu Settings

Mega Menu is an easy to use menu tool for creating beautiful, customized menus for your site, also with modules inside. That also boosts SEO and user engagement. Here in template settings you have access to 4 options only, more advanced settings are "hidden" in Menu Manager inside each menu item - so please check also there.

Select Menu

It allows you to choose menu from available in your system. If you're planning to build multilingual site in Joomla 3.4 - you have to create clone of current template for each addcional language and choose here a Main Menu for each of them.

Menu Type

By default there are enabled two separate menus: Mega Menu and Off Canvas Menu. You can use both or only of of them - as you want or need.

Off Canvas is indeed a external menu module - so if you want to use this area you have to create a menu module, set it properly. Remember to choose "offcanvas" module position for them.

What is more important in this sidebar menu you can also publish not only menu modules but also for example Search module, it also have to had a "offcanvas" position chosen in Module Manager.

Menu Dropdown Width

Dropdown Menu Width value would be to set it to the width of your submenu size content area. By default 240px.

Menu Dropdown Animation

MegaMenu offer four transition options for your dropdown submenus:

• Fade (default)
• Zoom
• Fade in Up
• No Animation

This is the transition that occurs when the submenu is opened. To have the submenu appear with no transition, set this to None (No Animation).

Off Canvas Menu Customization

To change color of Off Canvas (mobile) Menu icon [=] (which may be white or black by default) you have to use following custom CSS code :

#offcanvas-toggler > i { color: red !important; font-size: 32px; }

In this example we chosen red, but of course try with other name or hex colors.

To change color of Off Canvas menu items, please try example custom CSS code:

.offcanvas-inner .sp-module ul > li > a { color: red;  }
.offcanvas-inner .sp-module ul > li > a:hover { color: blue; }

In this example we chosen red for links and blue for links with :hover selector - when you mouse over them, try with other name or hex colors as well.

How to use custom CSS code in templates based on Helix3? Read here https://www.joomshaper.com/documentation/helix3/custom-code-settings

Search in Off Canvas Menu

Probably you're wondering how to add search module inside Off Canvas Menu. It's quite easy. All you have to do is:

1. Create New or Edit current search module (in Module Manager)
2. Disable Module Title (probably you do not need it there)
3. Change/Choose its position to "offcanvas"
4. Assign to all or selected subpages (menu items)
5. Publish module

Using this same steps you can also publish there any other module(s). But please remember that Menu should be the most important part there, so put it as a first or second position in the module order.