How to Add Mega Menu Using Built-In Settings?
Check this video tutorial on how to add mega menu in TheGem using the built-in settings:
Step 1
Go to Appearance -> Menus. Create your menu.
NOTE: In order to make mega menus, your menu structure must contain min. 3 levels, where your:
1. first level represents your main menu item
2. second level would be a title of the grouped submenu items
3. third level would coontain the actual submenu items
Step 2
Now open your first level menu item. Here you can make general settings for your mega menu. You will see following options:
Enable Mega Menu
With this option you enable the mega menu for this menu item.
Mega Menu Style
Here you can choose between two styles of mega menu appearance
Mega Menu Masonry Style
By default mega menus in TheGem have justified grid. With this option you can enable masonry grid
Number of columns
Here you can define the number of columns to be displayed in your mega menu
Background image
If you wish to use a background image in your mega menu, here you can define this image.
Position
Here you set the position of the background image you have chosen previously
Padding
In these field you can set paddings for your mega menu
Step 3
Now open your second level menu item.
Icon
If you wish to set an icon for your submenu title, you can make it here by selecting the icon code and pasting it in this field.
Column width
Define the width of your first column in mega menu layout
Don’t link
If you don’t want to make your submenu title clickable, here you can deactivate it
Don’t show
In case you don’t want to display the submenu title, here you can hide it
This item should start a new row
If enabled, this option moves this submenu title to the new row in your mega menu layout
Step 4
The last step – go to the third level menu item.
Icon
If you wish to set an icon for your menu item, you can make it here by selecting the icon code and pasting it in this field
Label
This option enables you to add some highlighted markers/labels like “NEW”, “HOT” etc. to your menu item.
That’s all. Now make the same with the rest of your menu items and save your mega menu.