An Intro to WordPress 3.0 – Navigational Menus

WordPress

WordPress 3.0 has plenty of new features, and all of them are worth mentioning and diving deeper into.  Over the next few days I’ll be diving into the finer features of the newest incarnation of the WordPress platform.  Everything from Custom Post Types and Taxonomies to navigational menus and all of the custom functions you can sink your teeth into.  Today, we start with the most prolific change to hit WordPress 3.0 – the inclusion of a navigational menu generator.

WordPress’ navigation options before 3.0 were very… eclectic.  There were about 3 to 4 different plugins I used to achieve the desired effect (My Page Order, Exclude from Page Nav, 301 Redirect, etc).  With the advent of WordPress 3.0 came a breakthrough in its jump from a blog platform to a content management platform: navigational menus.

The menu above looks like any typical navigational menu, but the difference lies in the backend.  You don’t need to know page ID numbers, you don’t need to use funky page reordering to get things to work right – all you need is two snippits of code and you can add dynamic navigation to any WordPress site.

First, the function (place this code in your functions.php file):

add_theme_support( 'nav-menus' );

That’s it – for the function, anyways.  Now, find in your theme where you want to put your navigation.  You’re looking for either a hard coded navigation, an unordered list (a typically form of navigation styling and structure), or the function <?php wp_list_pages( ); ?>.  Once you’ve found that, replace it (or add in) this code set:

<?php wp_nav_menu( ); ?>

That’s all there is to it.  Your theme is set up for  navigational menus that you can control in the WordPress backend.  One thing worth mentioning is that this is the default setting.  It will pull the class from whatever you name your menu in the next screen.

What’s that?  You want to add some pages?  Sounds great – click on the Menus tab under appearance over on the left side of your dashboard.

You’ll notice three things on the left side of the menu: Custom Links, Pages, and Categories.  Pages and categories are pretty self explanatory: you can add links to category listings or the pages of your WordPress site.  The custom links box allows you to give an external or custom link/label a place in your navigational menu – good for linking to social networks, other sites, etc.

Up on the top-right corner of the page is a tab called “screen options”.  Clicking this will bring up the advanced options for the menu navigation, such as the class you wish to give your links, XFN relationships, etc.  It also brings up menus for inserting posts and tags into your navigational menu – good if you have an intro post you like to point your visitors to.