Home
/
WordPress Tutorials
/
How to add a WordPress menu

How to add a WordPress menu

A well-designed and intuitive WordPress menu is a feature that significantly enhances the user experience. It makes navigation seamless and clearly outlines your website’s structure.

WordPress provides various tools allowing users to create functional and versatile menus for their websites. This guide will delve into what a WordPress menu is and how to add a menu in a WordPress site.

What is a menu in WordPress?

A WordPress navigational menu is a website section with links to important content. It remains visible on all pages and sits in an area visitors can easily spot. Furthermore, a menu helps them navigate between the pages and highlights essential parts of your website.

What is a menu in WordPress

You can easily create new menus, rearrange, add or remove menu items, and customize the existing ones. You can also create sub-menus and drop-down menus.

The menus can contain links to different types of content – pages, blog posts, social media icons, custom URLs, and post categories.

Your WordPress theme defines the location of the menu. By default, most themes visualize it at the top of the page. However, many themes allow you to place secondary menus in other areas, such as the footer or the sidebar.

Why should you add a navigation menu to your website

Studies show that there are over 1.9 billion active websites worldwide. With such enormous competition, you need to use every trick in the book to make your website stand out from the pack.

A navigation menu is a feature that leaves a great impression on your visitors and makes their user experience smoother. It serves as a road map, guiding your visitors to the key sections of your website. Using the menu, visitors can easily navigate through your website.

Furthermore, a menu outlines the website’s structure helping you to divide the content into relevant categories. This way, users won’t feel lost and will always find their way to the content that interests them.

As a result, a well-designed menu elevates your website reputation and helps to distinguish your brand from your competitors.

How to create a menu in WordPress

Creating and managing menus is done from the WordPress dashboard. To access the menus’ options, log in to your website’s dashboard and navigate to the section Appearance > Menus.

How to open the Menu section in a WordPress dashboard

To create your first menu, fill in the details under the section Menu structure. Assign a name in the field Menu name, select the location from Menu Settings > Display location, and hit Create menu.

How to create your first WordPress menu

To create another menu, use the “create a new menu” button that appears in Edit Menus after you have built the first menu.

How to create a new menu

How to add a menu item in WordPress

You may have noticed that the left section Add menu items was greyed out before creating a menu. That’s because there was no menu to add items to.

Now that you have an existing menu, this section is available. By default, you can choose between four groups of links:

  • Pages – links to published pages on your website. Most recent shows the latest page you posted. View all lists all published pages.
  • Posts – allows you to add links for published posts. Similar to Pages, you can select the latest published post from Most recent or see a list of all posts from View all.
  • Custom link – you can insert a URL link to a page into the menu.
  • Categories – lets you add your post categories as menu items. From the Most used section, you can see the category of the most visited posts. View all shows all categories.

Depending on the theme or plugins you use, your website may contain additional link groups.

Types of Menu items

To select an item, expand one of the groups and tick the box next to it. You can add multiple items from the same group by ticking their respective boxes.

Alternatively, you can choose Select All to select all items from the group. Once you have made your choice, click Add to Menu.

How to add an item to a WordPress menu

The selected items will appear as tabs one under another in the Menu Structure on the right. Each tab is named after the item and indicates the link type – page, post, custom link, or category. To save the changes, hit the Save Menu button.

Save added items to a WordPress menu

You can opt to add new top-level pages to the menu automatically. Under Menu Settings, tick the box for Auto add pages – Automatically add new top-level pages to this menu.

How to edit a menu in WordPress

You can edit the existing menus from the same dashboard section in which you created them – Appearance > Menus. If you have created multiple menus, select the menu you wish to edit from the drop-down list Select a menu to edit and press Select.

How to select a menu to edit

The menu items load under the section Menu Structure. You can add new items or rearrange, delete, rename and modify the existing items.

How to remove a menu item

In case you need to remove one or several links from a menu, press the Bulk select button, which enables checkboxes in front of each item. Tick the items you wish to remove and hit Remove Selected Items. To confirm the change, press the Save Menu button in the lower right corner.

How to remove items from a WordPress menu

