After creating your menu in Mobile Menu app (not Smart Menu), you can go to Display settings tab to:
Our app will show up in place of your original mobile menu. Some styles (eg. background color) will base on your theme's original menu.
Click on the Select your mobile menu option, it will show all available menus taken from your Shopify navigation.
Choose the name of your current mobile menu (eg. Main menu).
Smart Menu can't replace a menu item in a menu, it can only replace the whole mobile menu, so you should select your Main menu.
In case you have selected your mobile menu but Smart Menu doesn't show up or shows incorrectly, you can:
1.2. Use CSS selector
You need to find the selector of your current mobile menu so our app can know where to replace.
Read instruction below to know how to find the right CSS selector:
- Navigate to your store (abc.myshopify.com) → Press Ctrl + Shift + I (or right click on anywhere → Inspect)
- The developer tool will show up > press Ctrl + Shift + M to open mobile view.
Your mobile menu will show up.
- It will auto detect the HTML tags of your mobile menu
In case you have pasted CSS selector of your mobile menu but Smart Menu doesn't show up or shows incorrectly, you can:
In case you want to keep your original mobile menu, use this option to add Mobile Menu app as a separate menu.
After choosing this method, scroll down in Display settings and you'll find options to customize Hamburger Button style and Menu Box style.
If there's any problem, please contact us