Example: Creating a meganav drop-down menu
This example is for Menus created before Shopify's new Nested Menus. See link below for updated instructions on how to create a meganav with Nested Menus.
In this example, we will convert our Shop menu into a two-column drop-down which will display two categories of items.
In our example, the Main Menu will have a listing of items like:
We want our Shop to display two columns: Men and Women and include items for each category.
To do that create/modify your Shop menu and only have two menu items:
It's important to note that only two menu items should be in the Shop menu. Additional links will not format well. If you're building a third column, then you can create a third item. For our example, we'll only use two columns and we don't want to have additional links/menu items under Shop. Also make sure the Shop handle is shop. If the handle is shop-1, this won't work. If you don't already have a Shop menu, then use Add Menu to create a new menu.
Next, create a new menu called Men. In the Men menu, add menu items that relate to the men category like:
Then, create a new menu called Women. In the Women menu, add menu items for the women category like:
The links you choose for the menu items have no dependancy on how the meganav works. In the Shop menu, links for Men and Women can point to a collection or even just a hashmark "#" for nothing.
Our Shop drop-down is now complete. We can even add a meganav image for promotions:
The meganav image is found in the Header section settings of the theme editor (Customize theme). Currently, only one meganav image can be used. Future versions of Pipeline will include support for multiple images.