With the recent release of WordPress 3.0, I thought it would be good to show off one on its best features, custom post types. This feature will come into its own especially when using WordPress as a CMS, it allows you to assign a post area for different bits of your site.
Tutorial: WordPress 3.0 Custom Post Types
For this tutorial, I’m modifying the default 3.0 theme, TwentyTen and will be adding an events custom post type, substitute the name if you want to have custom post called something different.
Let’s get first things first, you must download or upgrade to WordPress 3.0, without this it is very hard to actually make this work without doing a lot of hard coding and I will not be showing you how to do that.
Firstly add the following code to the functions.php file in the root of the theme, this will then display another tab in your WordPress dashboard.
add_action(‘init’, ‘events’);
function events() {
$args = array(
‘label’ => __(‘Events’),
‘singular_label’ => __(‘Events’),
‘public’ => true,
‘show_ui’ => true,
‘capability_type’ => ‘post’,
‘hierarchical’ => false,
‘rewrite’ => true,
‘supports’ => array(‘title’, ‘editor’, ‘thumbnail’, ‘custom-fields’)
);
register_post_type( ‘events’ , $args );
}
Now to display the posts from that area you need to set up a page template, this is very easy to do. Open up the page.php and replace all the code with:
<?php
/*Template Name: eventsPage*/
?>
<?php get_header(); ?>
<div id=”container”>
<div id=”content” role=”main”>
<div id=”post-<?php the_ID(); ?>” <?php post_class(); ?>
<?php $recent = new WP_Query(‘post_type=events&posts_per_page=10′); while($recent->have_posts()) : $recent->the_post();?>
<?php the_title( ‘<h2><a href=”‘ . get_permalink() . ‘” title=”‘ . the_title_attribute( ‘echo=0′ ) . ‘” rel=”bookmark”>’, ‘</a></h2>’ ); ?>
<div class=”entry-content”>
<?php the_content(); ?>
<?php wp_link_pages( array( ‘before’ => ‘<div>’ . __( ‘Pages:’, ‘twentyten’ ), ‘after’ => ‘</div>’ ) ); ?>
<?php edit_post_link( __( ‘Edit’, ‘twentyten’ ), ‘<span class=”edit-link”>’, ‘</span>’ ); ?>
</div><!– .entry-content –>
<?php comments_template( ”, true ); ?>
<?php endwhile; ?>
</div><!– #content –>
</div><!– #container –>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
Then re-save as events-page.php. Now we need to add a new page titled ‘events’ to display these custom posts, after selecting add new page, make sure you select eventsPage from the templates, now all your events will be posted on this page (once we have entered them).
Now add a new event, call it anything you like and publish it. Go to the website and you will see that it is now visible on the events page and not the news page (news page is just a standard page I quickly made).
So that works for anything, call it custom post anything you like and it will display your posts from that section, and it won’t conflict with the standard “posts” category.
Now that’s about it for the basic’s, however, let’s say you wanted to order the events by date, your thinking this could be hard, well to be honest it isn’t, all you need to do is change a bit of code here and there and it will work.
First of all go into the eventsPage template that you set up and remove the following code:
<?php $recent = new WP_Query(‘post_type=events&posts_per_page=10′); while($recent->have_posts()) : $recent->the_post();?>
And replace it with this:
<?php $recent = new WP_Query(‘post_type=events&posts_per_page=10&meta_key=Date’ . ‘&orderby=meta_value&order=ASC’); while($recent->have_posts()) : $recent->the_post();?>
Now by simply adding the date in m/d/Y format in the custom field area of the events posts, the events will be displayed in chronological order:
Watch this space for some more WordPress tutorials from me, here at Design Juices.
If you want it, Here is the link to the file, you will still have to add the posts and pages but the rest is all working.
Thanks for reading our latest tutorial, Was this useful for you?
Feel free to leave your comments and questions below.
Guaranteed HP0-D07 prep materials including 642-436 practice questions and 640-816 answers prepared by our certified experts to help you prepare for exam.

















