Skip to main content

Block - Promotion / Mega Menu

What is the Promotion Menu?​

Since v1.0.0

The Promotion Menu is a mega-menu block in the header that displays images, headings, and links in a multi-column layout. It is ideal for highlighting featured categories, bestsellers, or seasonal promotions directly in your store's navigation.

Mobile view example​

How to Set Up the Promotion Menu​

Step 1: Create a navigation item for the Promotion Menu​

  1. Open Navigation settings — In your Shopify admin, go to Online Store > Navigation.
  2. Select your main menu — Open the menu where you want the Promotion Menu to appear.
  3. Add a new item — Click Add menu item and enter a name for the entry point, for example "Bestsellers".
  4. Save your changes — Save the menu to update your store's header.

Step 2: Configure the Promotion Menu in the Theme Customizer​

  1. Open Theme Customization — In your Shopify admin, go to Online Store > Themes, locate your current theme, and select Customize.
  2. Access the Header — In the Theme Customizer, navigate to the Header section.
  3. Add a Promotion Menu block — Click Add block and select Promotion Menu.
  4. Link the navigation item — In the block settings, enter the name of the navigation item you created, for example "Bestsellers".
  5. Set the column layout — Choose the number of columns for the menu layout.
  6. Customize content — Upload images, add headings, descriptive text, and links for each column. You can add up to 6 images.
  7. Save and review — Save your changes and preview the store to verify all links and layout appear as intended.

How to Set Up the Mega Menu with Promotion Menu​

Step 1: Create a navigation​

  1. Open Navigation settings — In your Shopify admin, go to Online Store > Navigation and click on the menu you want to edit (e.g. "Main Menu").
  2. Add a top-level parent item — Click Add menu item, enter a name (e.g. "Dining room") and set its link to the relevant collection or page. Click Save.
  3. Add child items — Click Add menu item again and add each subcategory (e.g. "Tables", "Chairs", "Stools"). Set their respective links and click Save after each one.
  4. Nest items by dragging — Drag each child item slightly to the right underneath its intended parent item. A dotted line appears to indicate the nesting level. Repeat for every item you want to nest.
  5. Add a second level (grandchild items) — To nest items one level deeper (e.g. "Dining Tables" under "Tables"), add them via Add menu item and drag them to the right underneath the relevant Level 2 item.
  6. Expand a top-level item — Click the chevron icon (›) next to any menu item (e.g. "Dining room") to reveal its nested subcategories.
  7. Reorder items — Grab the drag handle (⠿) on the left side of any item and drag it to a new position within the same level.
  8. Edit an item — Hover over any subcategory row to reveal the pencil icon on the right, then click it to update the item's label or link URL.
  9. Delete an item — Hover over the row and click the trash icon on the right to remove the item from the menu.
  10. Save your changes — Click Save menu to publish the updated structure to your storefront.

Step 2: Configure the Mega Menu with Promotion Menu​

  1. Open Theme Customization — In your Shopify admin, go to Online Store > Themes, locate your current theme, and select Customize.
  2. Access the Header — In the Theme Customizer, navigate to the Header section.
  3. Add a Promotion Menu block — Click Add block and select Promotion Menu.
  4. Link the navigation item — In the block settings, enter the name of the navigation item you created, for example "Dining room".
  5. Set the column layout — Choose the number of columns for the menu layout.
  6. Customize content — Upload images, add headings, descriptive text, and links for each column. You can add up to 6 images.
  7. Save and review — Save your changes and preview the store to verify all links and layout appear as intended.

Video Tutorial​