“WP Mega Menu Pro” Documentation by “AccessPress Themes” v1.0.0

“WP Mega Menu Pro”

Created: 14/December/2016
By: AccessPress Themes
Email: support@accesspressthemes.com

Thank you for purchasing our plugin. If you have any questions that are beyond the scope of this help file, please feel free to email via our user page contact form here. Thanks so much!

Installing Instructions
WP Mega Menu Pro Settings
Theme Settings
Admin Menu Settings
Top Level Menu Settings
Sub Menu Settings
Advanced Menu Items
Widget Information

A) Installing Instructions - top

Unzip wp-mega-menu-pro.zip
Upload all the files to the /wp-content/plugins/wp-mega-menu-pro
Activate the plugin through the 'Plugins' menu in WordPress.
Setup default plugin's settings, click on WP Mega Menu Pro option menu in Wordpress left admin menu.
To display the mega menu or flyout in the frontend, go to backend wordpress menu page, please create menu location if not any exist. Simply add menu from left metabox section and assign those menu to menu location. Then, on same left section, you can see the metabox with title “Select WP Mega Menu Pro Settings” where you can enable mega menu for specific menu location. Similarly, you can also use generated shortcode from shortcode tab in WP Mega Menu Pro left admin menu for any page, post, widget or template pages.

Once the plugin is installed and activated you will find a menu named "WP Mega Menu Pro" in the left menu bar of the admin menu.Once you click on that menu , you will go to the plugin's default settings page such as general settings, mobile settings, image settings and similarly, on second sub menu of this plugin you can see Theme Settings where you can create new custom templates ,assign it to specific menu location from backend admin menu page and you can setup your own custom theme templates with more than 100+ customization options and more than 50+ google fonts available. Basically there are seven main settings panels as general settings, image settings, mobile settings ,import and export settings , sticky menu settings, Enable Custom CSS Settings ,Icon Settings that will help you to setup the plugin default setup which is individually described below.

B) WP Mega Menu Pro Settings - top

1) General Settings

In this tab, you can set the default values such as event behavior while clicking event is selected from menu location for specific theme location, menu label animation type with duration, delay, iteration counter, woocommerce total cart display common layout.

On event behavior, there are two options i.e Open Submenu on first click and close on second click or Open submenu on first click and follow link on second click.Another default settings options is to set default annimation for menu label although you can set different animation to different menu label from admin menu popup form settings. In woocommerce settings, this is the common settings for woocommerce total cart display which can be show as menu replacement from admin menu pag

2) Mobile Settings

In this settings, you can enable megamenu on mobile version, add substractor after menu, choose toggle behavior, menu toggle open and close icons as overall menu locations.

3) Sticky Menu Settings

In order to make any menu sticky, you can select specific menu location from this tab section to make the specific menu location as sticky menu. You can even enable sticky menu on mobile, Assign Sticky Opacity, Sticky Zindex and Sticky Offset.

4) Image settings

WP Mega Menu Pro Image settings

In this tab you can set default settings regarding the wordpress image size options, set custom default width as well as menu icon hide/show and define icon width. You can either enable or disable all menu icons. If you want to change the image size according to image shown on specific menus you can even override the settings from specific menu location page.

5) Shortcode settings

In this tab you can use shortcode provided in any page, post content editor or widgets area. You can also use php function instead on your template files which specific menu location generated from shortcode tab. In order to display mega menu of specific menu location, firstly, you must need to enable WP Mega Menu from menu page for specific menu location from left section metabox options.

6) Import/Export settings

In this tab, you can import/export the custom theme json file of this plugin and you can see it on list of theme settings on backend and again use it for your mega menu.

7) Custom CSS settings

In this tab, you can enable your own custom css and fill the custom css as per your requirement.

C) Theme settings - top

In this sub menu page, you can setup your own custom theme templates with more than 100+ customization options and more than 50+ google fonts available. The default custom template is also provided. In a same way, you can create your own custom templates and assign it to specific menu location from admin menu creation page.

D) Admin Menu Settings - top

To enable WP Mega Menu Pro for specific menu location, on menu page, you can choose menu location and on left section you can find options settings as Select WP Mega Menu Pro Settings Metabox Options where you can enable wp mega menu pro, choose orientation as vertical or horizontal, choose trigger effect(show mega menu on hover or on click effect), transition effect(slide or fade type). Also WP Mega Menu has provided 14 Free Pre Available Templates/Skins or you can even setup your own custom theme templates and choose it from this section for specific menu location. To setup mega menu or flyout type for particular menu. On hover menu you can find WP Mega Menu Pro Button where you can setup options menu wise. In these options, you can set mega menu type sub menu for top level menu only.

E) Top Level Menu Settings - top

