Add Custom Post Type Columns

One of the exciting new features in WordPress 3.0 is custom post types. We can create our own post types by using the register_post_type function.

If we enable UIs for our custom post type, we will get additional menu items on our WordPress dashboard similar to the Edit and Add New options for standard posts.

Here, we consider how to add new columns to the Edit custom post type screen.

1. Create a Custom Post Type

Creating a custom post type is surprisingly straight-forward and well documented in the WordPress Codex.

In this example, we create a custom post type called gallery.

	$labels = array(
		'name' => _x('Galleries', 'post type general name'),
		'singular_name' => _x('Gallery', 'post type singular name'),
		'add_new' => _x('Add New', 'gallery'),
		'add_new_item' => __("Add New Gallery"),
		'edit_item' => __("Edit Gallery"),
		'new_item' => __("New Gallery"),
		'view_item' => __("View Gallery"),
		'search_items' => __("Search Gallery"),
		'not_found' =>  __('No galleries found'),
		'not_found_in_trash' => __('No galleries found in Trash'), 
		'parent_item_colon' => ''
	  );
	  $args = array(
		'labels' => $labels,
		'public' => true,
		'publicly_queryable' => true,
		'show_ui' => true, 
		'query_var' => true,
		'rewrite' => true,
		'capability_type' => 'post',
		'hierarchical' => false,
		'menu_position' => null,
		'supports' => array('title','thumbnail','excerpt')
	  ); 
	  register_post_type('gallery',$args);

2. Add New Custom Post Type Columns

As shown in the screen-shot above, our custom post type Edit screen (called Gallery) starts off with four columns – checkbox, Title, Author, and Date.

To add new columns to our Edit screen, we want to hook into the manage_$pagename_columns filter. The $pagename of the Edit screen is edit-$post_type.

Therefore, in this example, –

  • Edit page name = edit-gallery
  • Add column filter hook = manage_edit-gallery_columns

Our add column function call looks like this –

// Add to admin_init function
add_filter('manage_edit-gallery_columns', 'add_new_gallery_columns');

Our filter function accepts an array of column names, and returns our new column array once we are done.

	function add_new_gallery_columns($gallery_columns) {
		$new_columns['cb'] = '<input type="checkbox" />';
		
		$new_columns['id'] = __('ID');
		$new_columns['title'] = _x('Gallery Name', 'column name');
		$new_columns['images'] = __('Images');
		$new_columns['author'] = __('Author');
		
		$new_columns['categories'] = __('Categories');
		$new_columns['tags'] = __('Tags');
	
		$new_columns['date'] = _x('Date', 'column name');
	
		return $new_columns;
	}

In the example above we fully replace the column array with our own entries. We can also just add columns by adding new elements into the existing $gallery_columns array. However, our added columns will only appear after the existing default columns.

The functions above will add new columns into our Edit Gallery screen which now looks like this –

If we want the column to be sortable, then we can use the manage_{$screen->id}_sortable_columns filter. Here is a good example for making sortable columns.

3. Render Our New Custom Post Type Columns

Note – In the screen-shot above, the ID and Images columns are empty because they are not standard WordPress post columns. Standard WordPress post columns include –

  • ‘cb’ – Post checkbox.
  • ‘date’ – Date when post was last modified.
  • ‘title’ – Post title and common post actions including Edit, Quick Edit, Trash, and View.
  • ‘categories’ – Post categories.
  • ‘tags’ – Post tags.
  • ‘comments’ – Number of post comments.
  • ‘author’ – Post author.

To render our new columns, ‘id’ and ‘images’, we must hook into the manage_posts_custom_column action (in WordPress 3.0).

In WordPress 3.1, we want to hook into the manage_{$post_type}_posts_custom_column action. Since our example post type is gallery, we want to hook into manage_gallery_posts_custom_column.

        // Add to admin_init function
	add_action('manage_gallery_posts_custom_column', 'manage_gallery_columns', 10, 2);

	function manage_gallery_columns($column_name, $id) {
		global $wpdb;
		switch ($column_name) {
		case 'id':
			echo $id;
		        break;

		case 'images':
			// Get number of images in gallery
			$num_images = $wpdb->get_var($wpdb->prepare("SELECT COUNT(*) FROM $wpdb->posts WHERE post_parent = {$id};"));
			echo $num_images; 
			break;
		default:
			break;
		} // end switch
	}	

Our ‘id’ and ‘images’ columns will now be rendered with the proper values.

We Are Done!

Another interesting action hook in the Edit screen page is restrict_manage_posts which allows us to control which custom post objects we want to show on the page.

And just like that … we are done!

Related Articles

Comments

  1. says

    Great article.

    Although I was tearing my hair out trying to get my columns for custom fields to work.
    For those using custom fields IE inputs etc make sure you use the following line of code in the manage_custom_columns function

    $custom = get_post_custom($post->ID);

    as shown in my function below:

    function product_custom_columns($column) {
    global $post;
    $custom = get_post_custom($post->ID);
    switch ($column) {
    case “price”:
    echo $custom["price"][0];
    break;
    case “manufacture”:
    echo $custom["manufacture"][0];
    break;
    case “Product categories”:
    echo get_the_term_list($post->ID, ‘Product categories’, ”, ‘, ‘,”);
    break;
    }
    }

Trackbacks

Leave a Reply

Your email address will not be published.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>