Menu Settings
Menu Settings
To utilize the menu completely, you should be familiar with the various settings and options that come with it. There are 2 levels of menu items, the Parent Level (or the First Level menu items) and the Child Level (or sub-level menu items below the Parent Level menu item). There can be up to 4 child levels with Avada. Continue reading below for a list of settings for each level.
Parent Level Menu Settings
Navigation Label – Illustrated as A in the screenshot, the Navigation Label option allows you to add a name to your menu item.
Title Attribute – Illustrated as B in the screenshot, specifies the value for the title attribute of the menu item. This text will only be displayed when a user’s mouse hovers over the menu item.
Avada Options – Illustrated as C is the Avada Options button. This will open additional menu item settings which are proprietary to Avada. Click the button and you’ll gain access to the additional options listed below.
Menu First Level Style – Illustrated as D in the screenshot, the Menu First Level Style option allows you to make the menu item regular text or a button. Choose between Default Style which is regular text, Button Small, Button Medium, Button Large, Button xLarge.
Menu Icon – Illustrated as E in the screenshot, the Menu Icon option allows you to select a Font Awesome icon for the menu item.
Icon/Thumbnail Only – Illustrated as F in the screenshot, this allows you to optionally show only the selected icon or only the thumbnail image without the menu text, as the menu item. Note: This option doesn’t apply to mobile. Click here for frontend example
Menu Highlight Label – Illustrated as G in the screenshot is where you can add the label text for the menu item. This text will appear beside the menu text.
Menu Highlight Label Background Color – Illustrated as H in the screenshot is where you can add the background color for your menu highlight label.
Menu Highlight Label Text Color – Illustrated as I in the screenshot is where you can set the menu item’s highlight label text color.
Menu Highlight Label Border Color – Illustrated as J in the screenshot is where you can set the menu item’s highlight label border color.
Modal Window Anchor – Illustrated as K in the screenshot can receive the name of a modal element to launch a modal from the main menu on click. For more information on modals, click here!
Fusion Mega Menu – Illustrated as L in the screenshot, the Fusion Mega Menu option allows you to enable the Fusion Mega Menu. Enabling this option will reveal several other Mega Menu specific options.
Full Width Mega Menu – Illustrated as M in the screenshot, this option allows you to make the Mega Menu full width. This will be the site width as set in your Theme Options. This option is only available if the Enable Mega Menu option is set to On.
Mega Menu Number of Columns – Illustrated as N in the screenshot, this option allows you to set the number of Mega Menu columns. Choose between Auto or 1 to 6. This option is only available if the Enable Fusion Mega Menu option is set to On.
Mega Menu Thumbnail – Illustrated as O in the screenshot, this feature allows you to add an image thumbnail to the menu item. This option is only available if the Enable Fusion Mega Menu option is set to On.
Mega Menu Background Image – Illustrated as P in the screenshot, can be used to set an image as the background of the mega menu. When this is set for the Parent level mega menu item, it will be applied as a single background that stretches across all child level menu items. You can also add a background image for each child level mega menu item individually in their menu item settings.
Move – Illustrated as Q in the screenshot, the Move option allows you to move the menu item to various positions in the Menu Structure.
Remove – Illustrated as R in the screenshot, the Original option allows you to view the page which the menu item links to.
Original – Illustrated as S in the screenshot, the Remove option allows you to remove the menu item from the Menu Structure.
Cancel – Illustrated as T in the screenshot, the Cancel option can be used to cancel or remove the changes made to the menu item and collapse the panel.
URL – The Custom Link menu item has the above mentioned options as well as a URL setting. This setting allows you to add a custom link as a menu item. Click here to see the URL setting
Child Level Menu Settings
Icon Select – Illustrated as A in the screenshot, is where you can choose a Font Awesome icon for your menu item.
Menu Highlight Label – Illustrated as B in the screenshot, is where you can add the label text for the menu item. This text will appear beside the menu text.
Menu Highlight Label Background Color – Illustrated as C in the screenshot is where you can add the background color for your menu highlight label.
Menu Highlight Label Text Color – Illustrated as D in the screenshot is where you can set the menu item’s highlight label text color.
Menu Highlight Label Border Color – Illustrated as E in the screenshot is where you can set the menu item’s highlight label border color.
Modal Window Anchor – Illustrated as F in the screenshot can receive the name of a modal element to launch a modal from the main menu on click. For more information on modals, click here!
Mega Menu Column Width – Illustrated as G in the screenshot, this option allows you enter a percentage value to determine the Mega Menu’s column width. For example, 25%. This option is only available when the Fusion Mega Menu option is enabled for the Parent menu item. View additional documentation here.
Mega Menu Column Title – Illustrated as H in the screenshot, this option allows you to toggle the Mega Menu column title on/off. This option is only available when the Fusion Mega Menu option is enabled for the Parent menu item.
Mega Menu Widget Area – Illustrated as I in the screenshot, this option allows you to add a widget to the menu item. Second & third level menu items can have a widget section assigned. Note that assigning a widget to a menu item replaces the menu item link and only displays the assigned widgets. Learn how to create widget sections and how to add widgets to it here. Once you’re done creating a new widget section, return to the WordPress menu editor page and select the name of the new widget section in the “Mega Menu Widget Area” dropdown field. This option is only available when the Fusion Mega Menu option is enabled for the Parent menu item.
Mega Menu Thumbnail – Illustrated as J in the screenshot, this option allows you to add an image thumbnail (in place of an icon) to the menu item. You can set the image size in WP Admin > Avada > Theme Options > Menu > Main Menu Icons > Mega Menu Thumbnail Size; This option is only available when the Fusion Mega Menu option is enabled for the Parent menu item.
Mega Menu Background Image – Illustrated as K in the screenshot, can be used to set an image as the background of the mega menu. When this is set for the Parent level mega menu item, it will be applied as a single background that stretches across all child level menu items. You can also add a background image for each child level mega menu item individually in their menu item settings.