9. Testament Theme: Setting up the Navigation & Mega Dropdown Menu
The Testament theme features a sticky navigation which will help your customers to find their way around your store regardless of what page they're on or where they have scrolled down to. Within this navigation, you can use a simple dropdown menu or add a mega dropdown menu to one or more of the links in your main menu. Each dropdown menu can show up to three levels of menu items from one single dropdown, the mega dropdown is designed for menus with more than two levels of navigation items.
Here are step-by-step instructions for setting up a dropdown menu.
If you purchased your theme before Tuesday, January 9th, 2018 you will need to either upgrade to the newest version of Testament theme or follow the instructions here.
Step 1: Establish Navigation Hierarchy
When planning your navigation items, it helps to create an outline showing the navigation hierarchy. For this example, the navigation hierarchy was set up as shown.
Step 2: Set up Navigation Items
In your Shopify admin go to Online Store > Navigation click on Main Menu. First, add your Level 1 menu items, then add your Level 2 menu items positioning them inside the Level 1 items using the drag and drop. If you have Level 3 menu items, create them and position them inside the Level 2 items using drag and drop. Click save. Your nested navigation should now match your planned navigation hierarchy.
At this point you should have a simple dropdown menu, you could stop here or continue and set up a mega dropdown menu.
Step 3: Set up Mega Dropdown
In your Shopify admin go to Online Store > Themes click the Customize button next to your theme. In the Shopify theme editor click on the Sections tab and select Header. Scroll down to Content and select Add mega menu. For the Menu Item field type in the exact title of the menu item you want to have a mega dropdown, for our example, we used Shop. Optionally upload a featured image for the mega dropdown and select a link for the image if it is clicked. Click save. Now if you would like you can add another mega dropdown, but for our example, we will only have one.
Your shop Header and Navigation are now complete, time to move on to a crucial step, Setting up your Homepage!