My old menu is still showing up, how can I hide it?

To achieve the best user experience, Shopify always loads your website first, and then apps, that's why your old navigation still appears.
If you want to hide your old navigation, please follow these steps:

Copy CSS selector of your old menu:

• Disable Smart Menu on your store
  
• Go to your storefront to find the theme's menu that you want to hide
  
• Right-click on any element in the menu to inspect
  
• The developer tool will appear. Here you need to find the correct HTML element of your theme's menu.
  When you hover over HTML elements in the development tool, the corresponding element will be highlighted with the blue color on the storefront.
  
• Right-click on that element in the development tool > Copy > Copy selector
  

Add the CSS code to your theme:

• Access your theme's code
  
• Here you need to find the CSS file in assets folder.
  For example, with Dawn theme, it is base.css file
  

• Open that file > scroll down to the bottom > add the below code

yourselector {
  opacity: 0;
}

You need to replace yourselector with the menu selector you copy in the previous step.
For example, the menu selector of the **Dawn **theme is .list-menu.list-menu--inline
So, the code you need to add is:

.list-menu.list-menu--inline {
  opacity: 0;
}

• Save and your theme's menu will be invisible when the site loads.

Updated on: 26/02/2025