How To Place Menus On Every Page In WordPress

Last update: 04/10/2024
How To Place Menus On Every Page In WordPress

Would you like to know how to have Menus on every WordPress pageThere are many cases where you need different menus on different pages.

  • E.g., you may have a one-page website but want a dedicated shop or contact page. In this case, the top menu navigation links cannot be used on those separate pages (e.g. contact or shop) as they are set up to guide users through different sections on the same page (e.g. your homepage).

Another case could be when users are on your store page. Since that page has a different function than the rest of the website, you might want to use the top menu to display your product categories or other relevant information for those looking to make a purchase.

Here you can read about: Ways To Add A Subscription Form In WordPress

To achieve the desired result, you need to create menus on each WordPress page for each of these scenarios and display them only on those pages. Fortunately, since WordPress has such a large community behind it, you can achieve this with the help of a free plugin.

Methods to have menus on every WordPress page

Now, let’s see how you can place menus on every WordPress page:

Method 1: Menus on every WordPress page

These are the steps you need to follow to have menus on every WordPress page:

Part 1: Install a free plugin to have menus on every WordPress page

To set up a different menu for a given page, you will need to use the Conditional Menus plugin. To install it, follow the steps below:

  1. Step 1:: From your WordPress dashboard, head to Plugins → Add New
  2. Step 2: In the search bar, search for "Conditional menus» and install the first result ( screenshot )
Conditional menus
Conditional menus
  1. Step 3:: After it is installed, click on Activate.

Part 2: Create different menus for different pages

To create the menus for each page it is necessary:

  1. Step 1:: Go to WordPress Dashboard → Appearance → Customize → click on Menus
  2. Step 2: Add a new menu, let's call it "Contact page menu» (or any other name)
  3. Step 3: Add menu items for each page or custom link and click Publish
  4. Step 4: Repeat the process for all other menus you need.

Part 3: Manage the location of each menu

Go to Appearance → Menus → Manage locations and start customizing your menus on each WordPress page by following these steps:

  1. Step 1:: Click + Conditional menu to add a new menu in the same location (e.g. Main Menu)
  2. Step 2:: Select the menu you want to add
  3. Step 3:: Click + Conditions to select the places where you want that specific menu to appear
  4. Step 4:: Click Save Changes and visit the page to make sure it is working properly;

Repeat the same process for any number of separate pages.

Method 2: How to Create Different Menus on Each WordPress Page

The menu is the basic content of every website; it helps visitors find the pages they need easily. However, on websites with complex structures, you may want each group of pages to have separate menus. To customize them that way, you need a plugin to create different menus and assign them to your pages/group of pages.

In this method, we will show you in depth how to do it in the quickest way. But first, let's see how creating separate menus for each page can help you in particular situations.

Part 1: Use Menu Maker Apps on Every WordPress Page

Having separate menus for each page can help you if:

  1. You want to display product pages in the home page menu. Each product page will have a particular menu that has submenus linked to product information pages. For example, the product page menu will contain information such as price, country of origin of the corresponding product.
  2. You have a chain store website and each store is represented on a separate page. The home page menu will direct to the store pages. Each store page will have its own menu of essential pages such as products, address, order, etc.
  Hostgator. Plans, Prices, Alternatives, Advantages

To make it easier to understand, we will take an example of a fruit business website. The website has a default menu on the homepage that leads to two pages, Apple and Banana.

How To Place Menus On Every Page In WordPress

We will create two more separate menus for these two pages using the Conditional Menus plugin. Here are the steps to do so:

Part 2: Install and Activate the Conditional Menus Plugin

Conditional menu plugins are free and available at wordpress.org You simply need to install and activate it like any other free plugin.

  1. Step 1:: Next, head to AppearanceMenus, change to Manage locations and you will see the + Conditional menu added by plugin:
Manage locations
Manage locations

Part 3: Create the menus for each WordPress page

  1. Step 1:: Now we will create separate menus for the Apple and Banana pages. To do so, we will AppearanceMenus > Edit menus > create a new menu .
Appearance > Menus > Edit Menus > Create a new menu 
Appearance > Menus > Edit Menus > Create a new menu
  1. Step 2:: Next, we will give the menu a name, choose the menu display position (I want to display it in the header), and then click Create menu.
