Beginner’s Guide to WordPress Menus

Beginner's Guide to WordPress Menus-Two men confused while reading French menuWordPress offers an excellent way to manage your site’s menus, but it may not be apparent when you first install your site. In fact, a fresh installation doesn’t use the easy menu system at all–you have to hook that up yourself. Follow along as I show you the menu system basics and how to start using it on your new site.

Watch and learn

Working with the original WordPress menus

When you first install a new WordPress site, most menus work in what I call “the old way.” For my example, let’s refer to the Twenty Eleven theme. Out of the box, the theme’s top navigation menu is populated automatically. Each new page (as opposed to post) added to your site is automatically added to the menu, in alphabetical order. Thankfully, child pages look nice in the menu, appearing as second- and third-level pages, accordingly.

So what’s the problem?

Put succinctly, this method of populating the menu limits you in the following ways:

  1. No control over the order of menu items.
  2. No control to leave some pages off the menu.
  3. No way to add anything other than pages.

Changing menus the hard way

Hang on–there’s always a way to get what you need in WordPress. If you understand a few template tags and don’t mind editing the code in your theme’s template, you can control all those things and more. The point is, menus should be manageable from a friendly user interface–not from backend code requiring some technical knowledge.

WordPress Menus-Screenshot of template code for adding old-style navigation menus

Featured Plugin - WordPress Appointments Plugin

Take, set and manage appointments and client bookings without having to leave WordPress. Appointments+ makes it easy.
Find out more

WordPress menu management to the rescue

WordPress Menus-Screenshot of menu item editing screenDrag, drop, and done

The first step in the menu management interface is to create a new menu. Then, you can add any page, post, category page, custom link, and more to the menu. Finally, arrange the order of menu items by dragging and dropping them where they need to be. Even creation of sub-menus is but a click-and-drag away, intuitively represented by indenting sub-menus in the interface.

Tell your menus where to go

WordPress Menus-Screenshot of theme locations panelAfter you’ve built one or more menus, simply assign them to different menu locations supported by your theme. It’s rare for themes to not support at least 1 menu location. If your favorite theme has no locations, you can check out my article showing how to easily add menu support to any theme.

No menu support in your favorite theme? No problem.

WordPress Menus-Screenshot of Menu Widget setupWhether or not your theme supports menu locations, you can add menus to sidebars as widgets. Simply add a widget to the sidebar of your choice. You can give the widget a title, tell it which menu to display, and you’re off to the races–as they say.

Botched-up navigation menus no longer excused

Before WordPress 3 gave us menu management, I might see an otherwise fantastic website with a horrible, buggy global navigation menu. I would usually purse my lips and nod my head, understanding what a pain it was to get drop down menus working right.

There is no reason for such a menu mess in WordPress any more.

After viewing this tutorial, you should be able to manage your own site menus with few problems. Let me know what you think of the tutorial, and hit me up if you have any questions.

Featured Plugin - WordPress Ecommerce Shopping Cart Plugin

Out of all the WordPress ecommerce plugins available, MarketPress has got to be the winner - easy to configure, powerful functionality, multiple gateways and more. A simply brilliant plugin!
Find out more

Credits

  • Photo of confused guys looking at French menu–photo by: guybrariang
Tags

Comments (8)

  1. Custom Menus were a great addition to WordPress, and they’re great for tweaking navigation when serious control is needed.

    What do you think of the reverse, though?: A site with 100+ pages is near impossible to maintain with Custom Menus. Who needs that extra work? >>> Add page. Add page to menu. Repeat. Pull out hair!

    If your site relies on the soft warm glow of the WordPress Page hierarchy, and you can use a secondary custom menu navigation for anything else, just install the Exclude Pages plugin (http://wordpress.org/extend/plugins/exclude-pages/) to remove the occasional page (or parent set of pages) that doesn’t need to be in the main nav. Then let other Custom Menus do the rest.

    For example, footer links like Legal, Feedback, Site Map, Contact Us — I pull out of the page hierarchy with Exclude Pages, then simply put back into a Custom Menu. I just makes sure a site map includes both menus, the Page Hierarchy and custom menu(s). Done.

    Bonus: For the occasional need to click to a special non-Page link, you can use the Page Links To plugin (http://wordpress.org/extend/plugins/page-links-to/)

    Control of Page menu order? Plenty of plugins out there to help you manage that. My Page Order is a simple one: http://wordpress.org/extend/plugins/my-page-order/

    However, back on Custom Menus AND Page Hierarchy menus, I come across client sites that end up putting *everything* in the navigation, rather than setting up splash pages (sub-homepages based no audience/topic) that focus on a key audience(s)/topic(s). Relying on a huge navigation tree is like relying on a site map to be the key way that people find information through your site: Your site info architecture has failed.

    • Hi Joe, thanks for the thorough, well thought comment. A few things I’ll add:
      1. If someone is putting 100+ pages in one navigation menu, I would argue they are doing it wrong. That is just my opinion, but IA is just broken on sites like that.
      2. I don’t see any reason to install 3 plugins when a core feature can handle the needs of a well-designed site.
      3. I do like the “My Page Order” plugin. We’ll be doing a “WPMU Recommends” article featuring the best page management plugin, and that is one I am looking at. May the best plugin win.
      Thanks again for the thorough notes!

  2. Right, definitely agreed, sir, on #1. Hence my last graph, but forgot to add:

    I think the topnav should be light, anyway. I tell people, imagine if you could only put your top-level pages in the nav: How would you NOW organize/lay out your site pages/index pages?

    xo

  3. Hi,Nice post and easy understandable. Thank you for this post.
    When i click this menu it says :
    Not Found

    The requested URL /wordpress/health/ was not found on this server.

    Can u please guide me. Thank you in advance.

Participate