Mega Menu

Mega Menu (Stylescape Shopify Theme)

A mega menu lets you organize large product catalogs into clean sections with images and promotions — making it easier for shoppers to browse and improving conversions.

In Stylescape, you can:

  • Display multiple link columns
  • Show product / collection images
  • Highlight promotions

Well-structured navigation = faster browsing + more sales.

🧭 How to create a mega menu

1️⃣ Create a nested menu in Shopify

Go to:

Shopify Admin → Content → Menus → Header menu (In this example)

Make sure the selected menu is the menu used in the header

Create at least 2 levels:

Menu levels

From step 1 to 3:

image custom swatches

2️⃣ Enable mega menu in the theme

Go to:

Online Store → Themes → Edit theme → Header

Turn on:

Show megamenu

Turn on megamenu on the header

3️⃣ Final result:

megamenu display

🎨 Adding promotions inside the mega menu (optional)

You can enhance the layout using Menu Promotion blocks:

Make sure the megamenu in enabled on the header:

Show megamenu

Still in the Header:

  1. Click Add block
  2. Choose Menu promotion
  3. In Menu item, enter the exact menu item, for example:
match the item name Open the menu promotion
  1. Additional steps:
  • Upload an image
  • Add title + text
  • Add link button
  • Choose alignment + overlay

Tip: Use lifestyle visuals to drive clicks.

👍 Best practices (SEO + UX)

  • Keep menu labels short (1–2 words)
  • Put important links first
  • Use images only if they add value
  • Keep naming consistent (Shop, Collections, Sale)

Good example:

Shop | Men | Women | Accessories | Sale

❓ FAQ — Mega Menu

Why isn’t my mega menu showing?

Most often:

  • The Show megamenu in the header is not enabled
  • No second-level items

Why isn’t my menu promotion showing?

Most often:

  • The Show megamenu in the header is not enabled
  • Link name doesn’t match
  • Block connected to wrong menu

Can I use images for categories?

Yes — use Menu promotion blocks.

Does this help SEO?

Indirectly — better structure improves user behavior and internal linking.

📌 Troubleshooting

If the mega menu doesn’t work:

  1. Confirm nested menu exists
  2. Confirm “Show megamenu” is enabled
  3. Check link spelling (must match exactly)
  4. Clear browser cache and test again
Last updated on
Color Swatches
;