Add a Dropdown Menu in WordPress

What is a dropdown menu?

A dropdown menu shows a list of links under one main menu item. Visitors hover over or tap the main item and the sub-links appear. It keeps a busy menu clean and tidy.

Steps

1. Log in to WordPress. Go to Appearance, then Menus.

   

2. Click create a new menu at the top of the page.

   

3. Type a name, such as Main Menu. Choose a display location and click Create Menu.

   

4. On the left, tick the pages, posts, links or categories you want. Click Add to Menu.

   

5. Click Save Menu.

   

6. Drag a menu item a little to the right, under the main item. It becomes a sub-item. For example, drag each page under About Us.

   

7. Click Save Menu again.
8. Open your site and hover over the main item. The sub-menu should appear. Test it on a phone too.

   

Change how the dropdown looks

Go to Appearance, then Customize, then Additional CSS. This example gives the dropdown a light blue background when you hover:

.menu-item:hover > .sub-menu {
    display: block;
    background-color: #ADD8E6;
}

Open your site and hover over the item to see the result.

Quick recap

• Create a menu under Appearance, then Menus.
• Drag items to the right to make sub-items.
• Save, then test on desktop and mobile.