How To Setup WordPress Navigation Menus | Amazing 2022 Guide

The ability to navigate to and from pages on your website is a must.

Without navigation menus, visitors can’t access important posts or articles you’ve worked so hard to create.

That is why I wrote this article, to teach you how to set up WordPress navigation menus.

This function is important not only for SEO purposes but more importantly, for the user experience of your visitors.

Here are the summarized steps to take…

  • First, create menu pages by going to Pages and then clicking the Add New button.
  • In the title box type in the word Home, then click the Publish button.
  • Repeat these steps to create your Blog, About Us, and Contact pages.
  • Go to the Appearance Tab and then click the Menus button.
  • Under the Menu Structure section, type in Main Menu in the text box.
  • Click the Create Menu button.
  • Under the Add Menu Items section, click the checkboxes next to all the pages you created.
  • Then click the Add To Menu button.
  • Back to the Menu Structure section, move the Home page box to the top, above all other pages.
  • Click the Save Menu button.
  • In the top left corner of your WordPress dashboard, hover over your Website Name next to the House icon.
  • Then, click the Visit Site button that will drop down.
  • This will take you to your website’s home page.
  • Your Newly created pages should appear as menu items at the top of your website.
  • Congrats, you’ve just set up the basic menu structure of your website.

How Do I Add Navigation To My WordPress Site? Step By Step Tutorial with Images

So, you ask yourself, how do I edit menus in WordPress?

Well, first you have to create your menus. Creating your website’s navigation menu system is simple once you know the steps to follow.

These steps will be accompanied by an image for each step, so it will be easy to follow along and set up your navigation menus alongside me.

The first image you will see is of my homepage from my test site.

My website already came with a home page set up, but for this tutorial, I will delete it and start from scratch, so you can follow along.

With that said, let’s begin the tutorial, shall we?

Image of WordPress website home page

We will be creating the menu navigation links that you see at the top of most websites.

These links can include your Home, Blog, About Us, and Contact pages.

These are the pages we will be creating and then adding to our menu system.

Image of WordPress Pages add new menu buttons

The first step is to log in to your WordPress dashboard.

Once you are in the dashboard move your mouse cursor over to the menu on the left.

Hover over the Pages tab until a sub-menu appears.

Then click the Add New button.

Image of WordPress create page menu

Click your mouse cursor into the title text box located under the Add New Page text.

Step 1. Type in the word Home into the box.

Step 2. Click the blue Publish button.

Image of WordPress all pages and then click add new button

Under the Pages tab, click the Add New button once again.

Image of WordPress blog page creation

In the text box, type in the word Blog.

Then, click the Publish button to continue.

Image of adding a new page

Click the Add New button once more to add the next page

Creating the about us page in WordPress

Type About Us into the text box.

Click the Publish button to create your About us page.

Image of WordPress all pages and then click add new button

Finally, click the Add New button to create your last page.

Create contact page in WordPress

For your final page, type Contact into the text box.

This page will allow visitors to contact you via the contact page, email, or phone number.

And last but not least, click the Publish button to finish the page-building process.

Image of WordPress pages and all pages menu

Next, click the All Pages button located underneath The main Pages tab.

Image of WordPress all pages list

This is where you will find all of the pages you have created.

Image of WordPress appearance and menu button

Hover over the Appearance tab.

Then click the Menus button

Image of WordPress create menu button

Step 1. Type Main Menu into the text box. This will be your menu’s name.

Step 2. Click the blue Create Menu button to continue.

Image of WordPress primary menu button

Step 1. Click the Primary checkbox to set your menu as the main menu.

Step 2. Click the Save Menu button.

Image of WordPress add pages to menu button

Step 1. This is where all of the pages you have created will show up.

Step 2. Make sure all of the Pages are selected to add them to your menu.

Step 3. Finally, click the Add Menu button to add all of your pages to your menu.

Image of WordPress pages added to the main menu

Your newly created pages are now added to your main menu.

Click the Save Menu button once again.

Image of dragging WordPress pages aroound menu

Left-click and hold your mouse button on the Home page box.

Then, drag the Home page box to the top until it’s above all other pages on the list.

Image of WordPress completed menu system

The Home page box should be above all the other page boxes.

You can arrange the other pages in whatever order you wish, just make sure the Home page is on the top.

Finally, click the Save Menu button again just to make sure everything is saved.

Image of WordPress visit site button

Go to the top-left corner of your WordPress dashboard.

Step 1. Hover over your Website’s Name next to the little house icon.

Step 2. Click the Visit Site button.

Image of WordPress website navigation menu

Although your website will be different, you should still see that your pages show up as menu items at the top of your site.

And while these pages will be empty for now, feel free to click on them to make sure they take you to the corresponding page.

Image of going back to WordPress dashboard

Once you have played around with your menu system and have confirmed all to be working fine.