Loading...
Tutorial: WordPress 3.0 Custom Post Types – http://su.pr/2NUjwO
Good tutorial but it misses some things like:
1. Add a calendar as a custom meta box somewhere in the sidebar
2. Create a way to filter the results by date
RT @JThompsondesign: Tutorial: WordPress 3.0 Custom Post Types | Design Juices http://su.pr/28NDGV
#Tutorial: #Wordpress 3.0 Custom Post Types http://bit.ly/9oAXtA
you checked it out yet?
#Tutorial: #Wordpress 3.0 Custom Post Types http://bit.ly/9oAXtA
you checked it out yet?
any suggestion if adding the code to function.php did not result in a new tab being added to the dashboard? not that i know what i'm doing, i just added the code at the end of the file.
Try adding the code before ” ?> “
i am a complete php nube, and there are a lot of “?>”s in that file. could you be a little more specific?
RT @jthompsondesign: Tutorial: WordPress 3.0 Custom Post Types http://bit.ly/9oAXtA
RT @jthompsondesign: Tutorial: WordPress 3.0 Custom Post Types http://bit.ly/9oAXtA
[...] WordPress 3.0 Custom Post Types Tutorial [...]
[...] WordPress 3.0 Custom Post Types Tutorial [...]
amazing post.. really helpful
#Tutorial: WordPress 3.0 Custom Post Types http://bit.ly/9oAXtA #wp #wordpress #help #3.0
#Tutorial: WordPress 3.0 Custom Post Types http://bit.ly/9oAXtA #wp #wordpress #help #3.0 RT @DesignJuices
[...] også: Tutorial: WordPress 3.0 Custom Post Types WordPress 3.0: Permalinks, Metaboxes, Querying for Custom Post types The Essential Guide to [...]
Thanks for the tutorial,
It's helped alot
Thank you Guys & Gals…hopefully this will be one of many!
So, we have to custom code the PHP files to do this? Lame.
Did I miss the link to this code in action? It would be very helpful to see the end result so that when I attempt to implement this code I can reference your completed page to be sure I've done it correctly.
Also, with 3.0 is it necessary that I upgrade the files within my customized theme? I have upgraded to 3.0, but don't know enough about wordpress to know which, if any, files within my theme also need to be upgraded. For example, the code in the Twentyten functions.php has a lot of new code, but is it all specific to Twentyten, or do I need to update my functions.php with this new code?
Thanks.
Nick, great article, but this code provide here works and the above code (in the actual post) does not. Good work! Thanks!
[...] Tutorial: Word Press 3.0 Custom Post Types [...]
[...] How to Use Custom Post Types [...]
[...] I found another article, “Tutorial: WordPress 3.0 Custom Post Types“. I haven’t gone through the tutorial yet, but looks good. I’ll get to that later [...]
[...] I found another article, “Tutorial: WordPress 3.0 Custom Post Types“. I haven’t gone through the tutorial yet, but looks good. I’ll get to that later [...]
[...] WordPress 3.0 Custom Post Types [...]
‘supports’ => array(‘title’, ‘editor’, ‘thumbnail’, ‘custom-fields’)
For some reason, everything but the thumbnail section is showing up for me. Is there something else that needs to be done for the thumbnails to be active? I already added theme support with the code below…
add_theme_support( 'post-thumbnails', array( 'post' ) );
[...] WordPress 3.0 Custom Post Types Tutorial [...]
Cool tips
[...] 21 de junio de 2010: Tutorial: WordPress 3.0 Custom Post Types. [...]
Thanks for that. im based in England and was wondering if it is possible to order the dates if they were in DD MM YYYY order? if so how would i go about doing this?
Thanks
Yep, just change the date round in the custom_fields and in the code! Probably best to order as YYYY-mm-dd otherwise it wont order properly
Hi,
Do you know how to have sub pages under events?
My example is:
post type: products
page: products
sub page: products/portfolio
WordPress thinks that portfolio is a product post type, and not a page, therefore rendering 404!
Any help would be much appreciated.
Kind regards,
Chad
Can this code be used with any theme other than TwentyTen?
Great, really helped me get going with WP, thanks a lot…
Depends on the ´-character which are wrong in the tutorial, switch them to '-characters instead..
Hi, I don't want show all content in one page. i want show, two or three lines in on page, if we click on that content on headings, will open onother window.
how it is possible
[...] Nice and simple modification of TwentyTen to use an events custom post type from Design Juices [...]
[...] 1. Nick Metcalf at Design Juices introduces the general concept (June 2010): http://www.designjuices.co.uk/2010/06/tutorial-wordpress-custom-post-types/ [...]
[...] Turorial: WordPress 3.0 Custom Post Types fra Design Juices – Tutorial med fokus på at oprette en indholdstype til håndtering af arrangementer/events [...]