Discover the process of incorporating menus to construct the navigation for your online store.

Rectangle-1.jpg

A mega menu is a dropdown menu featuring two levels of nested drop-downs, enhancing the way shoppers explore your product offerings and other information. This design choice facilitates easy and seamless browsing, making it ideal for websites with numerous categories and subcategories. Additionally, the design allows ample space for incorporating images (banners) and other visually rich content.

Given that various websites have distinct requirements based on their size, nature, and objectives, different types of menus are necessary. This article guides you through the process of creating and customizing a menu that aligns with the specific needs of your store.

Create menu

  1. Go to Navigation to create a menu.

    menu-1.jpg

  2. Click Add menu to add new or choose any items below the menu to edit.

    menu-2.jpg

  3. Write the menu's name, then choose Add menu item.

    menu-3.jpg

  4. Write the menu item's name and choose the item in the dropdown box then click Add.

    menu-5.jpg

    menu-4.jpg

  5. To make an item to a child menu, drag it under the main item.

    menu-6.jpg

    Menu items can also be added to create the same level as a child menu.

    menu-7.jpg

    If you want to create a mega menu, you need to add third-level items.

    menu-8.jpg

Add menu to theme

  1. Go to Themes > Customize.

    menu-9.jpg

  2. Check Header section > Menu, then edit menu and use the created menu.

    menu-10

    The newly created menu is now shown on your storefront.

    Rectangle-2

    To enable the mega menu, in the Header section, click Add block > add any Mega menu block you want and fill in the exact menu item name.

How to add picture in Mega menu

  1. Create a collection

    menu-11

  2. In the bottom of the collections page, click the Metafields section, then choose Mega menu image.

    menu-12

  3. Go to navigation page, choose Mega menu (that you created earlier), click on edit option, add name for that, link it to your wished collection, for the final step, edit the name an put (Mega-)

    menu-13

    image-1

Note: For setting up the category section in Mega menu, just set a name (without Mega-) and link that to your wished collection, product or page