How to change the order of the items

Rearranging the order of the items is as simple as dragging them and moving them around. The current order is visually represented by the top-down order you see in the Menu Structure.

To move an item up or down, simply click on it and hold down the mouse button. Then, drag it to push the other items, place it in the preferred position and release the button. To confirm the new order, click on Save Menu.

How to change the order of menu items

How to change the menu location

The active WordPress theme determines the location of the menu. At a bare minimum, most themes provide two menu locations – primary and secondary.

Usually, the primary location is positioned at the top of your pages, while the secondary location is in the lower section. However, some themes present several other options – the footer area, the sidebar, off the canvas, etc.

Once you select the menu, you can change the location from Menu Settings > Display location. You will see the theme’s default menu locations, and you can choose one or multiple positions for the selected menu by ticking the corresponding boxes. As with any edit, confirm the changes with the button Save Menu.

How to change the location of a WordPress menu

You can simultaneously edit the location of all existing menus from the tab Manage Locations in the section Appearance > Menus.

The column Theme Location lists the pre-defined menu locations for the theme. In the column Assigned Menu, you can see a drop-down list showing the menu displayed in the respective location. Choose the menu for each location and confirm with the button Save Changes.

How to change the location of all menus

How to create a drop-down menu in WordPress

Drop-down menus are multi-level menus consisting of parent items in the main menu and child items showing when you hover over a parent item. They are also called nested menus.

They are a perfect solution when you want to include more items but keep your main menu clean and organized. Instead of cluttering your main menu with all items, you can group items sharing a common trait and nest them under a parent item.

Creating drop-down menus is quite simple in WordPress. In the section Appearance > Menus, go to Menu Structure, where the menu items are listed.

Click on the item you wish to be nested and hold down the mouse button. Place it slightly to the right under the parent item and release the mouse. The nested item will be labeled sub item and will be inlined under the main item.

How to create a drop-down menu

You can also create several levels by nesting an item under an already nested item. To confirm the new structure, press the Save Menu button on the same page.

Below, you can see how the drop-down menu appears on the front pages.

An example of a drop-down menu

If you wish to move back a menu item one level up, simply click the item and hold the mouse button. Then, drag the item tab on the left until it levels with the other upper-level items and release the mouse.

Alternatively, you can click on the arrow in the item tab and select Out from under [the parent item].

How to move a sub-item one level up

How to add menu categories

If you’re running a blog, adding post categories to your menu can help visitors navigate the various topics and find posts more easily.

You can add categories just like any other menu item. In Appearance > Menus, select the menu, and from Add menu items, choose Categories.

How to add categories to a WordPress menu

From the tab Most Used, you can see the category with the highest number of posts. View All shows all existing categories. You can also search for a category with the Search tab.

Tick the boxes for the categories you want to add and press Add to Menu. They will show as items in the menu under Menu Structure.

You can then rearrange them just like any other item. Usually, the categories are nested under a main item combining several categories.

How to add custom links to a WordPress menu

Apart from your website’s pages, posts and categories, WordPress menus can also contain custom links to external addresses. You can add a link to another website you own, a social media profile, your online store, etc.

To add a custom link, go to Appearance > Menus and choose the menu. In the section Add menu items, select Custom Links and fill out the form. Type the address of the link in the field URL. In Link Text, write the link’s navigation label that will appear in the menu.

Press the button Add to Menu, arrange the link’s order in the menu and confirm the change with Save Menu.

How to add custom links to a WordPress menu

How to add a menu to the sidebar or the footer

The menu locations are pre-determined by the theme you are using. Usually, there are a couple of options: add the menu to the top (header) or the bottom part of pages.

Some themes feature additional locations, like the sidebar or the footer. But even if your theme doesn’t support them, you can still add your menu to these areas via widgets.

Go to Appearance > Widgets from your WordPress dashboard and select the sidebar or footer area.

Widgets section in a WordPress dashboard

IMPORTANT! Keep in mind that your theme may not support a sidebar. Consider installing a sidebar plugin or switching to another theme featuring a sidebar.

