Using Mega Menus in SSD eComm V2.0+ Theme

Adding the Mega Menu

Please note that the built in Shopify drop down menu style of navigation is still supported

The Mega Menus are setup as part of your theme and are designed to support adding additional content to your site's navigation. This includes pictures, text, multiple menus, etc. 

Step 1: Create the relevant menu(s) in your Shopify Navigation settings. You will need to create your primary menu as well any additional sub-menus. 

 

Step 2: While planning out your shop, give some thought to which primary menu items will require the Mega Menu treatment. In our example, we want to create a mega menu under the "Earrings" link in our main menu:


Step 3: Go to Admin > Online Store > Themes > Customize > Theme Settings > Mega Menus (1) and then Check the boxes next to as many mega menus as you will require (2).

(1)         

  (2)

Step 4: Once you have enabled the Mega Menus, you'll just need to go back to Sections in your theme editor and you will now be able to start setting up your menus.


The first step will be to enter the link title for each of your new Mega Menus. For our example the title needs to be "Earrings" as that is the title in the main menu.

The Link title must match the wording of the parent link exactly! 

Mega Menu Column Outline

Step 5: Click the "Add Column" button to add up to 5 columns to your menu



Each column can contain two images, up to four menus and two areas of text.

The layout of the column contents can be found below:

TOP CONTENT
 
NAVIGATION
Menu 1 link
Add a link to the title of the menu.
 
Menu 2
Menu 2 link
Add a link to the title of the menu.
 
Menu 3 link
Add a link to the title of the menu.
 
Add a link to the title of the menu.
 
BOTTOM CONTENT

    • Related Articles

    • Adding Product Tags

      You can add a tag to a product both when you are creating or editing an existing one.  Adding tags to a new product: Click Add product in the top right hand corner of the Products are of the Shopify Admin In the Tags section on the right hand side, ...

    • Adding a Size Chart to the eComm Performance Theme

      Supported Versions: The details shared in this article apply to the updated version of eComm Performance.  Making Use of the Size Chart Feature The eComm Performance theme includes a 'Size Chart' feature that you can have in your 'product form' on ...

    • Adding Affirm to Shopify

      To configure your Shopify store to work with Affirm, you will need to follow the steps below. Only the Account Owner can adjust the payment methods for a Shopify store.  1. Go to Settings > Payments 2. Click on "Choose Alternative Payments" 3. From ...

    • Header Settings in the eComm Performance Theme

      Supported Versions: The details shared in this article apply to the updated version of eComm Performance.  Setting up the Header The eComm Performance theme has a customizable 'Header' section. The Header has some built-in settings, including ...

    • Footer Guide eComm Performance Theme

      Supported Versions: The details shared in this article apply to the updated version of eComm Performance.  Using the Footer Section The eComm Performance theme has a customizable 'Footer' section that lets you add up to 5 vertical columns. You can ...