By default, how a menu appears on your WordPress website is determined by the theme you use. In most websites, a menu is typically placed on the header section. One question, is it possible to have multiple menus on a single WordPress site?
You already know that WordPress is fully customizable. You can make customization according to your needs, including when you need to create a different menu for a different page. This article will show you how.
Remember again. A menu is usually lies on the header section of a website. With this concept in mind, you can create multiple headers on your WordPress site and then add a different menu to each header. You can assign each header to a specific page, blog post, archive page, or even custom post type. How to create a custom header in WordPress? Two plugins we recommend the most are Divi Builder and Elementor. In this article, we will show you how to create a custom header using Divi Builder.
How to Create a Different Menu for a Different Page in WordPress
There are two steps to create a different menu for a different page in WordPress:
Step 1: Create the Menus
Since you want to display a different menu on a different page, you need to have multiple menus on your WordPress site. WordPress itself allows you to create multiple menus on a single site. To create a new menu in WordPress, go to Appearances -> Menus. On the menu manager page, click the create a new menu link to create a new menu.
Give your menu a name and simply click the Create Menu button. You don’t need to make any setting since you want to use the menu on the custom header.
Next, go to the Add menu items column to add the menu items. You can add whether a page, a blog post, a category page, or even a custom link as a menu item. Click the Add to Menu to add the item to the menu.
Click the Save Menu button to save the menu.
You can repeat the steps above to create more menus.
Step 2: Create the Custom Headers
Before we continue, make sure you have installed and activated the Divi Builder plugin. If you use Divi or Extra theme, you don’t need to install the Divi Builder plugin anymore as it is an integral part of those themes. You can get Divi Builder on its official website.
Once you are ready, go to Divi -> Theme Builder on your WordPress dashboard. On the Theme Builder page, add a new template by clicking the plus button. Select a page where you want to assign the header to and click the Create Template button.
Click the Add Custom Header -> Build Custom Header to start creating the header template.
On the appearing dialog, select the leftmost option and click the Start Building button.
Add a row (by clicking the green plus button) and select a column structure according to the concept of the header design you want to create.
Specify a column where you want to place the menu and click the grey plus button to add a module. Select the Menu module.
The Menu module settings panel will appear right after you add the Menu module. On the Content block under the Content tab, select a menu you want to use on the Menu option.
If you add the search icon and the shopping cart icon, you can open the Elements block. To style up the menu, you can go to the Design tab on the settings panel. Make sure to click the green checklist icon on the bottom-right corner of the settings panel to apply the changes.
You can add more modules to other columns on the row on your header section. You can also customize the section as well as the row. For more detailed instructions on how to create a custom header in Divi Builder, you can refer to this page.
Once you are done creating the header, click the Save button on the bottom-right corner. Next, click by the X icon on the top-right corner to exit the editor.
You will be taken back to the Theme Builder page after clicking the X icon above. Click the Save Changes button to apply the changes.
Now try to visit the page you have assigned the custom header to and you should see a different header, as well as the menu. You can repeat the steps above to create a custom header for other pages. Just make sure to use a different menu when creating a new custom header.
To streamline your workflow, you can save the header to the Divi Library for recurring use. To do so, click the down arrow icon on the Divi Builder editor. Give your custom header a name and click the Save to Library.
Add a new template by clicking the plus button. Once the template is added, click Add Custom Header -> Add From Library.
On the appearing library window, click the Your Saved Layouts tab and select the custom header template you have saved above.
