If you are new to this MENU Section, check here: MENU and LINKS
In this section
Understanding navigation
Add, remove, or edit menu items in your online store
Set up drop-down menus in your online store
URL redirects
You must create collections first so you can apply in your menu: Adding links to collections
Please refer to this tutorial from Shopify on how to Set up drop-down menus in your online store - and nested menus. Everything about the Navigation is on Shopify End, so please check the tutorial links/ video above.
-------------------------------------------------------------------------------
Shoptimized Demo Store
- Header Strip Menu: Go to the Theme Editor -> Theme Settings -> Header Strip
( in this part, it doesn't support dropdown/ nested ) - Header Menu / Standard Menu: Go to the Theme Editor -> Sections -> Menu:
First Main Menu: This menu displays before Megamenu.
Last Main Menu: This menu displays after Megamenu.
* First / Last Main Menu doesn't matter if you wont be using Megamenu - Mobile Menu: This is based on the Header/ Megamenu Area && Header Strip Menu: (if you take a look at demo store)
- Footer Menu: Go to the Theme Editor -> Theme Settings -> Footer -> Footer Menu: ( in this part, it doesn't support dropdown/ nested. )
- Mega Menu Sections: Go to Theme Editor -> Sections -> Menu -> Add Megamenu: please do not configure from the Theme Settings -> Megamenu 1-8 (obselete sections)
Detailed Information on Megamenu as this is a bit complex
The Default Collection Settings: Choose Collection to Show Products in Mega Menu. The first three products that's in the Collection their pictures would display.
Icon - displays a small icon in the respective Submenu
First Submenu Heading - displays submenu heading in the respective Submenu
First Submenu Heading Link - the submenu heading would be clickable to its respective link ( if no links attached , it would be unclickable )
First Submenu - Menu items would display from the Menu you created for example Dresses: https://prnt.sc/wegvmx -
* Setup a Menu - in this tutorial on how to create, add, edit, remove menu items (if you look closely on the shopify links tutorial above, you wouldn't have to go through with this)
Custom Links in Megamenu - as seen in the photo below, if you wish not to display Custom Link, just simply uncheck the 'show to megamenu' otherwise fill in each textbox one by one. This would affect to all of the Megamenu that you created, there is no way to display on specific Megamenu.
Please make sure to always hit SAVE and RELOAD the page, because sometimes the Shopify Server has layout/delay issues
Other Useful Information:
Mega Menu Settings - Summary of the mega menu settings (these settings affect the functionality of all of the mega menu's) - Includes options for look and feel.
Mega Menu Setup - Learn how to configure the multiple mega menus that the theme supports.
How to Setup Collection Grid in Megamenu Part - Setup collection grid in the navigation area
How to Create a Page that Display List of Collection - Setup Page with your list of collections
How to Change Specific Texts - Change Specific Texts in the Theme
How to Change Specific Colors - Change Specific Colors in the Theme
Different Add To Cart Options - Change the General Add to Cart Button to different styles/ layout
Variant Swatch Style Options - Learn how to change the variants swatches to different styles.
Custom Link on ATC Button - Redirect the Add to Cart Button to a Certain Link