On This Page

TABLE OF CONTENTS


Getting Started


One incredibly useful and vital tool for any webpage is the Navigation Bar. This bar is generally found at the top of your store's webpage and allows for your customers to easily navigate and sift through the most important and highlighted pages of your website. This article will briefly detail how to best utilize and customize this handy feature.


When customizing your Navigation Bar, you have two options: Navigation and Mega Menus. This article will focus on Mega Menus, specifically for Premium Theme Multi - Theme One. For more information on switching between Theme Settings in Premium Theme Multi, see How to Switch between Themes in Premium Theme Multi.


This page is specifically focused on editing menu items in the main menu after they have already been created. If you are looking to change you header, check out How to Customize the Theme One Header. If you are trying to tag or edit a menu item that isn't visible on your main menu, please review How to Create and Manage Menu Items


Mega Menus

In order to begin customizing your Mega Menus, follow these steps:

  1. From your myShopify page, select Online Store > Theme
  2. From Theme, select Customize 
  3. From the customization menu, you'll see a customization side bar on the left side. From here select the Navigation drop down arrow.
  4. Select Add Mega Menu
  5. Select your new Mega Menu





From here you'll find many areas for customization. These categories are:

  • Settings
  • Intro Column
  • Menu Columns One and Two
  • Featured Column
  • Promo Column


Settings

These are the general settings for the mega menus that you choose to add to your navigation bar.


Background Image

Here you can add an image to appear in the background of the Mega Menu when dropped down from your navigation bar. In order to add your image, select Select Image.


After you have chosen your image, you will notice another customization option become available: Add alt text.


Adding alt text is a good way for your to include addition descriptions that will appear just beneath your icon. You can add up to 255 characters to this alt text feature



On your store's page, this Mega Menu Background Image will look like this:



This section includes a text box where you can input the name of the menu as it will be seen on your webpage's navigation bar.



On your store's page, this Mega Menu Menu Name will look like this:



Intro Column

This section of the navigation customization allows for the customization of the leftmost column of the dropdowns of your navigation bar's menus.


Enable Column

This section includes a tick box that allows for your store to select or deselect the leftmost column of your navigation menus' dropdowns. If deselected, this leftmost column will be disabled.


Intro Column Title

This section includes a text box that allows for your store to entitle the leftmost column of your navigation menus' dropdowns.


Intro Title Link Text

This section includes a text box that allows for your store to entitle a link immediately below the Intro Column Title of the leftmost column of your navigation menus' dropdowns.


This section includes a text box that allows for your store to connect a link to the above Intro Title Link Text. You can utilize this text box to insert either a direct link through a URL or by selecting the text box and searching through collections. It will appear something like this:



Primary Button Text

This section includes a text box that allows for your store to entitle a linked button appearing at the bottom of the leftmost column of your navigation menus' dropdowns. This button will be the first (uppermost) button.


Primary Button URL

This section includes a text box that allows for your store to connect a link to the above Primary Button Text. You can utilize this text box to insert either a direct link through a URL or by selecting the text box and searching through collections. It will appear something like this:



Secondary Button Text

This section includes a text box that allows for your store to entitle a linked button appearing at the bottom of the leftmost column of your navigation menus' dropdowns. This button will be the second (lowest) button.


Secondary Button URL

This section includes a text box that allows for your store to connect a link to the above Secondary Button Text. You can utilize this text box to insert either a direct link through a URL or by selecting the text box and searching through collections. It will appear something like this:



For each of the above sections, the below image will offer a visual:



On your store's page, this Mega Menu Intro Column will look like this:



This section of the navigation customization allows for the second and third columns, when counting from the left, of your navigation menus' dropdowns.


Enable Column

This section includes a tick box that allows for your store to select or deselect Menu Column One or Menu Column Two seen in your navigation menus' dropdowns. If deselected, this column will be disabled.


This section includes a link to pre-made menus. This allows for you to link those menus to Menu Column One or Menu Colum Two. In order to add your pre-made menus, simply find and select Add Menu and search for what you wish to link here. It will look something like this:



Bottom Link Text

This section includes a text box allowing you to add a brief message below each of the links seen in the above Link List. We recommend using this section to present any necessary descriptions or clarifying information.


For each of the above sections, the below image will offer a visual:



On your store's page, the Mega Menu Menu Columns will look like this:


Please note: The column items linked are pre-created through Shopify navigation. As such, the linked text in your store's Mega Menu Menu Columns may appear differently than what is shown above in the Theme Page customization screen


This section of the navigation customization allows for the fourth column, when counting from the left, of your navigation menus' dropdowns. Generally, this section is reserved for bonus or additional products / collections. 


Enable Column

This section includes a tick box that allows for your store to select or deselect Featured Column seen in your navigation menus' dropdowns. If deselected, this column will be disabled.


This section includes a text box that allows for your store to entitle the Featured Column in your navigation menus' dropdowns.


Here you can add an image to appear in the Featured Column when dropped down from your navigation bar. In order to add your image, select Select Image.


After you have chosen your image, you will notice another customization option become available: Add alt text.


Adding alt text is a good way for your to include addition descriptions that will appear just beneath your icon. You can add up to 255 characters to this alt text feature


This section includes a text box allowing for a small caption to be placed over the very bottom portion of the added Featured Column Image.


Bottom Link Text

This section includes a text box allowing you to add a brief message below the Featured Column Image. It will link to the below Column URL. We recommend using this section to present any necessary descriptions or clarifying information.


Column URL

This section includes a text box that allows for your store to connect a link to the above Bottom Link Text. You can utilize this text box to insert either a direct link through a URL or by selecting the text box and searching through collections. It will appear something like this:



For each of the above sections, the below image will offer a visual:



On your store's page, the Mega Menu Featured Column will look like this:



Promo Column

This final, fifth column serves solely as a place to post promotional images. It will be seen as the fifth column from the left or first from the right. 


Enable Column

This section includes a tick box that allows for your store to select or deselect Promo Column seen in your navigation menus' dropdowns. If deselected, this column will be disabled.


Promo Image

Here you can add an image to appear in the Promo Column when dropped down from your navigation bar. In order to add your image, select Select Image.


After you have chosen your image, you will notice another customization option become available: Add alt text.


Adding alt text is a good way for your to include addition descriptions that will appear just beneath your icon. You can add up to 255 characters to this alt text feature


Image Caption

This section includes a text box allowing for a small caption to be placed over the very bottom portion of the added Promo Column Image.


Promo URL

This section includes a text box that allows for your store to connect a link to the above Promo Column Image. You can utilize this text box to insert either a direct link through a URL or by selecting the text box and searching through collections. It will appear something like this:



For each of the above sections, the below image will offer a visual:



On your store's page, the Mega Menu Promo Column will look like this: