Guide

Add or Remove Custom Columns in Posts Screen in WordPress

24 AUG 2022

The WordPress default posts screen looks like this –

The columns in the screen – Author, Categories, Tags, Comments, Date are all core columns and shows up on the posts screen by default.

But while customizing your site, you may remove some core columns and add a few new ones.

This can be done using two hooks – one filter hook manage_posts_columns and one action hook manage_posts_custom_column.

add_filter( 'manage_posts_columns', 'custom_columns_head_callback' );
add_action( 'manage_posts_custom_column', 'custom_columns_content', 10, 2 );

function custom_columns_head_callback( $columns ) {
    // your custom code here  
    return $columns;
}

function custom_columns_content( $column_id, $postid ) {
    // your custom code here
}

The callback function custom_columns_head_callback for the filter hook manage_posts_columns, takes the default columns $columns as argument.

Then you will write the code to add a custom column like this –

 $columns['post_image'] = esc_html__('Post Image', 'text-domain'); 

Where post_image is the id of the new column that you are adding. This code actually generates the header for the custom column – Post Image (written with a escaping function esc_html__ for translations).

Next, you need a way to add the content for the rows of the custom column.

This can be done through manage_posts_custom_column action hook. The callback function custom_columns_content for this hook take the custom column id and the post id as parameters.

This custom_columns_content function generates the row values for the custom column.

Let us add a custom column post_image to the screen –

add_filter( 'manage_posts_columns', 'custom_columns_head_callback' );
add_action( 'manage_posts_custom_column', 'custom_columns_content', 10, 2 );

function custom_columns_head_callback( $columns ) {
    $columns['post_image'] = esc_html__('Post Image', 'text-domain');  
    return $columns;
}

function custom_columns_content( $column_id, $postid ) {
    if ( $column_id == 'post_image' ) {
        $post_image = 'https://via.placeholder.com/100';
        if ( $post_image ) {
            echo '<img src="' . $post_image . '" />';
        }
    }
}

The code above generates a custom column with label Post Image on the screen.

The row values for this column are generated by custom_columns_content. We are just adding an image from a placeholder site, but you can add anything you want. The output looks like this –

Typically you will use the $postid parameter to get some custom value of the post and display.

The manage_posts_columns filter hook can also be used to remove columns from the screen including core columns.

add_filter( 'manage_posts_columns', 'remove_columns_callback' );
function remove_columns( $columns ) {
     unset( $columns['categories'] );  // Remove Categories column
     unset( $columns['tags'] );    // Remove Tags column
     unset( $columns['author'] ); // Remove Author column
     unset( $columns['comments'] ); // Remove Comments column 
     unset( $columns['date'] ); // Remove Date column
}

The callback function remove_columns_callback takes the core columns array as the input. Removal of the columns is done through the unset function which removes the column by index/id.

The output after removal of core columns will look like this –

The ids of the core columns are given above. You can pick the column(s) you want to remove and leave the rest.

Every business deserves a website
हर एक बिजनेस के लिए एक वेबसाइट होना जरूरी है

GET YOUR'S NOW

Address

411 Kalikapur

Ishani Apartments, Kolkata - 99

Contacts

support@webdesignvista.com
Phone: +91 9903490874
Fax: +91 9903490874