Skip to content
Help
English
العربيةČeštinaDeutschΕλληνικάEnglishEspañolFrançaisItalianaPolskiPortuguêsRomâniaРусскийSlovenčinaKiswahiliTürkçeاردو简体中文
Storefront builder

Building navigation menus

Create and edit navigation menus, add nested items, and connect them to your header and footer.

What menus are for

Navigation menus are lists of links that appear in your header and in footer menu blocks. You create menus independently in the Menus section of the admin, then assign a menu to the header or footer by selecting it inside the builder.

Opening the Menus section

From the main navigation go to Menus. The list shows all menus you have created, sorted by creation date.

Creating a new menu

  1. Click Create new menu.
  2. A modal opens. Enter a Menu name (required, maximum 50 characters).
  3. Add your menu items using the interface in the modal.
  4. Click Save to create the menu.

Editing an existing menu

  1. Click the menu row in the list. A modal opens showing the menu name and all current items.
  2. Update the name or modify the items.
  3. Click Save to apply the changes. Changes take effect on the live store after you publish the pages that use this menu.

Adding menu items

Inside the menu editor, each item has a Label (the text shoppers see) and a Link (the destination URL). Links can point to any page of your store or to external URLs.

Nested items

Menu items can have sub-items, creating a hierarchical dropdown or mega-menu structure. Add a child item under any top-level item using the nesting controls in the item editor. The header's menu block supports displaying these nested items as a Dropdown (a simple list), a Mega Menu (a multi-column panel), or a Drawer (a slide-out panel). The display type is configured in the builder, not in the menu editor. The menu editor only defines the link structure.

Deleting a menu

In the Menus list, check the checkbox on the menu row and click Delete menus in the bulk action bar. Deleting a menu that is currently assigned to a header or footer block will cause that block to show no links until a new menu is assigned.

Connecting a menu to the header

  1. Open the builder and select the Header section.
  2. In the control panel, click the Menu block.
  3. Find the Menu field and click it to open the menu picker. Your existing menus are listed. Select the one you want to use.
  4. Configure the display type (drawer, mega menu, or dropdown), horizontal position, row, color scheme, and bar options.
  5. Publish the page to make the change live.
  1. Open the builder and select the Footer section.
  2. If you do not already have a Menu block in the footer, click + Add block and add a Menu block.
  3. In the control panel for the Menu block, select the menu you want to display.
  4. Publish the page.

Tips

  • Create separate menus for the header and the footer, since they typically contain different links (the header shows top-level navigation, the footer shows legal pages and secondary links).
  • Menu names are not shown to shoppers. Use descriptive names like "Main navigation" and "Footer links" to keep things organized.
  • If a menu is not appearing in the header after you assign it, make sure you have published the page. The builder preview shows the menu immediately, but shoppers only see it after publishing.