Add Custom Column to Posts List Table in WordPress

Do you have custom post meta or taxonomy attached to your custom posts type or default WordPress post type "post" and want to show some data in additional column of posts list table? Then this posts is for you to learn How to show custom column in WordPress posts list table.

Ok so to start with we will need two hooks for these columns to show. We will add two columns one for featured image and one for custom post meta "property_price" of our post type "Property" which we added in our post Create Custom Post Meta in Wordpress.

apply_filters("manage_{$post_type}_posts_columns", string[] $post_columns);
do_action("manage_{$post_type}_posts_custom_column", string $column_name, int $post_id);

The "manage_{$post_type}_posts_columns" is for registering our new columns while "manage_{$post_type}_posts_custom_column" is for showing the content of those columns and $post_type is the slug of post type you want add these columns for.

apply_filters("manage_{$post_type}_posts_columns", string[] $post_columns);

• $post_columns: (array)  - Associate array of columns heading strings.

do_action("manage_{$post_type}_posts_custom_column", string $column_name, int $post_id);

• $column_name: (string)  - The name of the column for which we are adding the content.
• $post_id: (int)  - The id of current post.

So lets start it and create property-columns.php file. I am also going to add some inline styles for this page only you can adjust it in your admin side included stylesheets.

property-columns.php

<?php
add_action('admin_enqueue_scripts', 'admin_scripts_and_styles');
function admin_scripts_and_styles() {
    global $pagenow;
    $post_type = isset($_GET['post_type']) ? sanitize_text_field($_GET['post_type']) : null;

    if($pagenow === 'edit.php' && $post_type === 'property'){
        wp_register_style( 'post-columns-style', false );
        wp_enqueue_style( 'post-columns-style' );
        $custom_css = "
                .post-type-property th.column-featured_image{
                    width: 70px;
                }
                .post-type-property td.column-featured_image > img{
                    max-width: 100%;
                    height: auto;
                }";
        wp_add_inline_style( 'post-columns-style', $custom_css );
    }
}

add_filter('manage_edit-property_columns', 'register_property_columns' );
function register_property_columns($columns)
{
    $sorted_columns = [];
    // Get array of column keys for sorting, You can prepare a static array of columns if columns are already knonwn
    $column_keys = array_keys($columns);

    // Add featured image column to second position in columns
    array_splice($column_keys, 1, 0, ['featured_image']);

    // Add price column to second last position in columns
    array_splice($column_keys, count($column_keys) - 1, 0, ['property_price']);

    // Add both columns to original columns at the end
    $columns['featured_image'] = __('Image', 'text-domain');
    $columns['property_price'] = __('Price', 'text-domain');

    // Loop through keys and prepare new sorted array of columns
    foreach($column_keys as $column_key){
        $sorted_columns[$column_key] = $columns[$column_key];
    }

    return $sorted_columns;
}

add_filter('manage_property_posts_custom_column', 'add_property_columns_content', 10, 2);
function add_property_columns_content($column, $post_id)
{
    switch ($column) {
        case 'featured_image':
            if (has_post_thumbnail()) {
                the_post_thumbnail('thumbnail', ['class' => 'attachment-thumbnail attachment-thumbnail-small']);
            }
            break;

        case 'property_price':
            echo get_post_meta($post_id, 'property_price', true);
            break;
    }
}

Now we will include this property-columns.php in our functions.php to work.

include('property-columns.php');

This is how the property posts list table will look like:

 

These columns will now also show in screen options like this: