BigCommerce Mega Menu App User Guide


Thank you for purchasing Mega Menu BigCommerce App. If you have any difficulty with this app or you find an issue, please feel free to send us a message: bigcommerce@capacitywebsolutions.com

Below you will find the detailed documentation on how to use our app and we wish you have a great experience with our BigCommerce App.

Introduction


Mega Menu is an application allows you to truly customize the menu and submenu items according to your choice. Choose different menu styles, customize the menu features and add thumbnail images to make the menu attractive and useful.

Check Live Demo Here

Please watch the video which explained the complete Mega Menu app installation, setup process and also explained how our app works.

Get Mega Menu App


Click here to visit our BigCommerce App >> BigCommerce Mega Menu App

Please watch the video which explained the complete Mega Menu app installation, setup process and also explained how our app works.

Installation video
Detailed Explanation of Features

Import Sample Menus


  1. This feature will create a horizontal menu group and four different types of sample menu items to explain layout of our menus.

  2. You can see below confirm box within installation of mega menu app. Click on "OK" button if you want sample menus as a starter for your store's menus.
  3. Re-install

  4. In case you skip this then you can also Import Sample Menus button from Menu Items tab. Please note that this button only appears when you do not have any menus created in your store.
  5. Please have a look at sample menus as a starter for your store's menus. Hope this can help you to create your store's navigation in a better way.

  6. Sample of Mega menus:


    Megamenu:

    Flyout menu:

    3 Column:

    Contact Us:

Show Mega Menus on Store Frontend


  1. Go to Admin >> Apps >> Mega Menu >> How to Use
  2. Step-1: Download necessary files
    • Click on the Download button and download the zip file.

      Download

    • Then connect to your store WebDAV server. You can check it here. Now, open content folder in WebDAV.
    • Extract the downloaded folder and copy and paste it in the content folder. You will see megamenuapp folder in your content folder.
  3. Step-2: Now, please check Megamenuapplication Script created in your Script Manager. For it, Go to Admin >> Storefront >> Script Manager. If you did not find any script named Megamenuapplication Script or you deleted it by mistake, then click on Re-install Scripts button. It will re-install Megamenuapplication Script in your store. And if you found script then skip this step.

    Re-install

  4. Step-3: Now, again go to Admin >> Apps >> Mega Menu >> How to Use,
    Click on Copy the Clipboard to get the shortcode for displaying Mega Menus.

    Step3 Copy Code

     Now, Go to Themes and Paste Template Code in your Current Active Theme. From your Bigcommerce admin, click on Storefront >> Themes and select Advanced in your Current Active Theme. Click on Edit theme files. (** if Edit theme files option is not working then you can also go to customize and then scroll down and click on Edit Theme Files).

    Step3 Go To Theme

    Now, click on templates >> components >> common >> header.html. Paste the code where you want to show Mega Menus.

    Find div with class "navPages-container" then comment code between red line rectangle and add short code like blue section.

    Step4 Cornerstone Theme

General Settings


  1. Go to Admin >> Apps >> Mega Menu >> General Settings
  2. General Settings

  3. From Here,
    • You can enable/disable Mega Menu app, when you set enabled then menus will display on frontend.
    • You can set responsive breakpoint to display menus on frontend.
    • PUBLISH button will create a static html for your store's frontend to display menu faster than earlier.
      If you make any changes in menus, please PUBLISH your changes to reflect them in frontend. It will decrease page load and display menu faster.
      Note: Please note that you have to publish everytime when you make any changes to your menus.