Last updated:
Just as every site has a homepage, it’s important to provide a navigation menu for your site to make it easy for your visitors to find their way around your website’s pages and other content. A menu is commonly displayed prominently in the site’s header or sidebar, and sometimes even in the footer.
A menu displays links to your site’s pages (or other content you want to feature). It’s generally recommended to keep your menu short to avoid overwhelming the visitor. If you have a lot of pages to feature in your menu, you can use submenus (also called dropdowns) to keep your navigation links neat and organized.
Like many aspects of WordPress, there are many options and variations when it comes to working with menus. Again, it’s not realistic for us to cover every possible scenario. Instead, let’s look at some common situations to get you started.
- When using a Block theme, your site’s menu is managed and displayed using the Navigation block within the Site Editor
- Most themes will come with a Navigation block included in the default templates
- Most Header template parts will include a Navigation block
- Some Navigation blocks will be in place, but empty until you create a custom menu
- Some Navigation blocks will be initially set up to use the Page List block so that your menu will automatically display your published pages
- You can convert the Page List block into individual menu items to give you more control over your menu items
- If your Navigation block is not using the Page List block, you’ll need to manually add new pages to your menu after you publish them
- You can add, remove, rearrange, and rename individual menu items
- You can create dropdown menus by adding submenu items
- You can control the styling of your menu using the Navigation block toolbar and Settings in the sidebar
- You can add multiple Navigation blocks to any page, post, or template
- You can create and assign different menus to different Navigation blocks to use with different types of content
The Navigation block offers a lot of different features and options. The best way to get familiar with these options is to review our Navigation block support guide. We also cover additional menu situations in our main Menus support guide.
When you update a specific menu being used by a Navigation block, those changes will update everywhere in your site that this same menu is being used.
Ideally, we recommend ensuring that your Header template part includes a Navigation block to display your main, primary menu, and to work with the support guides linked above to learn the specifics of how your menu works. At its most basic, including a menu within your site is a matter of:
- Add the Navigation block to a Header template part
- Create a new menu
- Add individual menu items to your menu
- Reorder, rename, and style your menu items as desired
Without a well-designed menu, users can feel like they’re in a maze, unsure where to turn next. This can lead to frustration and, ultimately, them leaving your site. A great menu, on the other hand, enhances user experience, increases engagement, and helps visitors find what they need with ease.
The items you include in your menu will depend mostly on the purpose of your site. The thing to keep in mind is that the idea is to make it easy for your visitors to find their way around.
This doesn’t mean that you want to include every single page and post you publish — that would make for an overwhelming and messy menu, and would have the opposite effect.
Instead, think of your site as being sections. You’ll have your top level pages that are most important, for both you and your visitors. For a basic site, these often include pages such as: Home, Blog, Services, About, and Contact.
For some sites that are focused on blogging and are using categories effectively, it might make sense to include top level categories as submenu items that dropdown from the Blog parent item. Or perhaps submenu items that dropdown from a Service parent item to list specific services that you offer.
If you have a number of top-level sections within your site, you may want to group menu items like About and Contact under one parent item as well.
A Portfolio site might offer a parent item called Works with submenu items for different types of projects.
At the end of the day, your menu is like a compass for your visitors guiding them smoothly and successfully from one section to the next.
Understand your audience: Know who is visiting your site. Are they tech-savvy? Looking for quick information? Your menu should cater to their expectations and needs.
Simplicity is key: Overcomplicated menus can overwhelm visitors. Stick to clear, concise language, with short labels, and limit the number of menu items to avoid clutter.
Responsive design: With the variety of devices used to access the internet, your menu should adapt seamlessly to different screen sizes, from desktops to smartphones. To facilitate this, consider using the Overlay feature provided by the Navigation block to display a menu icon on mobile instead of the full list of menu items as words.
Logical structure: Group related items together and order them in a way that makes sense. Think of it as writing a great story — it should have a clear beginning, middle, and end.
Top-level sections: Start by identifying the main sections that represent your website’s content. These will be your primary menu items, also referred to as parent items.
Hierarchy and flow: Think about the natural flow of information. What would a visitor to your site logically look for first? Arrange your menu items in this intuitive order.
Submenus for detailed navigation: For sites with extensive content, use submenus to organize information into digestible chunks. But remember, too many layers can get confusing, so use them sparingly.
Consistency is crucial: Keep your primary menu consistent throughout the site by including it in your Header template part across all templates. This stability helps site visitors feel grounded and oriented no matter where they are on your site. You can always add additional secondary menus within specific sections if it makes sense to do so.
Testing and feedback: After setting up your menu, test it with real visitors. Gather feedback and be ready to make adjustments. The best menus evolve based on user experience.
Crafting a website menu is a blend of art and science. It requires understanding your audience, organizing content logically, and ensuring ease of use. Remember, your menu is more than a list of links; it’s the roadmap guiding your visitors through the wonderful world of your website. Keep it simple, intuitive, and user-friendly, and watch as your website’s navigational compass leads your visitors to their desired destination with a smile!
Back to top