Custom Post Types, Custom Taxonomies, and Permalinks in WordPress 3.0

Please Note: This article has since been extended. Please read more up-to-date information in Revisiting Custom Post Types, Custom Taxonomies, and Permalinks

Custom Post Types are a huge boon to everything WordPress. The feature has been long awaited, and lays a nice foundation for WordPress becoming more of a CMS to those still convinced it’s merely a blogging engine.

Custom Post Types, for those not familiar, is basically a templated content type based at their core off of WordPress’ Posts. There are a number of optional fields you can include within a Custom Post Type, and you can also build in your own. It opens the door to building a refined UI for data storage within WordPress given custom circumstances.

That said, you may be curious how that effects other systems such as Pods. If you haven’t had a chance, I discussed WordPress 3.0 and Pods in detail and have concluded that Custom Post Types and Pods achieve different goals at this point, and working with Pods gives you a level of control Custom Post Types currently do not (and in part do not strive to) achieve.

As full disclosure, I’ve recently been accepted as a Pods Core Developer but hope to express that circumstance having no effect or any biased opinions toward Custom Post Types. The Pods team wouldn’t exist without WordPress, and we’re all super thrilled about the existence of Custom Post Types.

In this walkthrough, I’d like to cover a fully top-to-bottom implementation of Custom Post Types, specifically targeting the task of ensuring a pretty permalink structure for your single pages. A follow-up article will take into consideration custom taxonomies for archive-style pages.

Up and running with Custom Post Types

Perhaps the biggest outstanding learning curve with Custom Post Types is the implementation itself. While programmers will love it, less experienced theme developers are likely to become quickly frustrated with the initial setup of Custom Post Types. While there is a lot of information in the always useful Codex, Custom Post Types still require an understanding of WordPress established conventions for implementation.

I’m a stickler for understanding the ins and outs of a system in which you work professionally, but I also understand that WordPress is a fantastic platform for tinkering. That said, if you’re a professional you’re looking to save as much time as possible. If you’re a tinkerer you’re looking to get up and running as quickly as possible so (hopefully) you can dissect how it happened. Given that, a really nice way to rapidly set up your Custom Post Types is the Custom Post Type UI WordPress plugin. Custom Post Type UI completely removes the tediousness of setting up Custom Post Types by providing an interface within the WordPress admin to do so. I’ve been using it on all of my recent projects and it’s a huge time saver. I do recommend though, that prior to using the plugin, you take the time to really understand what Custom Post Types are and how they fit into the big picture.

For the purposes of this walkthrough, we’ll set up an informational DSLR site with some information about a few cameras. Using Custom Post Type UI, we’ll set up a Cameras Custom Post Type:

While you can create a Custom Post Type filling out just the fields above, we’re working for a full implementation here, so we’re going to fill in the Advanced Label Options too:

If these fields are not populated, defaults will be used based on the initial labels used to set up the Custom Post Type. In this particular case, using those defaults would have worked out just fine, but there will be circumstances where a revised nomenclature will be much more meaningful to clients. We’re also going to customize the Advanced Options offered by Custom Post Types/Custom Post Types UI:

Using these fields we’re able to further refine the attributes of our Custom Post Type. Many of these can be left as default, but we’ll pay particular attention to both the Custom Rewrite Slug as well as the Supports areas. Built-in Taxonomies are also important, but we’re going to revisit that later. The Custom Rewrite Slug is responsible for ensuring your permalink structure remains accurate and in tact. More on that during implementation. Now that our options are set, clicking Create Custom Post Type will add our Custom Post type to the admin UI:

Adding a new entry will provide a familiar, but customized content entry view:

Once we’ve added some entries, we’ll begin building our library of content:

With Custom Post Types comes all of the built in content management functionality of WordPress, but at this point, we’ve got nothing to show for it within our theme; these pages are nowhere in sight on the front end. Our first option could be to use WordPress 3.0 Menus and manually build out a navigation system with a series of Custom Links, but that would quickly become overbearing given the fact that we’re hoping to build a website with hundreds (or thousands) of content pages.

Structuring WordPress for Custom Post Types

Custom Post Types are just that, they’re a collection of content. For the sake of organization as well as user experience, there should be some sort of hierarchy that incorporates your Custom Post Types. Currently, if you were to hit one of our Camera pages using the Permalink outlined on the edit page, you’d see the content included in the post:

For the purpose of this example, the permalink we’re working with is http://wordpress/cpt/cameras/canon-7d/ which is just fine; I like the way it’s structured. The trouble creeps in when, by experience, we want to view an index page by stripping off the last URL segment and trying to hit http://wordpress/cpt/cameras/. Out of the box we’re slammed with a 404 error. As a fix, I’d suggest creating a WordPress Page called Cameras (with the proper slug) to ensure we no longer hit that 404.

This ties into my philosophy of structuring WordPress sites; WordPress Pages should dictate the overall structure (for both content and URLs) and be the foundation of everything built on top of it. To our benefit, Custom Post Types work within thsi philosophy.

With our http://wordpress/cpt/cameras/ URL now properly resolving, we could create a custom Page template to pull in all of our Cameras. There are two approaches here, you can either set the Page Template in the Page Attributes sidebar on the edit screen, or simply name your template file using the Page slug. We’ll take the latter approach and create a new file within our theme directory called page-cameras.php consisting of:

<?php

/* Template Name: Cameras index */

get_header(); ?>

  <div id="container">
    <div id="content" role="main">

      <?php
        query_posts( 'post_type=cameras' );
        get_template_part( 'loop' ); // looks for loop.php which is specific to Twenty Ten
        wp_reset_query();
      ?>

    </div><!-- #content -->
  </div><!-- #container -->

  <?php get_sidebar(); ?>

<?php get_footer(); ?>

Note: The call get_template_part() looks for loop.php, a template file specific to Twenty Ten, the stock theme that ships with WordPress 3.0

What we’re doing in this template is simply querying all posts for our cameras Custom Post Type and sending that data to The Loop. Last, we reset to the original query fired during page creation which will prevent any funkyness with sidebar and/or footer logic. What results is a page that mimics a default Posts entry view in Twenty Ten:

While the implementation so far is great for including the data stored in our Custom Post Type, it’s not very organized.

Organizing Custom Post Type data using a Custom Taxonomy

Closely related to Custom Post Types are Custom Taxonomies. To our benefit, the Custom Post Type UI plugin handles the creation and maintenance of Custom Taxonomies as well. We’re going to organize our Cameras Custom Post Type by attaching a few Taxonomies:

When creating them, we’ve attached the Taxonomies to our Custom Post Type, and they now show up as expected:

Out of the box, Custom Taxonomies behave like tags. Depending on how you’d like to use your Taxonomy, tags might be an applicable solution. In this case, however, I’d like to offer a choice-based system for my client. To do that, and therefore make your Taxonomy behave more like a WordPress Category, you’ll need to edit the Advanced Options of the Taxonomy:

By setting your Taxonomy to being hierarchical you’ll provide a listing of all existing entries as well as a check/uncheck interaction:

As with most things Custom Post Type, while you’re able to add/edit/remove the data, it doesn’t do much out of the box on the front end. Viewing the Canon 7D page we just edited on the front end results in no visible change. We’re going to use our Custom Taxonomy to provide category-style archive listings.

The end of the basics

This walkthrough sets the stage for the more difficult task of setting up Custom Taxonomy-based archive-style pages using appropriate permalinks. If you’d like to take the next step in pushing your Custom Taxonomies to the front end of your site check out WordPress Archive Pages Based on Custom Taxonomies.