Edit WordPress menus

  • menus
  • navigation
  • header
  • site-editing

Updated

To edit a WordPress menu, go to Appearance → Menus, pick the menu, make your changes, and click Save Menu. That's where you add pages, rename links, build dropdown menus, and choose whether a menu shows in the header, footer, or elsewhere. (Block themes edit menus in the Site Editor instead, under Appearance → Editor → Navigation.)

Open or create a menu

  1. Go to Appearance → Menus.
  2. Pick an existing menu from the dropdown at the top, or enter a Menu Name to create a new one.

How do I choose where a menu appears?

On the same screen, check a Display location, such as the primary header navigation or the footer. The list of locations depends on your theme setup. Click Save Menu after changing it.

You can also assign locations under Appearance → Customize → Menus.

Add pages and links

  1. In the panels on the left, open Pages, Posts, Custom Links, or another content type.
  2. Check the items you want and click Add to Menu.
  3. Drag items in the list on the right to set their order.
  4. Click Save Menu.

How do I make a dropdown menu?

  • Click the arrow on an item to edit its Navigation Label. This is the text visitors see, and it can differ from the page title.
  • Click Remove to take an item out of the menu. The page itself stays published.
  • To make a dropdown menu, drag an item slightly to the right, under the item it should sit beneath.

Save the menu and refresh the front end to check it.

Tips

  • Keep top-level labels short and put the detail in dropdowns.
  • Renaming a page doesn't always rename its menu link. Check the Navigation Label afterward.
  • Need a field you can't see, such as CSS Classes or Open link in a new tab? Open Screen Options at the top right of the screen and check it.

If your site runs on Dirigible

  • Menu locations: Dirigible has Main Menu, Mobile Menu, Footer Menu, and Utility Menu (links in the slim bar above the header, when Header & Menus → Utility Nav is on). The Centered header layout adds Main Menu Left and Main Menu Right.
  • Make a menu link look like a button: turn on CSS Classes in Screen Options, then type is-style-button into the item's CSS Classes field. For another button style, add a second class after it: is-style-button is-style-hollow (or is-style-alternate, is-style-ghost, is-style-white). Save it for one standout link, such as Contact. For a button beside the menu on every page, see Add a header menu button.
  • Mega menus: for a large dropdown panel with columns, images, or buttons, see Create a mega menu.