Custom Admin Columns in WordPress

When dealing with different content types likes pages, posts and custom posts, we sometimes need to add or customize our admin’s columns. Let’s say we have a featured image for every post in our posts. By default, WordPress will not show a thumbnail of the featured image in the main post management page:

You can check Screen Options on that same page and see that Featured image is not available as a checkable option:

Now, let’s say you have a custom field for all of your posts, maybe a field that contains a list of available translations of the post or any other field you might be thinking of. Your custom column can even contain some other type of data, maybe a “hit counter” or some other piece of analytics.

In this post I want to go over the two required WordPress functions for extending and customising your admin’s table columns. These functions apply to pages, posts and custom posts.

No matter what content type you are targeting, adding custom columns follows only two steps. The first step is to register the column with a filter and the second step is to handle its content with an action.

Custom Columns For Pages

For this example, let’s keep it simple and just add a page_id column.

1) Add the manage_pages_columns filter:

<?php
function add_page_id_column_to_pages( $columns ) {
    $columns['page_id'] = 'Page Id';
    return $columns;
}
add_filter( 'manage_pages_columns', 'add_page_id_column_to_pages' );

2) Add manage_pages_custom_column action:

<?php
function display_page_id( $column, $post_id ) {
    if($column === 'page_id'){
        echo $post_id;
    }
}
add_action( 'manage_pages_custom_column', 'display_page_id', 10, 2);

This will be the result:

Custom Columns For Posts

Now, let’s add a Featured Image column to our posts page:

1) Add manage_posts_columns filter:

<?php
function add_featured_image_thumb( $columns ) {
    $columns['featured_image'] = 'Featured Image';
    return $columns;
}
add_filter( 'manage_posts_columns', 'add_featured_image_thumb' );

2) Add manage_posts_custom_column action

<?php
function display_featured_image( $column, $post_id ) {
    if($column === 'featured_image'){
        echo get_the_post_thumbnail($post_id, [100,100]);
    }
}
add_action( 'manage_posts_custom_column', 'display_featured_image', 10, 2);

This will be the result:

Post featured image by Alessia Chinazzo on Unsplash

Custom Columns For Custom Posts

Adding a custom column to custom post types is a bit different from what we previously saw. Our two functions will share this next form: manage_{custom_post_type}_posts_custom_column.

For this example, let’s add a fake “Hit Counter” or “Viewed” column with some nice styles. Our custom post will be “Ads”.

1) After creating our “Ads” custom post type, let’s add the a “Viewed” column:

<?php
function add_visited_column( $columns ) {
    $columns['visited'] = '<span class="dashicons dashicons-chart-line"></span> Visited';
    return $columns;
}
add_filter( 'manage_ads_posts_columns', 'add_visited_column' );

2) Now, Add the column content:

function display_visits( $column, $post_id ) {
    if($column === 'visited'){
      echo '<span class="counter">1.7k</span>';
    }
}
add_action( 'manage_ads_posts_custom_column', 'display_visits', 10, 2);

In a real project you would probably populate this column with real data…

This will be the result:

Post featured image by Charles Deluvio on Unsplash

✍ For more posts:
https://yossiabramov.com/