Mega menu

A mega menu replaces a regular dropdown with a wide panel — handy when a menu item has lots of sub-links, or when you want to promote collections visually right from the navigation. It's a block inside the Navigation section: open the theme editor, select Header > Navigation, and click Add block > Mega menu.

Turn a menu item into a mega menu

In the block's Menu link field, type the name of the menu item that should open as a mega menu — exactly as it appears in your menu (for example, Shop). That's the whole connection: the item keeps its place in the navigation, it just opens the wide panel now.

The link columns inside the panel come from your menu structure in Online Store > Navigation in the Shopify admin: each second-level item becomes a column title, and its nested links become the column's links.

You can also give the panel a Heading — a short headline shown at the top, above the columns and banners.

📝 Note: You can add several Mega menu blocks, one per menu item. Menu items without a block keep their regular dropdowns.

Add banners

A mega menu can hold up to six banners, shown next to the link columns. The panel is six columns wide — each banner takes one column and your menu links share the rest, so the more banners you add, the less room links get. If the menu item has no nested links at all, the banners fill the full width, which makes a nice all-visual menu.

For each banner, fill in the fields under its numbered heading (Banner 1 through Banner 6): a background image or video, an optional caption, heading, subheading, and a button with its link. Banners you leave empty simply don't show.

Style the banners

The settings under Banners apply to all banners in the block:

• Style — Inset keeps banners padded inside the panel; Edge-to-edge stretches them to the panel's edges.
• Aspect ratio — portrait or square.
• Link style — Button shows a clickable button; Full block makes the entire banner clickable (the button disappears); Full block with button does both.
• Button style, content alignment, Heading size, and a Color scheme for the banner content.

⚠️ Important: With a Full block link style, any links inside the subheading text are removed — the whole banner is one link.

On mobile

There's nothing extra to set up: when the drawer menu uses the Paged style, your mega menu banners appear inside the drawer on that menu item's page, using the same content and styles.