How do I configure a mega dropdown menu?

A mega menu allows you to show several menus from one dropdown in your store's main navigation. In this tutorial, we will go through the steps we took to set up this demo dropdown…


This article applies to the Testament V 5.1+, Icon V5.1+, and Fashionopolism V4.1+.

Step 1 

If you haven't already, you will need to create the main navigation with nested submenus that will show in your mega dropdown. To do this go to Online Store > Navigation and go to Main Menu (or whichever menu you're using as the main). To set up our demo like the example above, we set up our nested navigation as shown below.

Step 2

Open your Shopify admin and go to Themes > Customize Theme. In the Shopify Theme Editor click on the left Sections tab and open the Header section. Scroll down to Mega Dropdown.

Step 3

In the field marked Mega dropdown link title enter the name of the link which you would like the mega dropdown to appear from. For example, our demo store has the following links in the main menu…

Home | Shop | Blog | Features

We wanted the mega dropdown to show under Shop, so under Menu item, we will enter Shop exactly as it shows in our menu (it must match exactly). Immediately it will pick up all the menus already set up for the Shop menu.

Step 4

Optionally you can add an image to the mega dropdown, by selecting the image in the setting Featured Image and you can link this image to a collection, page, product, etc by selecting a link in the setting Slide link.

Save your changes. If you have another menu item you want to have a dropdown below then click Add mega menu and set it up the same way.