A Mega Menu is the name given to a large panel of content which is displayed below a menu item when the user hovers over the menu item. Mega Menus can contain sub menu items and modules. We all know how it helps a site be more navigable.

With Helix Ultimate you are able to build such mega menus on your site easily. Helix Ultimate mega menu builder offers you different layouts to give diverse looks of your menus. Styling menus has been made easier for your convenience. Add as many menu items as you need.

Inside each menu item you can find new tab "= Mega Menu" - it came from Helix Ultimate Framework. Inside this tab, you can find several switchers, responsible for additional features.

Mega Menu

To enable/disable advanced Mega Menu options. It is simple way to create highly customized and creative mega menu configurations. You can add and use row and column based menus, also drag and drop the modules to the menu positions from the modules list.

• Width - allows you to choose total width of submenu area.
• Alignment -  choose submenu area alignment to the right, left, center, or set full width.

General tip: building a two or three columns sub-menu is easy process - all starts from Menu Manager, where you have to add all those sub menu items. For main submenu headers you can use "Menu Heading" or "External Links" menu type.

How to use Mega Menu to build columns for menu items:

1. Click “Add New Row” button
2. Select Menu layout: single row or rows with columns, you have 9 options to choose from.
3. Then click “Save” button from top bar to refresh/rebuild content.
4. After refreshing you should be able to see submenu items, if were added before. Using drag and drop function in Mega Menu, you can easily arrange columns, move elements or modules into another position, from one column into another.
5. In addition, you can also select existing module(s) from the right sidebar and put into column.
6. Trash icon - allows you to remove undesired row.
7. Close “X” icon - allows you to remove undesired element.
8. Remember to save setting after all changes (“Save” or “Save & Close”).

Show Menu Title

By default enabled, it allows you to hide Menu Title from menu, but alias in system will stay. It's good method to create hidden menu item for short url.  This may be useful also when you want to show only icon instead full menu item name, for Home or Search position.

Dropdown position

It allows you to change dropdown submenu position, to the right or to the left side.

Menu Icon

Mega Menu allows you to set an icon for each menu item in your menu. The use of icons beside menu items titles is a fantastic alternative that favors a quick visual option identification; and even the use of icons without text to accompany is viable. You can use font icons based on Font Awesome v4.7, it means that you have huge collection of icons to choose from. By default the icon will be displayed to the left of the menu item text. To remove the icon, select the “Select” name, then save settings.

Custom Class

This field is needed in the case when your template has a particular menu location and it needs adjustment. You can place here any necessary custom class name which is already defined inside your Custom CSS code section. You can add more than one class name hee, but they have to be separated with space. Notice! No dots, comma or hash mark here.

Badge in menu items

Want to highlight your most important menu item(s) redirecting to any special page, service, product or announcement? With Helix Ultimate, we give you the system to highlight your menu item(s) with name badges (for example with word “sale” or "new"). Draw your visitors’ attention to any menu item you want.

• Badge Position - choose badge name position to the right or to the left.
• Background Color - use this option to select the background color for the badge item only.
• Text Color - use this option to select the color for the badge item only. Accessibility tip: use different color than used for background color to keep necessary contrast.