Click the Back button at the top of your browser to go back to the WordPress dashboard.

Image of WordPress settings and reading menu

Next, Hover over the Settings tab.

Then, click the Reading button.

Image of setting your static home page

On the Reading Settings page, follow these steps…

Step 1. Choose the Static Page option and make sure it’s selected.

Step 2. To the right of the Homepage text, click the dropdown arrow.

Step 3. Select Home as your homepage.

Image of setting your blog page

Step 1. To the right of the Posts Page text, click the dropdown arrow.

Step 2. Select Blog as your posts page.

Image of WordPress reading settings menu

Make sure that your Hompage Displays as a Static Page.

Your Homepage is set to Home.

And the Posts Page is set to Blog.

Image of WordPress pages and all pages menu

Next, hover over the Pages tab.

Then, click the All Pages button.

Image of WordPress pages page

Your Blog page will now display your blog articles.

And your Home page will now display as a separate page that is accessible through your Home button link.

Let’s say you want to link an article or another type of post as a menu button at the top of your website.

This can easily be achieved by using a custom-linked menu button.

For this example, I will create an article about starting a blog.

Then I will create a custom linked menu button that will link to my article. Here is how to do it.

Image of WordPress posts and add new menu

From your WordPress dashboard, go to the left-hand menu and hover over the Posts tab.

Next, click on the Add New button.

Writing and publishing an article on WordPress

Step 1. Type the name of your article in the text box.

Step 2. Write your article in the text body area.

Step 3. Once you are done, click the Publish button.

Imag of clicking your article link

Click your Article’s Permalink.

Image of saved WordPress blog post

Your article is live and can be viewed by your website visitors.

Image of going back to WordPress dashboard

Click the back button on your browser to get back to your WordPress dashboard.

Image of copying article link address

Right-click on your article link.

Then when the pop-up menu appears, left-click on the Copy Link Address option.

This will copy your article link to your clipboard so you can paste it into another text field later on.

Image of appearance and then click menus button

On the left-hand menu, hover over the Appearance tab.

Then, click on the Menus button to proceed.

Image of custom links drop-down menu

Click on the Custom Links drop-down menu.

Image of adding custom link to menu

Step 1. Right-click and paste the link you copied earlier into the URL box.

Step 2. Type the title of your article into the text box.

Step 3. Once you have finished, click the Add To Menu button.

Image of custom linked page added to you menu

Your custom link page will show up on your main menu.

Image of clicking and dragging custom link box

Click and hold to drag your custom link anywhere under your Home page.

Make sure your Home page is always at the top of the menu.

Image of custom link click save menu button

When you have finished moving your custom link, click the Save Menu button.

Go to website homepage

Step 1. Hover over your Website’s Name, right next to the little tiny home icon.

Step 2. Click on the Visit Site icon.

Image of custom link on the navigation bar

Once you are on your homepage, you should see your new custom-linked article on the top menu.

And that’s how you link a post to a page. It works with linking pages as well.

You can even make a custom link that takes you to another website if you so choose.

How To Create A WordPress Dropdown Menu

When creating your blog website, you may want to have a dropdown or sub-menu that branches off of your main menu.

This is quite simple and will only take about a minute to complete. With that said, here are the steps to take.

Image of appearance and then click menus button

Go to Appearance.

Then, click on the Menus option.

Image of placing custom link inside my blog page

Step 1. Choose the page you want as the sub item

Step 2. Place that page under what you want to be the main page. Then click and drag to the right until it is indented underneath.

Page is now a sub item

For example, The Start A Blog page is now a sub-item and will appear underneath The Blog page as a dropdown item.

Image of WordPress sub item click save menu button

When you have finished creating your sub-item, click the Save Menu button.

Go to website homepage

Step 1. Once again, hover over your Website’s Name.

Step 2. Finally, click on the Visit Site button to go to your live website.

Image of finished sub item menu

When you arrive at your website’s homepage, you should see your nested submenu item underneath the main menu page you chose.

And your all set.

How To Setup WordPress Navigation Menus – Article Conclusion

I know it may seem like that was a lot of steps to follow. However, once you get the hang of it, you’ll be customizing your navigation menu in no time.

I should also mention, that there are several WordPress menu plugins available that will allow you to customize your menu even further.

These plugins can customization of menu colors, hover animations, and even the ability to place the menu in other locations on your website.

The Color Lib website has a great article on the top WordPress menu plugins. You can check it out by clicking this link right here.

I highly recommend giving it a read.

If you are interested, you can also check out my article on how to start a blog.

This article will take you step-by-step through the blog creation process. It’s a definite must-read for sure.

And that concludes my article on how to set up WordPress navigation menus.

I want to thank you for giving me your time, and I hope this article is helpful for you.

Thanks again for your time. Please take care and have a good day.

Similar Posts