This idea was directly taken from John Watson’s excellent post, Building a better WordPress portfolio.  I’ve taken his concept, and I think, improved upon it slightly.  Thanks John.

I’m always looking for a better way to display my portfolio of various projects.  I’ve tried hand-coded pages, WordPress pages, custom WP functions that pull all the posts from a special category, etc…  and I just never have been able to come up with something that I really like.

See how meta I can be?!

Enter John Watson’s post about using WordPress Custom Post Types (CPT).  Custom post Types were, technically, introduced in WP 2.9, although there was no way to work with them in the user interface until 3.0.  Basically, they are WP’s answer to Drupal’s Custom Content Kit (CCK).  You know about Pages and Posts.  Well, Custom Post Types let you define additional “things”, so that you might have Pages, Posts, Teapots, and Projects.  The basic idea is that you define a Custom Post Type in functions.php, which gives you an entry in the WP admin sidebar to manage those entities.  In this instance, I’ve created a Custom Post Type of “Projects”, so that I can now add, edit and manage my portfolio, directly in the admin area.

The first step is to create the CPT in your themes functions.php.  The function that you need is register_post_type(), which you can read about in the Codex.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

add_action('init', 'techno_init');
function techno_init() {
  register_post_type('project',
    array(
      'labels' => array(
      'name' => __('Projects'),
      'singular_name' => __('Project'),
      'add_new_item' => __('Add New Project'),
      'edit_item' => __('Edit Project'),
      'new_item' => __('New Project'),
      'view_item' => __('View Project'),
      'search_items' => __('Search Projects'),
    ),
    'public' => true,
    'exclude_from_search' => true,
    'has_archive' => true,
    'menu_position' => 5,
    'supports' => array(
    'title', 'editor', 'excerpt','thumbnail', 'custom-fields', 'revisions'
    )
  )
 );
}

Technically, that’s all that you need to do.  However, one thing I wanted, was the ability to have snippets from each project displayed on a parent “Projects” page.

Themeing the output

It turns out, that this is very easily done.  You simply need to add a file to your theme, in this case, titled “archive-project.php”.  That keys the WP theme system to use that file in order to display a listing of all of your custom post types.  You can also create a custom template to display single project pages, by creating a new file, again directly in your theme directory.  This file should be titled “single-project.php”.  Again, that title causes the WP template heirarchy to choose the file to display your post.

Finally, you may get a 404 page not found error when you first try to load the Projects page.  To fix that, go to Settings->Permalinks in order to rebuild the permalink structure.  You don’t have to make any changes, just visit the Permalinks page, and click Save.  You now have a “Projects” parent page, themed by “archive-project.php”.  In my case, each individual Project page is still being themed by “single.php”.