Along with pages and custom links, you can use the navigation screen to provide links to categories you define for your content. Let's do it!
- Now our pages are in place, but not our Resources category. To add that, click on the checkbox next to Resources in the Categories box and click on the Add to Menu button.
- Move the Resources link within the menu until everything is in the right order:
Tip
Can't see the Resources category?
If you can't see one of your categories in the Menus screen, that's because you haven't assigned it to any posts yet. WordPress doesn't let you add empty categories to your menu as that wouldn't be very helpful to users. Simply assign that category to one of your posts and it will show up in the Menus screen, and if you need to leave the Menus screen to do this, make sure you save your menu first.
- Click on the Save Menu button to save your menu.
We created a new WordPress menu in the Menus admin screen, told WordPress to display it in our theme and added some links to it.
The WordPress Menus screen gives us even more functionality than we've used here. Let's have a look at some of the possibilities.
WordPress lets you set up your menus in a variety of ways and with a lot of flexibility. You can add any links you like, call them whatever you want, and structure your menu however you need.
Firstly, you can add different types of links to your menu:
- Pages: You can add as many static pages as you want to the menu in whatever order.
- Categories: As we've seen, you can add links to one or more categories to a menu. If you want to add tags as well you can do this—if the list of tags isn't visible, click on the Screen Options tab at the top of the Menus screen and then click on the checkbox next to Tags. Your tags will appear and you can add them to the menu.
- Custom taxonomies: If you've defined any custom taxonomies for your site, you can link to these in your menu.
- Custom post types: It's possible to add links to custom post types to your menu, if you have those set up in your site.
- Custom links: You can add any custom link to your menu and give it whatever name you want. For example, you could link to an external site or to a specific post in your site.
Once you've added your links, you can give them a custom navigation label, which doesn't have to be the name of the page or post linked to. So if you wanted to link to a post with a long name you could use an abbreviated label in the navigation menu. You do this by clicking on the arrow next to the label's name in your menu and typing text into the Navigation Label field:
As well as this, you can change the structure of your menu by adding second level links, which will be output as a <ul> tag inside your top level <li> tag. You do this by dragging the link to the right underneath the link you want it to appear below. This is great for drop-down menus in larger sites. The following screenshot shows how this looks in the Menus admin screen:
And here's the effect in our theme:
As you can see it doesn't quite work in this theme as we haven't added any styling for second level navigation links, but a bit of CSS would soon fix that. We'll undo this and make the menu all one level again to fit with our design.