When I open the store on desktop version, the header menu items show, but in the mobile version the menu (shown as an icon of three lines), no menu items show up. How can this be fixed?
Hey @jeeeee.eee
Welcome to Shopify Community! Can you share your Store URL so I can have a look on it? Also, if you have password enabled then please share the password as well. Your cooperation would be greatly appreciated.
Best Regards,
Moeed
Hi this is the URL. Many thanks.
This is the URL, thanks for offering your help.
Sure, here’s the short version:
- Navigation: Go to Online Store → Navigation and make sure your Main Menu has items.
- Theme settings: In Customize → Header, check that the mobile menu is set to the same menu as desktop.
- If still empty: Switch to a fresh theme (like Dawn) to confirm if it’s a theme/code issue.
Most of the time, it’s just the wrong menu assigned in the header.
Hi, thanks for the reply. I have previewed with the Dawn theme and it works well on mobile version. So it must be a coding issue for the current other theme I have for the website.
-
{% for link in linklists[section.settings.menu].links %}
-
{{ link.title }}
{% if link.links != blank %}
-
{% for child_link in link.links %}
- {{ child_link.title }} {% endfor %}
{% endfor %}
- Go to Online Store → Themes → Actions → Edit code.
- Open your mobile menu file usually named header-drawer.liquid, mobile-menu.liquid, or inside Sections → header.liquid.
- Look for where the menu should appear. Replace the broken/empty menu loop with the snippet above.
- Save changes, then test your store on mobile.
Have you recently updated your theme to the new version?
I do not see the mobile navigation element on your site.
Could it be that you’ve hidden a section which contains mobile menu?
Do you have this, and it’s not hidden or empty. Does it show navigation in Customizer when you click on “Mobile navigation” children?
It worked! Perfect, thank you very much.