Share this...

Update Information:

Update (January 12, 2016): WordPress has changed how they handle custom menus quite a bit. Rather than edit this article heavily, I decided to just write a new one, which you can view here. Comments on this article are now closed.

In order to talk about a custom menu, we should first talk about what a “default menu” is. In many themes, a “default menu” of your pages will show up somewhere around the top of each page or post. Depending on the menu’s functions, you may or may not have any control over how these pages appear and parent pages may not show child pages as a drop-down.

A custom menu is just that: a menu you create. You can include any combination of the following:

  • Custom links
  • Categories
  • Posts
  • Pages
  • Post Tags

There are four general steps to using a Custom Menu:

  1. Create it
  2. Add items to it
  3. Arrange the items however you like
  4. Put it someplace

To make things more clear, I’ve used screen shots from this blog, which uses the Graphene theme, to demonstrate the steps involved.

Contents

To Create a Custom Menu:

  1. In the Dashboard, click on “Appearance” and then click on “Menus”
  2. On the right-hand side, notice a plus sign (+) just above where it says “Menu Name”. In the box to the right, which says “Enter menu name here,” enter a descriptive name for this menu. (Don’t worry if you can’t think of a good one. You can always change it later.)
    custom_menu_02

     

  3. Click on the “Create Menu” button to the far right.
    custom_menu_03

     

That’s it! You’ve now created your first custom menu. Of course, it doesn’t contain any items. We’ll do that next.

Add Items to a Custom Menu

On the left-hand side of the Custom Menu area, you should see a series of boxes that look like this:

custom_menu_04

If you don’t, click on the “Screen Options” button in the upper right-hand corner:

screen_options

and tick all the boxes that appear there, so it looks like this:

custom_menu_05

Now, go back to the first set of boxes mentioned in this section. Let’s ignore the one that says “Theme Locations” because this will only show up if your theme supports custom menus in the first place. (We’ll say more about that in a bit.) It’s the option boxes down below that we are interested in.

Adding Custom Links

The first one, “Custom Links”, is just that. Using this option, you can add a custom link to anywhere on the web. You could even create a link to my blog, which you are certainly welcome to do:

custom_menu_06

After I’ve specified the URL (don’t forget the “http://” part) and the Label (which is what readers will see in the custom menu), I’ll click on the “Add to Menu” button.

Adding Categories

“Categories” will allow you to create links to posts that are listed under certain categories. When you click on this, you will get a “Category Archive” page listing all* the posts in that category.

custom_menu_09

I can make my choice from the “Most Used” categories, or I can “View All” and scroll through the list, or I can click on “Search” to find a particular category. Once I’m finished, I’ll click the “Add to Menu” button.

Adding Posts

“Posts” will allow you to create links to specific posts. If I click on this in my blog today, I get this listing:

custom_menu_07

 

As you can tell, it shows the most recent posts. I can tick the boxes of the ones that I want, or I can click on “View All” to show all of my posts, or click on “Search” to search for a specific post. Or I can just click on “Select All” to add all the posts that are visible there. Once I’ve made my selections, I’ll just click on the “Add to Menu” button to add the items to my custom menu.

Adding Pages

“Pages” will allow you to create links to specific pages. Clicking on this box brings up a box very similar to the “Posts” box:

custom_menu_08

Again, I can choose from among the most recent pages, or view them all, or search for a particular one. Once I’ve ticked the boxes of my selections, I’ll click the “Add to Menu” button.

Adding Tag Archives

“Post Tags” is a similar to the “Categories” box above. It will allow you to create links to posts containing specific tags. When you click on this in a custom menu, you will get a “Tag Archive” page listing all* the posts that contain that tag.

custom_menu_10

Again, once I’ve made my selections, I’ll click the “Add to Menu” button.

Arranging Items in a Custom Menu

Once we’ve done all the above steps, whatever items we’ve added will now appear on the right side of our Custom Menu screen, in the order we’ve added them. Here’s a snapshot of my custom menu called “Categories”:

custom_menu_11

If you’ve been following along on your own blog, adding things as we’ve gone through this tutorial, you’ll realize that your custom menu doesn’t look like mine, because all of your items are lined up to the left.

This is where the fun really begins. You see each light blue box that represents a custom menu item? You can move it. That’s right, just grab it with your mouse and move it around in the custom menu area.

If you move items up and down, you change the order in which they appear in your custom menu.

If you move things right to left, you can make children and grandchildren out of items which get moved to the right. For example, if you look up above, you’ll see that “Recipes” is both under and a little to the right of “Cooking”. If you look at how this shows up on my blog, it looks like this:

custom_menu_12

Again, you’ll only get this kind of effect if the theme you are using supports it.

Once you have arranged your custom menu items to your heart’s content, click on the “Save Menu” button. (I don’t really need to show you a screen shot of that, do I?)

Putting Your Custom Menu Someplace

Ages ago, I mentioned that “Theme Locations” thing and told you to ignore it, because we would eventually get back to it. That time has come.

If your theme supports Custom Menus, it will give you a place to put them. By clicking on the “Theme Locations” box, you can find out where your theme will allow you to put them.

The theme I use, Graphene, supports three separate locations:

custom_menu_13

If you look at the top of this blog, you can see that in the header menu, I have included the custom menu I call “Projects”. In the Custom Menu pane, it looks like this:

custom_menu_14

This category is just for my podcasting projects, each of which is assigned to its own category. (Actually, I have a category called “Podcasts” and then each separate podcast project has its own category, with “Podcasts” as its parent.) It looks like this:

custom_menu_15

In the secondary menu, I have included the custom menu I call “Categories” which I’ve already shown you up above. It looks like this:

custom_menu_16

Even though my theme supports it, I haven’t yet created a Custom Menu to include in the footer.

Where Else Can You Use a Custom Menu?

If you look through the above screen captures closely, you’ll notice that I have a third custom menu that I haven’t mentioned yet, called “Featured Posts”. It contains posts that I want to draw readers’ attention to. Even though my theme would allow me to put it in the footer, I don’t think many people would notice it there. I want it in the sidebar. This is easy to do.

First, go to “Widgets” in the “Appearance” tab.

In the “Available Widgets” side of the Widgets pane, find the widget labeled “Custom Menu” and drag it to wherever you would like it on whichever sidebar you want it to appear. It looks like this:

custom_menu_widget_01

Once you’ve dragged it to the sidebar, click on the arrow on the right side to access its options. Pick a custom menu, give it a title, and then click the “Save” button. Mine looks like this in the widget pane:

custom_menu_widget_02

and like this on my actual blog:

custom_menu_widget_03

I can do this wherever I can stick a widget, and I can use custom CSS to style that widget, and the Custom Menu it contains, however I wish. That, however, is the subject of another post.

There is a lot about custom menus that I have left off. This post is only meant to get you started. You can always visit this page on the WordPress Codex for more information. As always, feel free to comment with questions or comments.

*Well, maybe not all. It depends on your theme and WordPress.


Share this...
Except for material released under a Creative Commons License: ©2021 Kenneth John Odle All Rights ReservedPermalink for this article:
https://techblog.kjodle.net/2011/08/25/create-custom-menus-in-wordpress/