Community, Development, Multisite, Plugins, Tutorials

Easy Guide to Displaying Custom Post Types in Your WordPress Theme

by 32 Responses

WordPress 3.0 offers the exciting new world of custom post types, giving you the ability to manage and present content with fine-grained control. Creating custom post types is the easy part, but how do you get them to show up in your theme? This tutorial will walk you through this process from start to finish. You’ll be able to incorporate custom post types into your WordPress theme in three easy steps.

Step 1: Create a Custom Post Type

There are basically two ways to create custom post types: add them with your theme’s functions.php file or create them using the help of a plugin, such as Easy Post Types.

For this example, we’ll create a custom post type for recipes. If you wanted to add the post type through your functions file instead of installing another plugin on your site, here is what you would include: 

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

// Creates Recipes post type
register_post_type('recipes', array(
'label' => 'Recipes',
'public' => true,
'show_ui' => true,
'capability_type' => 'post',
'hierarchical' => false,
'rewrite' => array('slug' => 'recipes'),
'query_var' => true,
'supports' => array(
'title',
'editor',
'excerpt',
'trackbacks',
'custom-fields',
'comments',
'revisions',
'thumbnail',
'author',
'page-attributes',)
) );

Most of the items above are fairly self-explanatory. You will alter the post type, label and rewrite with the type of post you want to create.

If you want more information about registering custom post types, check out the WordPress codex.

After you save your functions file, you should see your new custom post type in the dashboard menu, as shown here. Now you can start adding new recipe posts.

Step 2: Add Your Post Type to a Custom Page Template

Adding your newly created custom post type to its own page is easier than you think. Make a duplicate of your theme’s page.php file. Add this to the top to let WordPress know that it is custom page:

1
2
3
4
5
6
7

<?php
/**
 * Template Name: Recipes Page
 *
 * Selectable from a dropdown menu on the edit page screen.
 */
?>

Then you will add this bit right before the loop (above the if ( have_posts() section):

1

<?php query_posts( 'post_type=recipes'); ?>

Step 3: Create a New Page For Your Custom Post Type

Create a page as usual through the WordPress dashboard. Give it a title and make sure to assign the “recipes” template to your page. Click “Publish” and now you should see a full page of your recipe posts.

If you want to have thumbnails included, make sure to enable post thumbnails for your theme and add this tag into your custom page template: 

1

<?php the_post_thumbnail(); ?>

That’s everything from start to finish. There’s a lot more information to explore in the codex and other tutorials for pimping out your custom post types even further. Now that you have the basic idea, you can customize from there and start managing your content with greater flexibility.

Comments (32)

  3. Thanks so much for the tutorial. This is exactly what I needed.

    I’m wondering… if I display posts by post type, how do I display the categories of each of the custom posts? I was told that I cannot use the in this instance, so I’m wondering what exactly I should use.

    If anybody could tell me, that would be greatly appreciated!

    Thanks.

  4. Now with those custom post types and other “bits of content” that don’t necessarily need to be organized by date/chronologically, what approach you suggest taking for letting the editor/admin of the site SORT their order??

  5. Hello, Nice tip! I try it and it works successfully!
    But I have some questions.

    How can I do to assign a Category to my recipes posts?
    Is it possible to make 2 recipes pages?

    Thank you very much!

  9. Hi Sarah,
    Thanks for responding so soon. Yes, I added exactly as described. Copied the page.php file, (twentyten theme). Added the Template Name above the get_header(); code and added the query_posts for post type function call above the loop.
    I’m somewhat at a loss, if it really is that easy?
    - I just don’t see the template dropdown when adding / editing a post?

    Are you running 3.0 or 3.0.1? – am wondering if there’s a bug fix that’s relevant in the maintenance release. I’ll upgrade now anyway to rule it out..
    Cheers.

  10. Simon, you won’t see it on the post edit screen. The template drop down is on the page edit screen where you will name the page “Recipes”, for example, and then select the Recipe template. Then you never touch that page again. You’ll create your recipes post within the “Recipes” menu that you see in your dashboard, as shown in the thumbnail.

  12. Excellent arcticle!!!

    I’d set up a custom post type by following Justin Tadlocks guide but for the life of me couldn’t work out how to get it to display in page.

    One question…I’m using the TwentyTen theme and currently the page shows a header image then the menu and then goes straight into listing the posts.

    Can I add a sentence between the menu and the posts? if so, how?

  16. Using a custom template is easier than that. After you copy the page.php or single.php, rename it using this convention:

    single-custom_post_type_name.php

    So as your example says your custom post type is recipes then your template would be named:

    single-recipes.php

    Then you don’t need to select it from the page template meta box when you create a new one.

  17. This article saved me. I am building a video player for a site using custom post types, this is an easy way to create and display my videos much like vimeo without having to install some crazy video player wordpress theme. I love it.

  18. Wonderful article Sarah, thank you. I’m fairly code-savvy, and Custom Post Types should be easy, but the number of lacklustre plugins and half-baked tutorials i’ve trawled through has been soul-destroying. This is the first no-nonsense, helpful tutorial i’ve come across that tells you how to create custom post types and *how to actually display them* :-O I still need to modify it to suit my purposes, but you’ve given me the basics to build on. Thanks again.

  22. Hi Sarah,

    I am using Create a Custom Post Type code. It is working fine.

    But i want to add some more filed for example statdate,enddate, and image1 , image2 for multiple images. so how i can do it with it. Please help me asap.

    Thanks
    Hemant

  26. This was such an easy task with your example. I did it with my blog-template because the page is actually nothing more then a blank-page.

    Inside my blog-template-copy I had all the things I needed to make my ‘page’ look good.

    Another tip !
    Go into your admin-options.php (or whatever name it is)
    Copy the code that apply to blog-template.php
    Rename that to reflect blog-template-copy.php

    then you can style it from within your admin options for the theme even more.

  27. I am using the TwentyTwelve theme and my page template does not have the code that says ” if ( have_posts()”, instead it has “while ( have_posts()” and when i copy the “php query_posts( ‘post_type=recipes’)” code above that line it breaks the page (won’t show the header, footer, css styling.

  28. This article was super helpful.

    I have one question, I attempted to create another Custom Post Type for another part of my site, but as I began to insert the code and changed it accordingly in my functions.php once it was saved, it broke my site, and once I removed the new (copied and edited) code it was fine again with the first Custom Post Type.

    Is it possible to use the code a few times over?

  29. This article was super helpful.

    I have one question, I attempted to create another Custom Post Type, below the first one, for another part of my site, but as I began to insert the code and changed it accordingly in my functions.php once it was saved, it broke my site, and once I removed the new (copied and edited) code it was fine again with the first Custom Post Type.

    Is it possible to use the code a few times over?

Participate