Skip to Content
Online StoreMenus

A clear navigation structure is the difference between a customer who finds what they want and one who bounces. The Menus module lets you build and organize the links that appear in your storefront’s header, footer, and sidebars — so shoppers always know where to go.

Understanding Menu Types

Your online store relies on two primary navigation areas:

  1. Main Menu (Header): The nav bar at the top. This should contain your most important product categories (e.g., “Men’s”, “Women’s”, “New Arrivals”) and essential pages (e.g., “About Us”).
  2. Footer Menu: At the bottom of every page. Best for utility links, legal policies (Terms of Service, Privacy), contact info, and secondary categories.

Creating and Editing Menus

You can create multiple menus and assign each to different areas of your Theme.

Access Menus

Navigate to Online Store > Menus. Select an existing menu to edit (like “Main Menu”) or click Create New Menu.

Add Menu Items

Click Add Menu Item. A dialog lets you configure the link:

  • Name: The text customers will click (e.g., “Shop Sneakers”).
  • Link Type: Choose where it goes:
    • Product Category: Link directly to an inventory category.
    • Single Product: Spotlight a specific flagship item.
    • Page: Link to a custom informational page (e.g., “Contact Us”).
    • External URL: Link to a different site (like your social media profiles).

Organize and Nest Items (Sub-menus)

Want dropdown menus? Drag a menu item slightly to the right underneath another item. For example, dragging “T-Shirts” under “Apparel” creates a dropdown — clicking “Apparel” reveals “T-Shirts.”

📁

Nesting Limit: Keep navigation no more than two levels deep (Parent > Child) to ensure it stays usable on mobile devices.

Save and Assign

Once your structure is complete, click Save Menu. If you created a new menu, head to your Theme Customizer to assign it to the Header or Footer slot.

Best Practices for E-commerce Navigation

  • Keep it concise: Don’t overwhelm the header. Use broad categories and let customers filter further once they land on the category page.
  • Highlight promos: Add a uniquely styled link (in red, perhaps) for “Sale” or point to your current Hot Deals.
  • Mobile first: Always test your menus on a phone. A simple row of links on desktop can become a massive vertical list on mobile.
Last updated on
ThemesOverview