Tutorial: WordPress 3.0 Custom Post Types
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.











Pingback: Jared Thompson
Pingback: Jared Thompson
Pingback: Jared Thompson
Pingback: Blueprint DesignBlog
Pingback: Admix Web
Pingback: Screencast Blog
Pingback: Jared Thompson
Pingback: Stylesheet
Pingback: Tweets that mention Tutorial: Wordpress 3.0 Custom Post Types | Design Juices -- Topsy.com
Pingback: Jared Thompson
Pingback: Franco Averta
Pingback: tanya
Pingback: stylish webdesigner
Pingback: loveish kalsi
Pingback: loveishs
Pingback: Loveishs Network
Pingback: Screencast Blog
Pingback: Screencast Blog
Pingback: Screencast Blog
Pingback: Screencast Blog
Pingback: Screencast Blog
Pingback: Jared Thompson
Pingback: yuri leonardo
Pingback: CSS Brigit | Tutorial: Wordpress 3.0 Custom Post Types
Pingback: Tutorial: Wordpress 3.0 Custom Post Types : Speckyboy Design Magazine
Pingback: Gardenofthoughts
Pingback: Pablo Lara H
Pingback: Laneth Sffarlenn
Pingback: Web RSS News
Pingback: wp-popular.com » Blog Archive » Tutorial: Wordpress 3.0 Custom Post Types | Design Juices
Pingback: Vivek Arockiaraj
Pingback: 100+ Very Useful and Fresh Articles for Designers and Developers
Pingback: Kati
Pingback: Vivien Boidron
Pingback: Richard Laksana
Pingback: web design cochin
Pingback: Suhd.com Downloads
Pingback: Jared Thompson
Pingback: sheri strykowski
Pingback: Takashi Irie
Pingback: Screencast Blog
Pingback: Kazuyoshi Uno
Pingback: 3rd Corner Studios
Pingback: Marcell Purham
Pingback: Webdevtuts
Pingback: Jared Thompson
Pingback: Chris Trude