You have just installed WordPress and your site is starting to take shape. Your pages are created, your articles are published.
And yet, something is wrong: your visitors are not easily finding what they are looking forThe reason is often simple: your WordPress menu is not yet configured correctly.
A well-designed navigation menu is much more than just a list of links. It's the guiding thread that directs your visitors, structures your content, and, incidentally, sends positive signals to search engines.
Neglecting this element means risking losing visitors in the first few seconds.
In this article, we explain Everything you need to know about menus : how to create them, customize them, position them. And this applies whether you are using a classic theme or a block-based theme.
As a bonus, you will also find tips for going further in managing them.
Introduction to WordPress menus and their role in navigation
A WordPress menu is an ordered list of links displayed in a specific location on your site. As indicated The WordPress documentationThis refers to "a section of the site that helps visitors navigate" your content.
Generally, a menu is located at the top of the page (main navigation menu), as on our website. WordPress agencyWP Maintenance:
However, it can also appear in a footer (footer), a sidebar (sidebar) or any other location defined by your theme.
Its primary role is to facilitate navigation: a menu allows your visitors to quickly access the pages, categories, articles, or URLs of their choice. But its importance extends far beyond this functional aspect.
Indeed, a well-structured menu is strategic for your site on several levels:
- User Experience (UX) A clear menu reduces bounce rate and increases time spent on the site. Your visitors stay if they find what they're looking for.
- Natural referencing (SEO) Search engines analyze the navigation structure to understand your site's architecture. A coherent menu facilitates the indexing of your pages and enhances your internal linking.
- Branding Navigation reflects the organization of your business. A well-designed menu inspires confidence and professionalism.
In practice, a WordPress menu can contain different types of elements: pages, posts, categories, tags, custom links (to an external URL or a specific section) or even CPTs (Custom Post Types) if you have custom content.
It's important to note that WordPress allows you to create multiple separate menus on the same site, each assigned to a different location. This flexibility is a real advantage for adapting your navigation to your needs.
What are the characteristics of a good menu?
In practice, creating a WordPress menu is not enough: it also needs to be truly effective.
A poorly designed menu can frustrate your visitors and harm your SEO, even if your content is high quality. So, what does a good menu look like?
In our opinion, it must meet several essential criteria:
- Simplicity above allAn overloaded menu loses visitors. Limit yourself to 5 to 7 main items, reserving sub-levels for categories that truly warrant them. Each item must have a purpose.
- Clear and explicit wordingAvoid vague or creative formulations like “Universe” or “Discover”. Opt for direct titles — “Services”, “Blog”, “Contact” — that the user understands immediately, without any need for interpretation.
- A logical hierarchyThe organization of your menu should reflect the structure of your site. The most important and most visited pages occupy the top positions. Submenus group together content that is naturally related to each other.
- Responsive navigation. More than 60% of global web traffic Today, this comes from mobile devices. A good menu adapts to all screen sizes, with a functional hamburger menu on mobile and sufficiently large clickable areas.
- Consistency with your objectiveYour menu should guide visitors to your key pages, the ones that convert. If your priority is getting in touch, the "Contact" element should be visible and accessible with a single click from any page.
In summary, a good WordPress menu is invisible in the best sense of the word: it goes unnoticed because it works perfectly.
The visitor finds what they are looking for without having to think about it. This is precisely the goal you must keep in mind when designing it.
Where can I create and edit a WordPress menu?
Speaking of which, there is one very important piece of information to keep in mind before you start creating a WordPress menu.
The procedure will depend on the type of theme you are using. To understand this better, consider the two possible scenarios:
- You are using a classic theme (like Astra, GeneratePress, or any theme developed before the block-based era)? Menus are managed from the WordPress admin interface, via the following path: Appearance > Menus. You have a dedicated, intuitive panel with drag-and-drop options.
Another option: use the Customization Tool (Customizer) in Appearance > Customize > Menus. - You are using a block-based theme (also called FSE for Full Site Editing, like Twenty Twenty-Five, for example)? Menus are no longer accessed via Appearance > Menus. This path no longer even exists on your dashboard. Navigation is managed directly from the site editor (Appearance > Editor), by inserting a "Navigation" block in your header or page templates.
Not sure which theme you're using? Go to Appearance in your dashboard. If you see a "Menus" option, you're using a classic theme. If you don't see it and an "Editor" option is available instead, you're using a block-based theme (FSE). Below, you can see that we're using a block-based theme, for example.
How to create a WordPress menu with a classic theme?
Step 1: Creating the WordPress menu
Go to your WordPress dashboard, then click on Appearance > Menus. You will arrive at the menu management page.
Give your menu a name, for example, "Main Menu". This name is only visible in the administration panel, not on your website..
Continue by selecting a display area for your menuFor example, "Main Menu". Finally, click the "Create Menu" button to confirm.
Your menu has now been created. It is currently empty. Let's move on to the next step.
Step 2: Adding items to your menu
Once your WordPress menu is created, the left part (menu "Add menu items") becomes editable (it is no longer greyed out).
This panel contains all the elements you can add to your menu: pages, articles, categories, tags, and custom links.
To add elements:
- Check the boxes for the pages or content you want to include. (for example: Home, About, Services, Blog, Contact).
- Click the "Add to menu" button.
- The elements then appear in the menu's construction area, on the right..
By default, on every "fresh" WordPress installation, you can add pages, posts, custom links, categories, and tags to your menu.
To add a custom link (for example, to an external URL or anchor), expand the Custom Links panel, enter the URL and display text, and then click Add to Menu.
By default, the interface only displays the most recent pages. If you cannot find a particular page, click on the "All" tab in each panel, or use the search bar.
Step 3: Customize the menu
Once you have added your items to your menu, They appear one below the other in the right-hand section., in the "Menu Structure" section.
By default, the topmost item will be placed on the left of your navigation menu, assuming you are going to position it in your site's header.
You can place each item on your menu wherever you want, by a simple drag-and-drop action.
To customize a menu item of your choice, click on the small downward arrow to open a context menu with different options.
When you have finished, remember to click the "Save Menu" button.
How do I create a menu with a block-based theme?
With an FSE theme, the logic is different. There is no longer a dedicated menu panel. Everything happens in the Site Editorwhich allows you to directly modify your theme templates, including the header, where the main navigation is usually located.
Step 1: Adding a WordPress menu
Since your WordPress back officeClick on Appearance > Editor. You will enter the full site editor.
Click on "Navigation", then on the "Create a new menu" link located at the top right:
Since your menu is empty, click on the small "+" button to add items (blocks, pages, links, etc.).
Step 2: Customizing the menu
In practice, you can also create submenus (for drop-down menus) by dragging one element under another, using drag and drop.
Visual customization is also done in the right panel, through two different tabs.
The "Settings" tab (small gear icon) gives you control over:
- Layout : justification and orientation of the menu.
- L'displaying a Hamburger menu (overlaid)' either on mobile, or on all screens.
- Adding additional CSS classes in the "Advanced" section.
In the "Styles" tab, you can modify the color, typography, dimensions and width from your WordPress menu.
Step 3: Choosing the menu location
Within an ESF theme, The menu's location is defined by the position of the "Navigation" block. in the theme template.
If you placed it in the header, it will appear in the header. If you want a menu in the footer, you will need to edit the footer template and insert another "Navigation" block.
Once you have made your changes, Click the "Save" button in the top right corner of the Editor.Your menu is immediately published and visible on all pages of your site.
Going further in managing and customizing WordPress menus
Now that you know how to create a WordPress menu, let's see how to make the most of the available options to customize, organize, and optimize it.
The screen options menu
If you're using a classic theme (e.g., Astra), there's a menu you absolutely must know. Especially since it's not readily available.
When you are in Appearance > Menus, take a look at the top right of the screen. You will see a small box called "Screen Options".
This allows you to hide or show other customization options by checking the boxes that interest you.
You will then be able to select advanced properties for your menu, which will be displayed when you modify an item on a case-by-case basis:
- Link targetCheck the "Open link in a new tab" box to have the link open in a new browser tab. Leave it unchecked to open in the same browser tab.
- Title attributeThe value of the title attribute of the menu item link. It will be displayed when the cursor hovers over the menu item.
- CSS classesOptional CSS classes for this menu item.
- Relationship with the owner of the linked site (XFN). Enables automatic generation of XFN attributes so you can show how you are related to the authors or owners of the site you are linking to.
- DescriptionDescription of this link. The description will be displayed in the menu if the current theme supports it.
How do I create drop-down menus?
A dropdown menu (also called a submenu or dropdown) allows you to organize multi-level navigation. This is particularly useful if your site has many pages grouped by theme..
With a classic theme, creating a submenu is intuitive: in the menu construction area, drag an element slightly to the right, under another element.
A small text appears (sub-element), signifying that this element becomes a child of the previous one.
The dropdown menu will be automatically displayed on hover over the parent element, according to the style defined by your theme.
With an FSE theme, the logic is similar in the "Navigation" block: you select an element and You drag and drop it below and to the right of a parent element to create the hierarchy.
We recommend limiting your dropdown menus to a maximum of two levels of depth. Beyond that, the user experience deteriorates, especially on mobile devices.
How do I delete menu items?
With a classic theme, click the arrow to the right of the element you want to delete in the menu's build area.
A "Remove" option appears at the bottom of the item's information.Click on it, then save your menu.
If you wish, you can also delete several items at the same time by checking the "Group selection" box:
With a block-based theme, select the element directly in the Navigation block, then use the context menu (the three dots “…”) to delete it. Don't forget to save.
How do I customize the design of a menu?
The visual style of a menu depends largely on your theme. However, you still have several options for managing certain settings yourself:
- Via the WordPress Customizer (classic themes): Appearance > Customize > Menus can give you access to visual options such as text color, font size or background color of the main menu.
- via CSS classes In the Menus panel's screen options (classic themes), activate the CSS Classes column. You can then assign a custom class to each element and style it precisely in your stylesheet.
- Via the site editor (FSE themes): the "Styles" panel of the Navigation block offers direct graphic options, without touching the code, as seen above.
How do you manage the locations of your menu?
A menu location is a predefined area by your theme in which you can display navigation: header, footer, sidebar, mobile menu, etc.
The number and names of these locations vary from theme to theme..
With a classic theme, the management of locations is done in two complementary ways.
The first method involves assigning a menu to a location directly from the Appearance > Menus page, in the Menu Settings section at the bottom of the page.
The second method involves the "Manage Locations" tab, accessible at the top of this same page, which provides an overview of all available locations and their assigned menus. This is useful for quickly checking your overall navigation configuration.
With an FSE theme, the concept of location is handled differently: The position of the "Navigation" block in the theme template determines where the menu appears..
You can therefore place a "Navigation" block in the header for your main menu, and another in the footer template for secondary navigation.
It is quite possible toassign several different menus to multiple locations simultaneously.
For example, a main menu at the top of the page, a simplified menu in the footer, and a separate legal links menu. Each location can have its own independent menu.
How do I rearrange and configure my menu items?
The order of items in a WordPress menu is important for both ergonomics and SEO.
Place the most important (and most visited) pages first. On mobile, the first elements are often the only ones visible before interaction.
In practice, apply the following advice:
- Limit your main menu to 5 or 7 items of the first level at most.
- Use short and explicit labels. (avoid vague formulations like “Learn more”).
- Think about the user journey : discovery logic (Home > Services > References > Contact) or conversion logic depending on your funnel.
- Test the display regularly on mobile devices.A menu that works well on a desktop can become unusable on a smartphone if the hierarchy is too deep.
What options are there for creating a mega menu?
A mega menu is an enhanced version of the dropdown menuWhen hovering over a parent element, it displays a large structured panel with several columns, icons, images, or descriptions.
It is frequently found on e-commerce sites, portals, or sites with a high volume of content, such as the Nike brand website below:
WordPress does not offer a native mega menu feature. Several approaches exist to create one:
- Some themes integrate it natively, like Astra (again), for example.
- Dedicated extensions allow you to add this functionality to any theme (see below).
- Custom development can be considered if you have very specific needs in terms of design or behavior.
Which plugins can improve WordPress menus?
The WordPress ecosystem is full of plugins dedicated to improving menus. Here are a few that might be most useful depending on your needs:
- Max Mega Menu : the reference extension for creating responsive mega menus, with an intuitive visual editor and great compatibility with popular themes.
- WP Menu Cart : adds a shopping cart icon to the menu, very useful for websites WooCommerce.
- If Menu : allows you to show or hide certain menu items depending on conditions (logged-in user, page type, role, etc.).
- Nav Menu Roles Similar to the previous one, but focused on user roles. Useful for restricted access sites or intranets.
- Sticky Menu & Sticky Header : makes your menu fixed as the page scrolls, improving accessibility on long pages.
Installing too many extensions can slow down your site. Choose those that meet a specific need, and deactivate those you don't use. Also, before installing one, check that your theme doesn't already offer a similar feature to avoid duplication.
Summary
In conclusion, a well-designed WordPress menu helps improve the user experience for your visitors.
Whether it's creating a main navigation with a classic theme, using the "Navigation" block of an FSE theme, or configuring dropdown menus and mega menus, WordPress offers you great freedom in organization.
The key is to keep two priorities in mind:
- Clarity for your visitors.
- Search engine consistency.
A structured menu, with explicit labels and a logical hierarchy, is a concrete lever for improving your site.
If you want to go further – whether it's to redesign your site's navigation architecture, customize your theme in depth or optimize your WordPress SEO – WP Maintenance is there to help you.
Need to know more? Our team is available to answer your questions.