The system for setting up the Mega Menu system works differently than below, for these theme versions - please see the guide here:
The Mega menu is a menu within a menu; a large drop-down feature built into your theme's header. It displays a greater number of navigation options, giving your customers quick and easy access to many pages across your site.
A mega menu displaying under a header once the user's cursor makes contact.
In order to add a Mega menu to your theme, this menu first needs to exist within your Shopify admin settings.
Within your Shopify admin, go to Sales Channels > Online Store > Navigation.
Select the menu you wish to add.
You will then be able to view the Menu items within your selected menu.
These navigation options have the purpose of taking your customers to their desired destination on your site, and some menus take multiple steps to get to certain destinations within your site as they fall into specific categories.
Within your Navigation section, these multiple layers are signified by the arrow ▶.
Multiple layers of menu items, as signified by the arrow ▶.
Therefore, the more steps available within your Menu items, the greater the range of your navigation options - and this is when the Mega menu becomes a great solution to help your customers find where they need to go.
You can edit the Navigation section of your Shopify dashboard to change your menu options at any time - your live site will be updated.
To add a Mega menu, you can add this through your Header section - read our guide to learn more:
Within your Shopify admin, go to Online Store > Themes.
Click your theme, and select Customize.
On the left-hand menu, select Header > Add mega menu.
A Mega menu features a menu item with multiple navigational layers to it, as signified by the arrow ▶ .
Your Mega menu is based on your 1st navigational layer, the menu's categories can be found on its 2nd navigational layer, and the items displayed on the menu can be found on its 3rd navigational layer.
The 1st, 2nd, and 3rd navigational layers with your Shopify admin.
To add a specific menu item within the Navigation section of your Shopify admin, simply type the menu title from the 1st navigational layer into the Mega menu entry field.
Please ensure that you type in the menu item title exactly as it reads in your Navigation settings, including the correct case.
By typing your chosen menu item into the entry field, your Mega menu will appear underneath your header to display its full range of navigation options.
If one of your menu items with multiple navigational layers is called Bicycles, type 'Bicycles' into the Mega menu entry field.
Before and after the mega menu has been activated.
By typing in your chosen menu item to create a Mega menu, you have the power to choose which individual menu items have a Mega menu and which have the standard drop-down option.
The Mega Menu is coded to always stretch across the full width of the screen, and can hold a maximum of five columns across - adding an image will create and use up one of these columns.
To upload an image to your menu, go to Image and click Select Image. To save this choice, click Select.
You can choose up to two images for your menu, as signified by IMAGE 1 and IMAGE 2 within your Mega menu settings - these images will take up one column each, and each menu can hold up to five columns in total.
In order to link your image to another page within your store, click on the Link bar and select one of the page options - alternatively, you can also paste a link of your choice.