How to use navigation menus in WordPress

Jump to a section on this page:

The Basics

Additional tips & tricks

What is a navigation menu?

A navigation menu allows your site visitors to easily navigate and access different pages/content around your website. With WordPress, navigation menus are super easy to create and manage. They're also very versatile and can be used in many different ways, all of which we'll cover in depth in this article. You'll be able to add pages, categories, posts, custom links, and other content types to your navigation menu, as well as customize where in your theme you want your menu(s) to display.

Creating your first menu (or a new menu)

In your WordPress dashboard, go to Appearance > Menus.

This will bring you to the Menus screen, which is divided into two columns. The column on the left has your pages, categories, and custom links tab (there may be additional areas depending on your theme and plugins). The column on the right is where you can add and adjust your menu items.

Under Menu Name, give your menu a name (such as "Main Menu") and then click Create Menu. This will expand the menu area and give you some more options.

Adding pages to your navigation menu

Click here for information about pages and how to create them.

To add pages to your navigation menu, place a checkmark by the pages in the left column that you want to add. Then click Add to Menu.

The pages you added will appear in the right column under Menu Structure.

Adding categories to your navigation menu

Click here for information about categories and how to set them up.

To add categories to your navigation menu, click the Categories tab in the left column. Place a checkmark by the categories want to add. Then click Add to Menu.

The categories you added will appear in the column on the right under Menu Structure.

There may be times when you want to link to a page that is not on your website. For example, you may want to add a link to your social media profile or link to your Etsy shop. This can easily be done with the custom link option.

To add a custom link, click the Custom Link tab on the left. You will see two fields. The first field is for your URL, where you will need to add the URL of the page you want to have in your menu. The second field is called Link Text, and this is where you'll add the text for your link (this is what will display in the menu on your live site).

Note: when adding your URL, be sure to include the http:// or https://, otherwise you'll have a broken link.

Arranging items in your navigation menu

Each menu item that you add to your menu is arranged in the order you added them.  To rearrange them, simply drag and drop a menu item to adjust its position within the menu.

A drop-down menu is a submenu that appears below a parent menu item when it is hovered over. Using drop-down menus will simplify your navigation menu and make it easier for your website visitors to find the information they are looking for.

In the example below, "Categories" is the parent item and Style, Travel, Beauty, and Living are sub items.

To create a drop-down menu, drag a menu item right beneath the parent item. Then drag it slightly to the right. That will create a sub-menu.

You can have as many menu items as you want underneath a parent item. On your live site, the sub-items will appear when you hover your cursor over the parent item.

Now that you have your menu configured exactly how you want, it's time to add it to your site! If you are using a 17th Avenue theme, you will typically have two menu locations, Primary Navigation and Secondary Navigation. You must choose one of these before your menu will display anywhere on your site.

The specific location and names of these menu locations will vary from theme to theme. Typically, the Primary Navigation Menu will display below the header area and the Secondary Navigation Menu will display above the header. But in some themes it may be different. Be sure to refer to the Theme Documentation for your theme to find out exactly where the menu locations are, or just choose one location and see for yourself where the menu appears on your site! You can easily come back and change the location if you aren't happy with it.

Adding your menu to your site

Congrats! Now that you have created a menu, added your pages/categories, and selected a menu location, it's time to publish your menu. Click Save Menu at the bottom right. After you've saved, your menu will appear on your site.

You can have as many menus on your site as you need. A few of our themes utilize both the Primary and Secondary navigation menus at once, such as the Amelia theme.

Additional menu tips & tricks

Editing menu items

When you add pages or categories to your navigation menu, WordPress automatically uses the page title or category name as the link text. But you can change it! Simply click the arrow next to the menu item you want to edit (circled below).

Clicking the arrow will expand the menu item and allow you to change the link text ("Navigation Label").

In addition to the menu locations set by your theme, you can also add navigation menus to your sidebar!

Here's how to do it: create a new menu, add your pages/categories, and do not assign a menu location to it. Click Save Menu. Then go to Appearance > Widgets and drag a Navigation Menu widget into your Primary Sidebar or other widget area. Under Select Menu, choose the menu you just created. Save.

  1. To create a "Home" link in your navigation menu that leads to the homepage of your site, go to Appearance > Menus.
  2. In the left column, select Custom Links.
  3. In the URL field, add your complete URL (i.e. https://yourwebsite.com – be sure to include the http:// or https://).
  4. In the Link Text field, type "Home." Click Add to Menu.
  5. Click Save Menu.

When creating a drop-down menu, you may want to add a title for a submenu without having to link it to a specific page. For example, you could create a Categories drop-down menu where the parent link doesn't lead anywhere, and your categories are listed below.

  1. To create a link that doesn't lead to a page, go to Appearance > Menus.
  2. In the left column, select Custom Links.
  3. In the URL field, add a pound sign (#) by itself, no http://.
  4. In the Link Text field, type the text you want to appear in your menu. Click Add to Menu.

Then you can go ahead and add your sub-items underneath the new custom link.

How to open links in a new tab

Note: Only external links (links that are leading off your site) should be set to open in a new tab. It is poor SEO practice to have on-site links open in a new tab.

Enable the Link Target setting: Go to Appearance > Menus. Look to the top right corner of your screen and click on "Screen Options." Under Show advanced menu properties, place a checkmark next to Link Target.

Set a link to open in a new tab: Click the gray drop-down arrow next to any menu item. Below the Navigation Label field, you'll have a new checkbox that reads "Open link in a new tab." Place a checkmark in this box to set the link to open in a new tab.