Mega menus make it easier for customers to navigate your products and collections. In Impulse 9.0, the mega menu offers more customization options to enhance your store navigation.
For older theme versions, click here to learn how to set up the mega menu.
Create a dropdown menu
First, you will need to create dropdown or nested menu in the Content > Menus section of your Shopify admin.
Follow Shopify’s guide to set up dropdown menus
To create a mega menu like the example above, make sure to set up a three-level nested menu. Each third-level navigation item will appear in its own column of links. For example, the Tops column shown above was created using the menu structure below:
Connect your menu
By default, a menu is automatically connected to the Header section. To replace it, click the menu, select Replace, and then choose one of the available menus.
Add mega menus
To add a mega menu, click the toggle beside the Header section and click Add Mega menu.
In the Menu item field, add the name of the top-level navigation link you want to use for the mega menu.
Turn on Show images for column headings if you want to display images for second-level menu links. This only works with collection links and uses the featured image assigned to each collection in the admin.
Use the Image aspect ratio setting to control the size and shape of the images.
Enable Center menu content to align the menu columns in the center of the dropdown.
Mega menu promotions
You can add up to two promotion blocks to each mega menu dropdown. These blocks can be linked to individual menu items to highlight specific promotions.
Add an image to the promotion block by uploading one or selecting one from your library. Use the Image shape setting to adjust the size and shape of the promotion image. Then fill in the Heading and Text fields, and include a Link to send customers to the appropriate page.
If you want a button to appear below the text, add text to the Button label field.
Use Promotion position on desktop to choose whether the promotion block appears before the menu items on the left or after the menu items on the right. On mobile, the promotion blocks are shown below the menu links: