How to Create and Add Navigation Menu in WordPress

The navigation menu help your visitors easily find important sections of your site by clicking on the links in the menu.
So, how to create and add navigation menu?? Let’s start!

Source: youtube

Click on the “Appearance” tab on the left-menu of your Dashboard. Then click on “Menus”.
We create a new menu called “Main Menu” by typing that name in the “Menu Name” box and then click “Create Menu”.

menu create1

Create Menu

Adding pages to menu

Now we can begin adding the items to the menu that we created previously. For example, you can add a link to a page that you created previously. To do this, click on the “Pages” section of the menu editor.

menu addpage

Adding page to the menu

This action will show you all of the pages that you have created. If you have not created any pages yet then this area may be blank or may show a “Sample Page” (You can review how to create a new page in the previous step).
Selecting the pages that you want to add to the menu by clicking the checkbox next to that page and then click “Add to Menu”.

Adding Custom Links to Menu

If you want to add one more item to the navigation menu, you can also add a link to the homepage of your website.
The first step, you click on “Custom Links”. Then entering the URL that you want. This is just your domain name with “http://” in front of it (In this example I am using http://sharepress.net/)
You need to enter the text you want to appear in the menu for this link in the “Link Text” . Once you have entered your URL and link text, click “Add to Menu” button.

menu customlink

Custom link

You can also remove the items you added previously and change the menu’s navigational title. Then you click “Save Menu” to save the changes  you just made.

menu remove

Add a Post to Menu

By defaults, Customize Menu screen in Dashboard don’t display “Posts” option, so if you want to add a post to the navigation menu, you have to click on “Screen Options” to display “Posts” option.

menu post

Now click the arrow next to the “Posts” option and select the post you want, then click on the “Add to Menu” button

menu post1

If you want to change the positions of menu items, you simply drag and drop a menu item to adjust its position in the menu and repeat the process for other theme locations.
You can also create navigational menus with parent and child menu items (drop-down menus). It means that when users takes their mouse to a parent item, all their sub-menus are displayed.

menu drop down

In your “Menu Structure” area, slightly drag the menu item to the right the menu item just below the parent item, it will automatically become a sub-menu item.

menu remov2e

Note: not all themes support multi-layer nested menus (most do up to 2-layers).

Add the menu to Website

Now that we have created the navigation menu and we need to add the menu to our website. We can check the box next to “Primary Menu” in “Menu Setting” area, then click on “Save menu” button.

menu primary

We can also click on the “Manage Locations” tab. In this example we will add the menu we created (Main Menu) to the “Primary Menu” area. Simply use the drop-down box to select the menu and lastly click “Save Changes”.

menu primary2

Adding Navigation Menus in Sidebar

menu widget3

Beside to the designated menu locations set by themes, you can also add custom menus in your sidebar with other widget-ready areas.
Go to Appearance » Widgets and add “Custom Menu” widget from the list of available widgets to a sidebar.

menu widget

Appearance » Widgets

Then you need to provide a title for the widget heading and select one of your custom menus that you created from the select menu drop down list. Don’t forget to click on the save button to store your widget settings.
In fact, there’s also a “HTML box” where you can use HTML code. For beginners, don’t worry about this bit –you just drag and drop the elements in your sidebar to your liking.

menu widget2

Now you can visit your website to see your new custom menu displayed in your sidebar widget.

———

We hope this tutorial helped you learn how to add navigation menus in WordPress. You may also want to check out our guide on how to customize theme in WordPress in next step or other instructions in this series
See you soon!

Leave a Reply

Your email address will not be published. Required fields are marked *