In these Settings, you can set the top level menu as mega menu type or flyout type for its sub menu display. Here, after selecting mega menu type, you have extra options to configure choosing mega menu as single or group mega menu type which is described below briefly.

1) Single Group Settings

After choosing mega menu as menu type for specific menu , here it provides an advanced feature to choose mega menu type as single or multiple type. On choosing single group, you can set single column number and choose any wordpress widgets from ADD WIDGET Button above and set its column which works same as free plugin type mega menu.

2) Multiple Group settings

On choosing multiple group mega menu, you can even create multiple group tabs and choose each group with different total column number, and even can edit its column number later. Then you can choose widgets, set widgets on each particular group separatly as per your wish. You can add/edit/delete group for specific menu and choose widgets to set on specific group .You can even sort out the widgets as per you like in an specific order. Note: In Multiple group settings,it have some limitation that the sub menus will always be listed on first group. You cannot keep the submenu on another group but you can sort its order in first group.

WP Mega Menu Pro Multiple Group settings

CREATE GROUP

Click on ADD GROUP BUTTON as shown in above screenshot. Then popup form with adding new group with column number will be displayed as shown on below screenshot images.

EDIT GROUP

Click on ADD GROUP BUTTON as shown in above screenshot. Then popup form with adding new group with column number will be displayed as shown on below screenshot images.

WP Mega Menu Pro Edit Multiple Group settings

You can add multiple widgets column wise from “ADD WIDGET” button. You can sort selected widgets in order, automatic save data of widgets from this section. Below is the image shown after click on add widget button where list of default wordpress widget are listed on one tab, wp mega menu plugin has also provided 13 custom pre available widgets with different layout for woocommerce and products.For more details of widget provided are described on section Widget Information below And last tab is with lists of all WooCommerce widgets so you need to install and activate woocommerce plugin in order to get its widgets.

On Top level Menu Settings there are 7 extra main settings options described below:

1) General Settings

General Settings, where there is multiple options such as

Disable Menu Text : Enabling Disable On Menu Text, the menu text neither the menu description will be not be shown so height is set to 0px.
Active link: Active menu link or de-active it from this button.
Visible Hidden Menu Text : you can hide visibility but with height of menu being shown by activating this button.
Hide Menu on Mobile: From this button, you can hide the specific menu on mobile.
Hide Menu on Desktop: From this button, you can hide the specific menu on Desktop.
Show Menu Icon : On Enable, you can show menu icon selected for specific menu.
Active Single Menu : Enable single menu if menu is custom single menu link. Useful for Any Custom Links such as social links. This button must be enable in order to display custom links such as for social icons
Menu Item Alignment : Right aligned items will appear in reverse order on the right hand side of the menu bar.
Menu Label : Fill menu label here for specific menu item such as Hot!, New!, Update.
Sub Menu Alignment : Specially for flyout menu only. With left and right features, right position will show the flyout sub menu on right side whereas left position will show sub menu from left side
Menu Label Animation : You can choose specific animation type for this menu label.Default is set as None which will disable animation.
Animation Iteration Count : You can also fill the animation Iteration count in number such as 2,3. You can also use "infinite" word instead of number which let the animation to repeat forever.
Menu Visibility on User Based : You can choose show this menu as per logged in users , logged out users or show always options for specific menu.

2) Mega Menu Settings

In these Settings, you can even setup Mega Menu settings for horizontal position and vertical position. In Mega Menu Settings, you can even add extra top and bottom content with only text, only image or use html content to display for mega menu type only.

Show Top Section : Enable Top section for mega menu settings.
Show Bottom Section : Enable Bottom section for mega menu settings.
Show Top Section Type : You can show only text, only image or html content on top section.
Show Bottom Section Type : You can show only text, only image or html content on bottom section.
Mega Menu Horizontal Positions: Select mega menu position display type for horizontal as full-width, left, right or center type.
Mega Menu Vertical Positions: Select mega menu position display type for vertical as full-height or aligned to parent type.

3) Flyout Settings

In these Settings, you can even setup Flyout settings for horizontal position and vertical position. In Flyout Settings, you can display for flyout in different positions for horzontal or vertical menu type.

Flyout Horizontal Positions: Select Flyout position display type for horizontal submenu as left or right side.
Flyout Vertical Positions: Select Flyout position display type for vertical as full-height or aligned to parent type.

4) Menu Replacement Settings

WP Mega Menu Pro Menu replacement Settings

In Menu replacement settings, you can replace the menu in different type such as logo image, search type, register form display type or woocommerce cart total type. If you want to display menu in search form then you can simply choose Menu replacement Settings options and select search type from dropdown button options where you can add shortcode to display search form as inline toggle left or right position or mega menu type. Simply you can use the provided search shortcode in textarea. For search type shortcode are provided below as per your requirement you can choose any search form layout and set on search type menu replacement textarea fields:

