Shiba

Adventures in WordPress

  • Home
  • Dog
  • Art
  • Contact
  • WordPress Articles
    • WP Plugins
    • WP Programming
    • WP Admin Panels
    • WP Theme Design
    • WP How-To
    • WP Theme Images
You are here: Home / WordPress Admin / Custom Post Type / Add Custom Post Type Columns

Add Custom Post Type Columns

by ShibaShake 88 Comments

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);

New gallery custom post type menu items and Edit screen.
New gallery custom post type menu items and Edit screen.

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 –

Gallery screen with new custom post type columns.
Gallery screen with new custom post type columns.

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 = %d;", $id));
			echo $num_images; 
			break;
		default:
			break;
		} // end switch
	}	

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

Render new custom post type columns with the proper data.
Render new custom post type columns with the proper data.

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!

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Comments

« Previous 1 2 3 4 5 Next »
  1. Nuthan Raghunath says

    November 8, 2014 at 10:44 pm

    Does images column render values? Iam getting error Warning: Missing argument 2 for wpdb::prepare().

    Reply
    • ShibaShake says

      November 12, 2014 at 11:29 pm

      Yeah, the wpdb::prepare syntax has changed. You want to do something like this-

      $wpdb->prepare("SELECT COUNT(*) FROM $wpdb->posts WHERE post_parent = %d;", $id)
      
      Reply
  2. Lewis Sherlock says

    August 22, 2014 at 2:49 am

    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;
    }
    }

    Reply
  3. Dipankar Barman says

    April 4, 2014 at 3:22 am

    Hi Author!

    It is a awesome tutorial. it help me lot to make custom post type in my site.
    thanks for your code. it’s working fine.

    Reply
  4. Janes Oosthuizen says

    May 30, 2013 at 12:53 pm

    Hey, This is a awesome tutorial. I have read a few tutorials on this topic. Yours is the most thorough and easy to understands Well Done!

    Reply
  5. Momo says

    April 28, 2013 at 2:37 am

    i use this code don’t display ma customs posts categoriers please helpe me
    //’manage_career_posts_custom_column’,
    add_filter(‘manage_career_posts_custom_column’,’add_new_career_columns’);
    function add_new_career_columns($career_columns) {
    $new_columns[‘title’] = _x(‘Title post’);
    $new_columns[‘author’] = __(‘Author’);
    $new_columns[‘categories’] = __(‘Categories’);
    $new_columns[‘tags’] = __(‘Tags’);
    $new_columns[‘date’] = _x(‘Date’);
    return $new_columns;
    }

    Reply
  6. Makarand Mane says

    January 7, 2013 at 2:55 am

    Hi i want add post thumbnail in images column

    then what will be query to called

    Reply
    • moya says

      January 19, 2013 at 7:57 pm

      I apologize my script tags were being parsed as html. here is the code again

      switch ($column_name) {
      case ‘images’:
      $thumnail_id = get_post_thumbnail_id($id);
      $imgsrc = wp_get_attachment_image_src($thumnail_id, ‘thumbnail’);

      if ( has_post_thumbnail($id) ) {
      echo ”;
      ;
      }

      break;
      default:
      break;
      }

      Reply
  7. Danyo says

    August 22, 2012 at 2:55 am

    Great Tutorial!

    How would i go about making the column names clickable to order by asc or desc like you would on the standard post screen?

    Thanks, Danyo

    Reply
    • ShibaShake says

      August 22, 2012 at 7:38 am

      Use the manage_{$screen->id}_sortable_columns filter. Good example for doing that here-

      http://wordpress.org/support/topic/admin-column-sorting

      Reply
  8. CGP says

    May 28, 2012 at 1:30 am

    Thank you very much.. This helps me a lot.

    Reply
  9. Ryan says

    May 18, 2012 at 9:06 am

    Thanks for this. Always great to find a short and simple explanation.

    Reply
  10. Wesam Alalem says

    April 13, 2012 at 9:57 am

    Thanks a lot, this helped me to add columns to a custom post type table in no time 😉

    Reply
« Previous 1 2 3 4 5 Next »

Recent Posts

  • Screenshot of an example article in code view of a modified Gutenberg editor.How to Harness the Power of WordPress Gutenberg Blocks and Combine It with Legacy Free-Form Text
  • Screenshot of the Success, WordPress has been installed page.Migrating Your WordPress Website to Amazon EC2 (AWS)
  • Screenshot of WinSCP for creating a SFTP configuration.How to Set-Up SFTP on Amazon EC2 (AWS)
  • WordPress Gutenberg code view screenshot of this article.How to Prevent Gutenberg Autop from Messing Up Your Code, Shortcodes, and Scripts
  • Screenshot of the Success, WordPress has been installed page.How to Create a WordPress Website on Amazon EC2 (AWS)

Recent Comments

  • Screenshot of the Success, WordPress has been installed page.How to Create a WordPress Website on Amazon EC2 (AWS) (1)
    • Erik
      - Great article. All worked great except for this step:apt install php-mysqlChanging to this fixed it:apt install ...
  • Add Custom Taxonomy Tags to Your WordPress Permalinks (125)
    • Anthony
      - Where does this code go? Like, what exact .php file please?
  • Screenshot of an example article in code view of a modified Gutenberg editor.How to Harness the Power of WordPress Gutenberg Blocks and Combine It with Legacy Free-Form Text (1)
    • tom
      - hi,my experience was like the same, but for me as theme developer the "lazy blocks"(https://wordpress.org/plugins/lazy-blocks/) ...
  • WordPress Custom Taxonomy Input Panels (106)
    • Phil T
      - This is unnecessarily confusing. Why declare a variable with the same name as your taxonomy? Why did you choose a taxonomy ...
  • Create Pop-up Windows in Your WordPress Blog with Thickbox (57)
    • Jim Camomile
      - I have used this tutorial several times and it is one of the few simple and effective ways to add popups with dynamic content, ...

Copyright © 2024 · Genesis Skins by ShibaShake · Terms of Service · Privacy Policy ·