Mega menu

  1. To show mega menu layouts, you need to create multi-level dropdown menu first.

  2. From your Shopify admin, go to Online Store -> Themes.

  3. Find the theme that you want to edit, and then click Customize.

  4. In the Header section on the left editor window -> Click + Add block.

  5. Select block type is "Mega Menu".

Setting
Description

Navigation item

Enter the name of the collection for which you want to apply the mega menu layout into the text box.

Section width

Select the section width from the dropdown menu:

  • Full width

  • Page width

  • Custom width

Customize width

Determines the width of the section when you choose the 'Custom width' option. It can range from 1000px to 1800px, increasing by 50px increments

Promotional content

Setting
Description

Image

Set up an image

Heading

Add text to display as a block heading (Leave the field blank to hide the heading)

URL

The link that you want customers to navigate to if they click the image

Image overlay opacity on hover

Determines the image overlay opacity of the block. Can be from 0% to 100%, in 10% arithmetic increments

Background

Set the background color for this block

PreviousDropdown menuNextHeader