Add Custom Column to Posts 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? Learn in this post how to show custom column in WordPress posts table.

WordPress provides useful action and filter hooks to add custom column to any post types table. These hooks can be used to show either taxonomy or post meta in additional custom column. In this post we are going to learn how to customize post table columns in WordPress and show additional column in posts table. 

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.

 

WordPress Hooks to Manage Posts Table Columns

add_filter('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.

 

add_filter('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.

 

Add Column to WordPress Posts Table

We will create property-columns.php file and include it in functions.php. I am also going to add some inline styles for this page only you can adjust it in your admin side included stylesheets. Steps to add column to WP posts table:

• Register a filter hook manage_{$post_type}_posts_columns for column heading.
• Add two columns to $columns array.
• Sort columns array to change position of columns in table.
• Register an action hook manage_{$post_type}_posts_custom_column to show the content of each column.
• Add a switch statement to check column and add content accordingly.
  

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_property_posts_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_action('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 esc_html(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: