HighMobilePage content

No mobile navigation menu

On phones, shoppers can’t reach your collections and pages without a menu built for small screens.

Checked on: homepage · Zolvio’s check: “Missing mobile navigation menu”

Why it costs you sales

A desktop menu doesn’t fit on a phone. Without a menu button that opens a mobile menu, phone shoppers can’t browse your collections and are left with search, the homepage or leaving.

How Zolvio detects it

Zolvio checks the elements on your homepage for the building blocks of a mobile menu: a menu drawer (Shopify’s header-drawer, or a class containing menu-drawer or nav-drawer), a mobile-menu, mobile-nav, menu or nav toggle, menu button, menu icon, hamburger or off-canvas element, a control that opens a menu or whose label mentions “menu” or “navigation”, or a menu toggle named in a data attribute (such as data-menu-toggle). A closed menu still counts. If none of them are there, the homepage is flagged.

Only English pages are judged (the page’s language tag, or Shopify’s language for the store when the theme sets none), since some of the words it looks for are English.

Page elements it looks for

  • header-drawer
  • [id*="menu-drawer" i]
  • [class*="menu-drawer" i]
  • [class*="nav-drawer" i]
  • [class*="mobile-menu" i]
  • [class*="mobile-nav" i]
  • [class*="nav-toggle" i]
  • [class*="navbar-toggle" i]
  • [class*="menu-toggle" i]
  • [class*="menu__toggle" i]
  • [class*="nav__toggle" i]
  • [class*="menu-trigger" i]
  • [class*="menu-btn" i]
  • [id*="menu-btn" i]
  • [class*="menu-button" i]
  • [class*="menu-icon" i]
  • [class*="hamburger" i]
  • [class*="burger" i]
  • [class*="offcanvas" i]
  • [class*="off-canvas" i]
  • [aria-controls*="menu" i]
  • [aria-controls*="nav" i]
  • [aria-label*="menu" i]
  • [aria-label*="navigation" i]
  • [data-menu-drawer-toggle]
  • [data-menu-toggle]
  • [data-toggle-menu]
  • [data-nav-toggle]
  • [data-action*="menu" i]

This finding is reported after AI review: on paid plans with AI turned on, the AI agent checks it against the audit’s evidence before it reaches your issue list. Audits without AI report only the 22 measured checks.

How to fix it

  1. In the theme editor, open the Header section and check a menu is selected; current Shopify themes then show a menu button on phones.
  2. Make sure the menu has your main collections and pages, in Content → Menus.
  3. If your theme has no mobile menu, consider a current Online Store 2.0 theme; adding a menu drawer by hand means editing sections/header.liquid.
  4. Test on a phone: the menu button should open every top-level item.

In Zolvio: on paid plans with AI turned on, the guided fix writes these steps for your own store and theme: where to click in Shopify admin or the theme editor, or which file to open, the line to find and the code to add. Each file opens in Shopify’s code editor. Zolvio never edits your theme: you make the change, then Verify fix checks your published theme for code changes (or you mark it fixed), and later audits confirm the problem is gone.

Common questions

Why does “No mobile navigation menu” cost a Shopify store sales?

A desktop menu doesn’t fit on a phone. Without a menu button that opens a mobile menu, phone shoppers can’t browse your collections and are left with search, the homepage or leaving.

How does Zolvio detect “No mobile navigation menu”?

Zolvio checks the elements on your homepage for the building blocks of a mobile menu: a menu drawer (Shopify’s header-drawer, or a class containing menu-drawer or nav-drawer), a mobile-menu, mobile-nav, menu or nav toggle, menu button, menu icon, hamburger or off-canvas element, a control that opens a menu or whose label mentions “menu” or “navigation”, or a menu toggle named in a data attribute (such as data-menu-toggle). A closed menu still counts. If none of them are there, the homepage is flagged. Only English pages are judged (the page’s language tag, or Shopify’s language for the store when the theme sets none), since some of the words it looks for are English.

How do I fix “No mobile navigation menu” on Shopify?

In the theme editor, open the Header section and check a menu is selected; current Shopify themes then show a menu button on phones. Make sure the menu has your main collections and pages, in Content → Menus. If your theme has no mobile menu, consider a current Online Store 2.0 theme; adding a menu drawer by hand means editing sections/header.liquid. Test on a phone: the menu button should open every top-level item.

Related

Documentation

  • How audits work — What an audit scans and how findings become issues.
  • Guided fixes — Step-by-step fixes written for your theme, with links into the code editor.
  • Heatmaps — See where shoppers tap and how far they scroll, on mobile and desktop.