Setup the Main Menu via Appearance > Customize > Menus. To control the position of the Menu, see the Header Theme Options.
Creating a Menu Video Tutorial
Watch the video tutorial for how to create a Menu and Mega Menu here.
Menu Locations
Use this option to assign a Menu you have created to a Location within the theme.
Menu Name
Click the Menu name to edit the menu.
Add a Menu
To create a Menu, follow this guide:
- Goto WordPress Admin > Appearance > Customize > Menus
- Click Add a Menu button
- Give the Menu a name
- Click Create Menu
- Once it’s created, assign the Menu to a location i.e. Main Navigation
- Click Add Items
- Choose what Menu item you want to add.
Please note. If you’re creating a Menu that you do not want clickable, use a Custom Links menu item and add # to the URL
Create a Mega Menu
To setup a Mega Menu is simple. Follow the steps below to create one. If you are unsure how to create a new menu see the Add a Menu section above.
STEP 1.
If you’re not already on the Menus page – goto Appearance > Customize > Menus
- Click the Settings icon
- Ensure the CSS Classes option is enabled
- Click the Menu you want to create the Mega Menu on
STEP 2.
Next we first must setup the menu to be suitable for a Mega Menu. See the Diagram above to help you setup your menu.
- This is the Menu Item that will contain the Mega Menu
- The 2nd Level ( drag right to indent ) will determine the number of columns, in this example 4 columns ( 4 x Column Title )
- The 3rd Level ( drag right to indent ) will display directly under the column set by the level above.
STEP 3.
Now we have the Menu setup suitable for a Mega Menu, we need to activate the Mega Menu. Follow these steps to activate the Mega Menu.
- Click on the Menu Item which you want the Mega Menu to appear on
- Locate the CSS Classes Field ( See STEP 1. if you can not see CSS Classes ) and enter the text: mega-menu
- Click Save & Publish and your Mega Menu will be active
STEP 4.
The final step is choosing how you wish to display the Column Titles, you can follow these steps to make the Column Title appear bold and it will disable the link function of that menu item.
- Click the Menu Item you wish to set as a Menu Title
- Locate the CSS Classes field and enter the text: menu-title
- Click Save & Publish