Click Create Menu.
Click Create Menu.
  1. Step 3:: In the section Add menu items, you need to add pages as submenus. Add two pages that are Apple OriginApple Price al apple menu. Click in Save menu.
Add menu items
Add menu items and click in Save menu
  1. Step 4:: Now do the same steps to create a separate menu for the page Banana:

Click Save Menu

Part 4: Set up menus on each WordPress page (accordingly)

  1. Step 1:: Still in AppearanceMenus, change to Manage locations and choose + Conditional menu:
Manage locations and choose + Conditional menu
Manage locations and choose + Conditional menu
  1. Step 2:: From the list, choose a menu (I'm choosing the Apple Menu). Click on + Condition to set where to display it:
Click on + Condition
Click on + Condition

NOTE: : A new popup will appear and you will see different tabs to choose from. You can choose to display the menu on each category, post type, taxonomy, user role or home page, 404 pages, etc.

  1. Step 3:: Choose the tab Pages and the Apple Page to set the menu on this page.
Choose the Pages tab and the Apple page
Choose the Pages tab and the Apple page
  1. Step 4:: Do the same with the Banana Menu.

Choose the Pages tab and the Apple page

  1. Step 5:: Finally, don't forget to click on Save Changes, or everything you've done will disappear.

Now you need to go to the WordPress interface to check the result.

Click Save Changes
Click Save Changes

As you can see, the Home page, Apple page and Banana page now have three different menus.

Types of Menus on each WordPress page

Convenient navigation on a website is vital. Therefore, it is crucial to create a custom menu per page that is well organized and easy for the user to follow. However, the website does not always need a uniform menu on all pages because each page has its own purpose. Do you want to create different menus on each WordPress page? Let's see below which are the best options you can use:

Best plugins for different menus on each wordpress page

Imagine, you have a one-page website. There you need a separate page with a contact form and a chatbot or a relevant shop page. And it is impossible to implement them technically because they will only guide users through the different sections of the landing page.

Let's say visitors landed on your store page. You need to have a special menu in the header to display product categories, Shipping information, button Add to cart, etc. However, you may face the same problem as in the above case. Or you may see that the homepage menu is duplicated on the store page.

It won't work properly, right? Every page must have a relevant menu. However, it can be difficult to implement them across different pages. Don't panic, Here we offer you a lot of solutions to meet this need. But before we tell you how to create menus on each WordPress page, let’s focus on the main tools that will help you set up a custom menu per page.

  Consumer electronics strategy: keys to competing

1. JetBlocks

Let's start with JetBlocksThis plugin allows you to create specific headers and footers that perfectly fit the needs of your website. With JetBlocks, it is very easy to add the necessary elements to a header and create a custom menu:

  1. Login forms
  2. Registration forms
  3. Search forms
  4. and WooCommerce cart,
  5. Navigation menu
  6. Expandable panels.

Additionally, you can add and customize your website logo, insert authorization links and other elements to create an impressive custom menu per page.

You can download it from here

2. JetMenu

JetMenu is at your disposal to design the mega menu. With the help of this plugin, you can create and customize each item, add various elements and badges and make them your own as well.

Moreover, you can change the background of the menu items, design the menu typography, apply Hover mode, etc. We bet that the possibilities of the JetMenu plugin are limitless. It is one of the best tools to create menus on every WordPress page.

You can download it from here

3. JetThemeCore

With JetThemeCore, you can create custom theme templates and templates for pages like 404. And of course, create unlimited headers and assign them for different pages. The process is intuitive and well-crafted, so you don't need any extra knowledge of writing code or anything else. If you only have the JetThemeCore plugin, it will be enough to create one custom menu per page and add any specific content to it. At least, you can use the pre-made header and make some changes there.

You can download it from here

How to set up and create menus on each WordPress page

First, make sure you have all the necessary plugins installed. If you already know how to create headers, skip to the section on designing menus and setting them up on different pages. Now, let's get down to business.

Part 1: Simple Header with Mega Menu Widgets

  1. Step 1:: To add a header to your website. There you will see the parts of the theme,where you will add the header.
  2. Step 2:: Click the button Add new, Select the template typeheader and choose a name for it.
  3. Step 3:: You will be redirected to the Elementor page where the magic will begin.
  4. Step 4:: Add a section and choose the appropriate layout, for example, Content Width: in box, set the parameters you need.

Widgets in the menus on every WordPress page

Mega Menu Widgets are worth your attention if you want to create a custom menu per page that looks spectacular.

  1. Step 1:: Look for the Mega Menu Widgets in the items panel.

NOTE: : There are two options available: Vertical Mega Menu and Mega Menu simple

  1. Step 2:: Now, we will focus on the last one. After dragging the widget, you can see the settings tabs on the left sidebar.
  2. Step 3:: Seeks Content, unfolds General and Select a menu there.
  3. Step 4:: Choose between Menu Screen or return to WordPress Dashboard — Appearance  Menus.
  4. Step 5:: Now select the menu you want to work with or create a new one.
  5. Step 6:: Once you create a menu, you will see it in the list of available menus in Elementor.

NOTE: Don't forget to set up the menu for both desktop and mobile versions of your website to ensure it has a responsive design.

In the  Style, you can customize your future menu: set alignments, change the background, border type or box shadow. Find the one that suits you best.

Additionally, you can style the fonts and change the hover and active states. If you have some submenu items, change them using the settings tab. Desktop menu items.

Setting up menus on each WordPress page
  1. Step 1:: To set this header in a specific location, go to Header Settings in Elementor.
  2. Step 2:: This menu will help you change the header state and set the conditions under which it will be displayed via a drop-down menu: the entire website, individual page, or archive page. For example, choose the entire site.

Part 2: Mega Menu and JetMenu plugin

As we already know, JetMenu is special because it allows you to add any content to your conditional menus. Let's make use of its unlimited possibilities together.

  1. Step 1:: In the WordPress Dashboard – Appearance – Menus.
  2. Step 2: Find the menu you want to customize or create a new one.
  Hostpapa. What It Is, Plans, Prices, Support, Alternatives

NOTE: : If you want to create a menu with some detailed submenus, you will need to add some more menus through the same tab WordPress Menus. So for each category you have in the main menu, you need to create several different submenus.

Setting up menus on each WordPress page with JetMenu
  1. Step 1:: In each menu item, look for a JetMenu item, where you can play with the settings.
  2. Step 2:: Enables the Mega submenu and press Edit the content of the Mega menu item to enrich your menu with other items and customize the elements.
  3. Step 3:: On the Elementor page, choose a section with the required number of columns.
  4. Step 4:: Drag the Vertical Mega Menu widget to the first column, in the content tab on the left sidebar
  5. Step 5:: Select the menu you want to insert.
  6. Step 6:: Finally, add the submenus you created in the WordPress admin panel. You can easily copy the widget and paste it into the second section.

After this, you can use the tab Style and customize the elements, set the width, height, typography, space needed, etc.

In JetMenu main settings, you can view the Mega Menu position, add any icon to your menu (select from pre-made ones or upload svg file), apply any text badge to the menu item, customize the menu size, etc.

Professional advice

Using Elementor, add a header above the menu (e.g. copy from the previous page), insert particular elements with the JetBlocks widget, and update it.

However, we have a problem setting up this menu on another page. To deal with this, do the following:

  1. Step 1:: go to Theme Builder Again, create a new header template, copy the header, or create a new one
  2. Step 2:: Select the Mega Menu you just created in the tab General configuration to display it and add the Breadcrumbs widget.
  3. Step 3:: In the Header Settings: Conditions tab, select Singular and Cover to place the header you created on your home page and leave the header you created previously on the other pages of your website.

Part 3: Create Menus on Every WordPress Page (Dropdown Menu)

Let's say you have a separate page with a contact form and you want to give it a different header. Just follow these steps:

  1. Step 1:: Create a new template in the theme builder, copy the top part of the main header and at this stage add a dropdown menu.

NOTE: : The essence is the same, you can add the existing menus or create the new custom menu per page according to your needs: simple menu or mega menu with variable items. Change the container position, play with the settings, style it, etc.

  1. Step 2:: Finally, set this particular header for the specific page, using the option Singular tab Terms and conditions and indicating the name of your Contact page.

You may also be interested in reading about: How to Create a Dropdown Menu in WordPress

Conclusion

That’s all for the ways to create menus on each WordPress page and configure them. We only gave three of them, still, we are pretty sure that there are other methods to create a custom menu per page.

As you can see, using conditional menus to create different menus for different pages is very simple and useful. Moreover, the plugin also gives you flexible options to create separate menus for post types, category, taxonomy, user role, etc., or even 404 pages.