Add a Dropdown Menu to your header in the Kadence Theme

Below are the following “step by step” instructions to adding a Dropdown menu to your Header Menu in the WordPress Kadence Theme.

Businesses add a dropdown menu to a website to save screen space in the viewable menu and organize related options into clean, manageable categories. This can ultimately improve navigation across the entire site.

To install:

• For a visual experience, please click below for the video on my YouTube channel,
• or scroll down further for the written instructions.

How to Find the Name of your Header Menu?

Start off by logging into your WordPress Dashboard and scroll down the Menu on the left-hand side:

• Hover on “Appearance” and click “Customize”
• Scroll Down and click “Menus”
• Click on “View All Locations”

I particular, you want to look at the “Primary” option and then further down in the “Mobile” option.

The drop down box will have the name of your Menu here.

More likely both these Menu’s will be the same, but on some occasions, businesses will set up a different menu for Mobile to reduce clutter and choices in the Mobile View.

If your website has two different menu’s, then you might need to consider changing both using the instructions below.

Editing the Menu

Now that we know the name of the menu, I need you to go back to the main WordPress Dashboard (Hit the “X” button to leave the customize area).

• Hover on “Appearance” and click “Menus”
• If you’re not seeing the menu you need please use the dropdown box against “Select the Menu to Edit” to choose the right one.

Adding the Dropdown

Please note you can add either Pages, Posts, Categories or Custom Links to your menu. However, only published options will show up under the “Add Menu Items” section.

To add items to your menu, you will need to tick the square box (which then turns Blue) against each page/Post or Category you want to add.

Then press the “Add to Menu” Button, which will add the items to the bottom of the menu,

This allows you to use your “Left mouse” to click each item and “Drag and Drop” into the correct position.

However, in the same instance, I need you to “Indent” the item in the menu, which creates the Dropdown box again the Parent Header Menu item.

Editing the Menu options?

Each of these Menu options has a dropdown box to open and see more Settings, this includes:

• Navigation Label
• Menu Parent
• Menu Order
• Or Remove from Menu

Personally, I prefer and find it easier to do the Drag and Drop method and only open up these settings to change the “Navigation Label” or remove it from the menu altogether.

Once you’ve finished, you just press the blue “Save Menu” button down the bottom.

Wrap Up

From here, I would go into your live website and check on both Desktop and Mobile that the Dropdown Menu is how you want to.

You’ll see that the Header item will have a small arrow and open up the Dropdown Box.

If you need further help, I will explain how to edit the Colours, Font and size of the Dropdown Menu in another Blog.