To make the most of your menus in WordPress when using Avada, you should be familiar with the various settings and options available when initially creating your menus, at Appearance > Menus, from the WordPress dashboard. These are a mixture of WordPress core menu functions, and third-party and Avada added settings. For an introduction to the core WordPress functionality of Menus, please see the WordPress.org Appearance > Menus Screen documentation.
There are many types of menu items that can be added to a menu. Some of these are core WordPress options, such as Pages, Posts, Custom Links & Categories. Others are added with third-party plugins, such as WooCommerce or The Events Calendar. Yet others are added by Avada, such as the Avada Special Menu Items and the Avada Menu Options.
There are also multiple levels of possible menu items; the Parent Level (or the First Level menu items) and any Child Levels (or sub-level menu items below the Parent Level menu item). There can be up to 4 child levels with Avada.
In each Menu item, you will also find the Avada Menu Options button. See the linked doc for a full rundown, but basically, you can use these options to configure your menu item』s appearance in your menu.
There are also five menu positions available with Avada – Main Navigation, Top Navigation, Mobile Navigation, 404 Useful Pages, and Sticky Header Navigation. See the Setting Up A Menu doc for more details on this, and other menu related items.
To read more about Mega Menus, please see our Using The Mega Menu document. Read below for more information on Menu Settings in Avada.
IMPORTANT NOTE: This post refers to the options located in the Appearance > Menus section of the WordPress admin. There are also additional Avada menu options in the Avada Theme Options panel.Parent Level Menu SettingsNavigation Label – Illustrated as A. Allows you to add a name to your menu item. In this way, you can change the display name of a menu item.
Title Attribute – Illustrated as B. This will 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.
Link Target – Illustrated as C. Allows you to set the link target to _blank.
Description – Illustrated as D. You can add a description under the Menu item. See the Spa Demo Menu for an example of this.
Avada Options – Illustrated as E. 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, in the next section.
Move – Illustrated as F. Allows you to easily move the menu item to various positions in the Menu Structure.
Original – Illustrated as G. Allows you to view the original page name, which the menu item links to.
Remove – Illustrated as H. Allows you to remove the menu item from the Menu Structure.
Cancel – Illustrated as I. Allows you to cancel or remove the changes made to the menu item and collapse the panel.
Custom Link URL Setting – Illustrated as J. The Custom Link menu item has the additional option of a URL setting. This setting allows you to add a custom link as a menu item.
Under the Screen Options at the top of the screen, there are several options you can turn on or off that will display on the Menu items, such as Link Target & Description.
Avada Menu Options SettingsMenu First Level Style – 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. The button styling is determined by the default button styles in Avada > Theme Options > Avada Builder Elements > Button Element;
Icon Select – Allows you to select a Font Awesome icon for the menu item.
Icon/Thumbnail Only – 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 – Allows you to add the label text for the menu item. This text will appear beside the menu text.
Menu Highlight Label Background Color – Allows you to add the background color for your menu highlight label.
Menu Highlight Label Text Color – Allows you to set the menu item』s highlight label text color.
Menu Highlight Label Border Color – Allows you to set the menu item』s highlight label border color.
Modal Window Anchor – Allows you to set 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 – Allows you to enable the Avada Mega Menu. Enabling this option will reveal several other Mega Menu specific options.
Mega Menu / Flyout Menu Background Image – Here you can select an image for the mega menu or flyout menu background.
In case of mega menu, if left empty, the Main Menu Dropdown Background Color will be used. Each mega menu column can have its own background image, or you can have one image that spreads across the entire mega menu width. When used in the flyout menu, the image will be shown full screen when hovering the corresponding menu item.
Mega Menu Thumbnail – Allows you to select an image to use as a thumbnail for the menu item. For top-level items, the size of the thumbnail can be controlled in Theme Options > Menu > Main Menu Icons. This option is only available if the Enable Avada Mega Menu option is set to On.
Full Width Mega Menu – 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 – 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 Avada Mega Menu option is set to On.
Child Level Menu SettingsThese settings are located in any child level menu item』s Avada Menu Options area.
Icon Select – Allows you to choose a Font Awesome icon for your menu item.
Menu Highlight Label – Allows you to add the label text for the menu item. This text will appear beside the menu text.
Menu Highlight Label Background Color – Allows you to add the background color for your menu highlight label.
Menu Highlight Label Text Color – Allows you to set the menu item』s highlight label text color.
Menu Highlight Label Border Color – Allows you to set the menu item』s highlight label border color.
Modal Window Anchor – Allows you to set the name of a modal element to launch a modal from the main menu on click. For more information on modals, click here!
If the Parent Menu Item has Mega Menu enabled, you will also these the following options in the Child Item Avada Menu Options.
Mega Menu / Flyout Menu Background Image – Allows you to select a background image for the menu or column with Mega Menu or for each menu item with Flyout Menus. 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.
Mega Menu Thumbnail – Allows you to select an image to use as a thumbnail for the menu item. For top-level items, the size of the thumbnail can be controlled in Theme Options > Menu > Main Menu Icons; This option is only available when the Avada Mega Menu option is enabled for the Parent menu item.
Mega Menu Column Width – Allows you enter a percentage value to determine the Mega Menu』s column width. For example, 25%. This option is only available when the Avada Mega Menu option is enabled for the Parent menu item. View additional documentation here.
Mega Menu Column Title – Allows you to toggle the Mega Menu column title on/off. This option is only available when the Avada Mega Menu option is enabled for the Parent menu item.
Mega Menu Widget Area – Allows you to add a widget to the menu item. Second & third level menu items can have a widget area 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 areas and how to add widgets to it here. Once you』re done creating a new widget area, return to the WordPress menu editor page and select the name of the new widget area in the 「Mega Menu Widget Area」 drop down field. This option is only available when the Avada Mega Menu option is enabled for the Parent menu item.
Menu Settings
Menu Settings