• Home
  • About Mitch
  • Speaking
  • Articles
  • Contact
  • Home
  • About Mitch
  • Speaking
  • Articles
  • Contact

Digital Strategist

WordPress Developer

Content Creator

Unapologetic Punk

Mitch Canter

  • X
  • Bluesky
  • GitHub
  • Twitch
  • YouTube
  • LinkedIn
WordPress

An Intro to WordPress 3.0 – Navigational Menus

CMDR Mitchcraft

Reading time: 2 minutes

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.

drop down menu, dynamic navigation, nav menu, navigational menu, WordPress 3.0
  • Using Hyperlinks Correctly in WordPress

    Using Hyperlinks Correctly in WordPress

    Reading time: 2 minutes

    Any good content marketer worth his or her salt knows the value of using links in their content. It’s a good strategy to practice – whether you’re linking internally to content you’ve written in the past or to external resources you mention in posts.  However, a lot of people overlook a small, single detail that could…

    WordPress
  • Set Up An Amazing E-Commerce Site in 30 Minutes with WordPress

    Set Up An Amazing E-Commerce Site in 30 Minutes with WordPress

    Reading time: 2 minutes

    Step 1: Get a great product (you’d be surprised how many people forget this step…) Step 2: Install WordPress Step 3: Set up a static front page (Settings > Reading)… create a page called “front page” and a page called “blog”.  Head to the options menu and select the reading tab.  Change the “Front Page…

    WordPress