Inline Search Toggle Left: [wp_megamenu_search_form template_type=inline-search style=inline-toggle-left]
Inline toggle to Right: [wp_megamenu_search_form template_type=inline-search style=inline-toggle-right]
Popup Search Form: [wp_megamenu_search_form template_type=popup-search-form]
Display Search form on MegaMenu: [wp_megamenu_search_form template_type=megamenu-type-search]

Similarly, you can even display login form on popup form with the shortcode provided below: Login Shortcode : [wp_megamenu_login_form]

else you can choose register form menu type where register form will be shown on popup form on click the menu being replaced as register type.For register form you can add below shortcode of wp mega menu pro plugin

Another menu replacement option is custom logo image where you can upload custom logo image to show on menu. Here you can even set specific custom width and height for uploaded custom image.

You can also replace menu as woocommerce cart total display. For this, you simply need to choose woocommerce cart total in menu replacement settings dropdown options and fill the woocommerce default settings on WP Mega Menu Pro Menu settings in General Settings Tab section which is shown in screenshot below.

WP Mega Menu Pro Woocommerce Default Settings

5) Icon Settings

These Settings also contain Icon Settings where you can choose menu icon from multiple font icons sets. Menu Icon Settings contains 650+ FontAwesome, 120+ Genericon, 160+ Dashicons, 400+ Icomoon Icon and 40+ Line Icons available.Here you can even upload custom icon and set its custom width and height for particular menu.

6) Background Image Settings

In order to upload Background image for specific mega menu, you can enable this settings. There are options to upload single Background image or double background image. On choosing single background image, you can upload single image to display it on particular mega menu.Or else choosing double background image, you can upload two image and set animation as cross fading type where image will be changed on hover effect or change the first background inage to another uplaoded background image on hover on specific time duration. You can even set time duration for this changes.

WP Mega Menu Pro Background Image Settings

7) Other Settings

a) Custom Styling Settings:

WP Mega Menu Pro Other Custom Settings In this settings, you can set different custom styling for each menu items. This values setup will override the styling setup of available theme as well as custom theme. This includes overriding styling for background color,Background Hover Color,Menu Font Color,Menu Icon Color,Sub Menu Background Color and many more. You can even define Sub Menu Width too from this settings in px. WP Mega Menu Pro Background Image Settings

b) Roles & Restriction Settings:

WP Mega Menu Pro Background Image Settings From this settings, you can choose any roles or restriction in order to hide specific menu item according to this settings. You can hide the menu item to only logged out users or logged in users or all users except administrator or else you can choose specific roles in order to hide specific menu item role wise.

F) Sub Level Menu Settings - top

This level menu includes following tab options:

SubMenu Settings:
In this Settings, there is multiple options such as active link, show menu icons, menu label input field, disable menu text, hide menu on desktop, hide menu on mobile, active single menu useful for displaying custom menu, set menu alignment as left or right(only for top level menu used) an sub menu alignment for flyout settings for sub menu.We have feature to set menu label and choose different menu animation with iteration count to different menu label as per menu wise.
- Disable Menu Text : Enabling Disable On Menu Text, the menu text neither the menu description will be not be shown so height is set to 0px.
- Active link: Active menu link or de-active it from this button.
- Visible Hidden Menu Text : you can hide visibility but with height of menu being shown by activating this button.
- Hide Menu on Mobile: From this button, you can hide the specific menu on mobile.
- Hide Menu on Desktop: From this button, you can hide the specific menu on Desktop.
- Show Menu Icon : On Enable, you can show menu icon selected for specific menu.
- Active Single Menu : Enable single menu if menu is custom single menu link. Useful for Any Custom Links such as social links. This button must be enable in order to display custom links such as for social icons
- Menu Item Alignment : Only for top level menu options provided.
- Menu Label : Fill menu label here for specific menu item such as Hot!, New!, Update.
- Sub Menu Alignment : Specially for flyout menu only. With left and right features, right position will show the flyout sub menu on right side whereas left position will show sub menu from left side
- Menu Label Animation : You can choose specific animation type for this menu label.Default is set as None which will disable animation.
- Animation Iteration Count : You can also fill the animation Iteration count in number such as 2,3. You can also use "infinite" word instead of number which let the animation to repeat forever.
- Menu Visibility on User Based : You can choose show this menu as per logged in users , logged out users or show always options for specific menu.
- Activate View more button (NEW FEATURE) : YOu can add extra sub menu name view more and activate this button in order to display as view more button at last of sub menu lists on mega menu.
Icon Settings
This Settings also contain Icon Settings where you can choose menu icon from multiple font icons sets. Menu Icon Settings contains 650+ FontAwesome, 120+ Genericon and 160+ Dashicons, 400+ Icomoon Icon and 40+ Line Icons.Also you can upload new/custom icon too from here and define its width and height in px.
Custom Settings:
In these Settings, you can set sub menu as custom settings type where you can extract the post details such as featured image, excerpt, display author, category name, date and read more button. Here, You can even show custom image by choosing custom image and providing custom URL link. Similarly, you can display custom or featured image of particular post type sub menu on different position such as top, left or right or only image type on mega menu.
Image Settings:
In these image settings, you can choose either default image size settings set from Main Image Settings or simply choose different settings from here for particular post type sub menu featured image or custom image size. Also, if you can use custom image on Custom settings then , you can enable to use default custom image size setup before or fill different image size.

