Replace existing menu

How-to guide All plans 2 min read

Use it when Automatically replace picks the wrong menu — for example, your header shows a navigation other than Main menu, or uses different Shopify menus on desktop and mobile. The app finds the menu whose links match the navigation you pick and replaces it.

Set up Replace existing menu

1. Find the navigation your header uses

   In Shopify admin, go to Online Store > Themes > Customize, click the Header section and check which menu is selected (for example Main menu). Some themes have a separate mobile menu setting.

2. Select Replace existing menu

   In the menu editor, click the Settings tab in the left bar. Under Position, choose Replace existing menu.

   

   Replace existing menu with its two menu lists

3. Choose the menus to replace

   Set both lists to match your header — see Settings. They start on the first navigation in your store.

4. Save and publish

   Click Save, then publish the menu. Check your storefront on desktop and on mobile.

Settings

Select your main menu

The Shopify navigation (from Online Store > Navigation) your theme shows on desktop, usually Main menu.

Select your mobile menu

The navigation your theme shows in the mobile menu. On most themes it’s the same as the desktop one.

Troubleshooting

The menu lists are empty

Your storefront is probably password-protected, so the app can’t read your navigation and shows Please remove store front password to update menu list. Click Remove store password (it opens Online Store > Preferences), remove the password and try again.

The menu doesn't replace the header

The app matches your header’s links with the selected navigation, so hard-coded links or another navigation won’t match. Pick the navigation your header really uses, or switch to Show menu on this CSS selector.

Replaced on desktop but not on mobile, or the other way round

Set Select your mobile menu (or Select your main menu) to the navigation that layout really uses.

Related pages

• Automatically replaceLet the app find your theme's header menu and replace it automatically.
• Show menu on a CSS selectorPlace the menu on exact elements of your theme by entering their CSS selectors.
• Why doesn't my menu show on my store?A step-by-step checklist when the menu is missing from your storefront or looks wrong.

Was this helpful?

Report an issue