Category: Wordpress Themes

From wordpress 3.0 version release wordpress gives the facility to add a custom post type functionality. With custom post type wordpress is became more powerful and expendable and more advanced We given info about, How to use custom post type in wordpress.

How to use custom post type in wordpress

WordPress recognized the need to people and industry and they introduced the custom post type. In this tutorial I will tell you how to use the custom post type very effectively.

Adding Custom post type is very easy. Using theme or plugin file you can add the custom post types in wordpress admin area.

Here I am going to give you example using wordpress theme files. Open you functions.php file and copy paste the following code in that file.

add_action('init', 'create_product');
 function create_product() {
 $product_args = array(
 'label' => __('Product'),
 'singular_label' => __('Product'),
 'public' => true,
 'show_ui' => true,
 'capability_type' => 'post',
 'hierarchical' => false,
 'rewrite' => true,
 'supports' => array('title', 'editor', 'thumbnail')
 );
 register_post_type('product',$product_args);
 }

The function register_post_type() accepts two arguments: the name we want to give our post type, and a list of arguments used to create that post type, which we put in an array called $args.

Using above code that code will add the product post type to wordpress panel.

Now you can add the meta fields to custom post type. Use the following code in file for add the meta fields. Custom meta fields function is available from quite some time. add_meta_box() function is very useful to adding custom fields to wordpress post.

<?php

 add_action("admin_init", "add_product");
 add_action('save_post', 'update_thumbnail_url');
 function add_product(){
 add_meta_box("product_details", "product Options", "product_options", "product", "normal", "low");
 }
 function product_options(){
 global $post;
 $custom = get_post_custom($post->ID);
 $thumbnail_url = $custom["thumbnail_url"][0];
 $product_info = $custom["product_info"][0];
 $product_infos = $custom["product_infos"][0];
 $video_code = $custom["video_code"][0];

?>
 <div id="product-options">
 <label>Thumbnail URL:</label><input size="100" name="thumbnail_url" value="<?php echo $thumbnail_url; ?>" /><br>
 <label>Product Info:</label><input size="100" name="product_info" value="<?php echo $product_info; ?>" /><br>
 <img src="<?php echo $product_infos; ?>"><br>
 <label>Video Code:</label><textarea cols="50" rows="5" name="video_code"><?php $video_code; ?></textarea>
 </div><!--end product-options-->
<?php
 }
 function update_thumbnail_url(){
 global $post;
 update_post_meta($post->ID, "thumbnail_url", $_POST["thumbnail_url"]);
 update_post_meta($post->ID, "product_info", $_POST["product_info"]);
 update_post_meta($post->ID, "video_code", $_POST["video_code"]);

 }
?>

Using following code you can see the product information in edit product page and you can able to see the all information in for edit. Admin will know which fields are available to edit.

<?php
add_action("manage_posts_custom_column",  "product_custom_columns");
add_filter("manage_edit-product_columns", "product_edit_columns");

function product_edit_columns($columns){
 $columns = array(
 "cb" => "<input type=\"checkbox\" />",
 "title" => "Product Title",
 "thumbnail_url" => "Thumbnail URL",
 "product_info" => "Product Info",
 "video_code" => "Video Code",
 );
 return $columns;
}
function product_custom_columns($column){
 global $post;
 switch ($column) {
 case "thumbnail_url":
 $custom = get_post_custom();
 echo $custom["thumbnail_url"][0];
 break;
 case "product_info":
 $custom = get_post_custom();
 echo $custom["product_info"][0];
 break;
 case "video_code":
 $custom = get_post_custom();
 echo $custom["video_code"][0];
 break;
 }
}

?>

Using custom post type and add meta tag you can develop very nice applications. Now I am going to show you how you can extract the custom posts in wordpress frontend.

Using wp_query you can easily extract product posts. In any category page or conditionally you can use following code.

$loop = new WP_Query( array( 'post_type' => 'product', 'posts_per_page' => 10 ) );
while ( $loop->have_posts() ) : $loop->the_post();
 the_title();
the_content();
global $post;
 $custom = get_post_custom($post->ID);
echo $thumbnail_url = $custom["thumbnail_url"][0];
echo $product_info = $custom["product_info"][0];
echo $video_code = $custom["video_code"][0];
 echo '<div>';
 the_content();
 echo '</div>';
endwhile;

Or you can create the custom theme page using following code. Just create product.php page in your wordpress theme folder.Put following code in that file.

<?php

/*Template Name: Product*/

?>

<?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=product&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>

<?php the_content(); ?>

<?php

the_content();
global $post;
$custom = get_post_custom($post->ID);
echo $thumbnail_url = $custom["thumbnail_url"][0];
echo $product_info = $custom["product_info"][0];
echo $video_code = $custom["video_code"][0];

?>

<?php wp_link_pages( array( 'before' => '<div>' . __( 'Pages:', 'wordpressapi' ), 'after' => '</div>' ) ); ?>

<?php edit_post_link( __( 'Edit', 'wordpressapi' ), '<span>', '</span>' ); ?>

</div><!– .entry-content –>

<?php comments_template( ", true ); ?>

<?php endwhile; ?>

</div><!– #content –>

</div><!– #container –>

<?php get_sidebar(); ?>

<?php get_footer(); ?>

Now create product page and product as template.

If you have any issues or doubts then write to me.