G)Advanced Menu Items Settings - top

WP Mega Menu Pro Plugin now provides 2 tabs layout as horizontal and vertical tab. You can find this feature on main admin menu page left section metabox. After adding top level menu, to create horizontal tab section, you need to add Horizontal Tabs Block(A group of horizontal tabs). A specific tab menu will be added as sub menu as horizontal tab main wrapper where you need to add its first tab menus/submenu and its respective other content menus. Similarly, you can choose Vertical Tabs Block A group of vertical tabs and do same process in order to display vertical tab inside megamenu.Below is the screenshot shown with Advanced Menu Items Section. Addinfg Tab section process are briefly described below:

For Horizontal Tab Menu
To create horizontal Tab Mega Menu, simple and easy steps are described below with screenshot as shown above.
- Step #1 : Go to admin menu page.
- Step #2 : First of all, add top menu on admin menu page such as on screenshot you can see Horizontal Tab as top menu.
- Step #3 : Secondly, in order to create horizontal tabbed mega menu, select "Horizontal Tabs Block A group of horizontal tabs." and click on Add to Menu button. Then your horizontal tabbed wrapper will be created simply by adding this menu where you can add tab button and its content as required. Here on our above screenshot, you can see there are four sub menu added such as Awards, News, Events and Celebration. These third sub menu will be working as your horizontal tabbed menu title button which on click will show the respective content of it.
- Step #4 : Add another sub menu for created menu title. These sub menu will be working as the content for specific sub menu items on click process. See Screenshot below:
To display sub menu tabbed content as custom settings, then on hover specific menu item, select WP Mega Menu Pro button. Go to Custom Settings, as shown on screenshot image below, you can set custom settings for specific sub menu items as content display type.
For Vertical Tab Menu
To create vertical Tab Mega Menu is same as creating horizontal tabbed mega menu. Here we need to select Vertical Tabbed advanced menu items as a wrapper intead of horizontal tabbed advanced menu items from WPMM PRO : Advanced Menu Items Lists. To display vertical tabbed inside mega menu, you can simply add another top level menu item and then add advanced menu item "Vertical Tab" on menu section and follow the further process as same as above step with screenshot to display vertical tabbed type.

H) Widget Information - top

WP Mega Menu Pro Admin Menu Settings

To display WP Mega Menu Pro of specific menu location, WP Mega Menu Pro has provided WP Mega Menu Pro Widget on widget page where you can choose particular menu location and set on the widget area. Else you can use provided shortcode generated from shortcode tab on any other page or default Text Widget. WP Mega Menu Pro Custom Widgets Lists WP Mega Menu Pro Plugin now provides different attractive, advanced and useful 13 pre available custom widgets such as WPMM PRO which are listed below:

A) Widget Related with Posts Display:
- 1) WPMM PRO : Advanced Posts Slider Widget
- 2) WPMM PRO : Display Posts By Category
- 3) WPMM PRO : Gallery Shortcode Widget
- 4) WPMM PRO : Posts Format Widget
- 5) WPMM PRO : Recent Posts Widget
- 6) WPMM PRO : Posts Timeline
B) Widget Related with Woocommerce Products Display:
- 7) WPMM PRO : Products Lists Widget
- 8) WPMM PRO : Recent Products Lists Widget
- 9) WPMM PRO : Woo Products Layout 2 Widget
C) Extra Widget:
- 10) WPMM : Contact Info
- 11) WPMM PRO : Text Image Widget
- 12) WPMM PRO : Custom Image Widget
- 13) WPMM PRO : Featured Box Layout

Once again, thank you so much for purchasing this plugin. As we said at the beginning, we'd be glad to help you if you have any questions relating to this plugin. No guarantees, but we'll do our best to assist. If you have a more general question relating to the plugin on CodeCanyon, you might consider visiting our site for forum and chat support.

AccessPress Themes

Go To Table of Contents