Press the Toggle block inserter (+ sign) button, and from the Widgets group, select the Navigation menu. WordPress will create the menu widget in the area you choose.

How to add a widget to the footer area

 

Select one of your existing menus from the drop-down list in Select Menu. Optionally, you can add a Title that appears above the menu. Confirm the changes with the Update button.

How to choose the menu for the widget and add a title

Below is an example of how the menu appears in the footer and the sidebar.

An example of a page with menus in the footer and the sidebar

How to add a menu in Full Site Editor (FSE)

WordPress 5.9 introduced a new method of editing your website appearance called Full Site Editing.

It allows you to build your website presentation from the ground up directly in the Gutenberg Block editor. Using blocks, you can create a custom menu in WordPress effortlessly.

The Full Site Editing is in testing phase, so it is compatible only with a few themes. So far, the feature works with the WordPress-native themes TwentyTwentyTwo and TwentyTwentyThree.

You can tell whether your theme supports Full Site Editing when you go to the section Appearance. The standard sub-sections Customize, Widgets, Menus, Background, and Theme File Editor will be gone. Instead, you will see the single option Editor. Clicking on it loads the Gutenberg Block Editor, where you can customize your website’s look.

Appearance menu for a theme compatible with the Full Site Editing

Inside the block editor, click on the page section where you want to place the menu. Press the Toggle block inserter (+ sign) button on the top left corner or the Add block (+ sign) button in the lower right corner of the highlighted section.

How to add a block in FSE for a menu

The left sidebar will expand, showing all types of blocks. Click on the Blocks tab, and from the section THEME, select Navigation.

How to add a navigation block for a menu in FSE

The editor will create a block for the menu where you can add your links. Initially, there will be a single slot with the text Add link. Click on it, and from the pop-up toolbox, select Link. Another window appears, where you can add an URL or search for a page, post, or category on your website. You can also use the Transform feature to turn the menu item into a search bar, social icon, or site logo.

How to add a link to a menu in FSE

Once you have added the menu item, you can repeat the process and create more items. Hover over the menu block to highlight it, and press the Add block button on its right corner. Then, select Link from the pop-up toolbox and add the desired link.

How to add a second item to a WordPress menu in FSE

After you have formed the menu, you can tweak its settings. The editor’s right sidebar is the Settings section. If it is hidden, click on the Settings icon to expand it. It provides contextual options according to the selected block. To ensure you are editing the menu, click on the menu to highlight it, and press the Block tab under Settings.

Menu Settings in Full Site Editor

 

Here, you can change the menu’s justification on the page, the orientation (vertical or horizontal), the font color and size, the background color, and other settings.

You can also insert one of your previously created menus in the block instead of building a menu from scratch. To do so, in the Settings section, open the drop-down list for Menu and select one of your existing menus.

How to add an existing menu to a navigation block in FSE

A few parting tips

To sum it up, a well-designed and functional menu is crucial to your website, elevating the user experience. It makes navigation seamless and helps you steer visitors’ attention to the essential sections of your website.

In this regard, WordPress accommodates various tools to create rich and functional menus effortlessly.

Finally, here are a few tips to consider when crafting your menus.

Make your menu easy to spot

It won’t matter how good your menu is if visitors don’t notice it. The most common practice is placing your menu in your web pages’ upper section(header). This way, the menu will be one of the first things visitors see when they visit your website. You can also place menus in the sidebar and the footer to emphasize them.

Use colors and design that distinguishes the menu from the other parts of your website.

Pay attention to the menu order

Users tend to focus on the first and last item in a list. Thus, you should bookmark the essential website links on these positions in your menu. Place the less significant links in between. As a common practice, put your Contacts section last.

Keep only the essential links in the main menu

An overcrowded menu can overwhelm your visitors with too much information. They would not bother reading it and leave your site shortly. Keep your main menu minimal, with only the most crucial sections listed. If you want to include more items, use drop-down menus.

Use descriptive titles for the menu items

Avoid using generic link titles that hold no valuable information. Use descriptive titles that summarize the purpose of each section. For instance, name your online store’s link “Store” or “Shop.”

Tutorial Menu

Share This Article