How to Customise Columns in WordPress Posts Admin

Daniel Comley

Founder

We recently posted articles about custom post types and Advanced Custom Fields in WordPress. These tools can really help build a great website and make it easier to manage content. This article aims to take things a step further. When you use ACF fields in posts, it is likely you will want to display those fields as columns in the admin area in your list of posts, so that you can sort by them, filter them or just make it easier to view your posts.

To achieve this, you will need to do some coding in PHP. Therefore, some WordPress development experience, an understanding of PHP, and knowledge of how hooks work in WordPress will be required.

Settings Things Up

As with most WordPress development, you will need to get set up with a code editor and access to the file system within your WordPress installation. There are two choices when it comes to where to place your code for customising the columns on the admin page of posts. You can either:

  • Create a child theme and place your code in the functions.php file within a child theme, or
  • Create a custom plugin and install and activate it separately


Generally speaking, if you plan on re-using the code later on a different WordPress project, or if you want the code to be able to run regardless of which theme is active on the website, then create a plugin for it. Otherwise, if the theme isn’t going to change, and you don’t plan on re-using the code, then you can do it just fine within a child theme. This article assumes that you have knowledge on how to set this up, if not, there are a number of tutorials online which can run you through creating a plugin or child theme.

For our use case example, we will be using a custom post type called Committee, which will contain a small number of ACF fields (Name and Email Address) and a Featured Image which will be used as the photo of the person. The Title of the post will be the role that they are filling in the committee.

We have articles on setting up custom post types and ACF field groups through links at the top of this post.

A committee member has been created using our Committee post type and ACF fields, which looks like this.

ACF fields in custom post type
Committee custom post type with ACF fields

The post title is the role within the committee (in this case President), and the name and email address are also captured, along with the Featured Image. From the main Posts page, the default view looks like this.

CPT Posts page
Committee posts admin page

We want to display the Featured Image, title, name and email address as columns on the posts page and have the name and email address sortable.

Setting the Columns to Display

The first thing we want to do is set which columns we want to display on the admin page. We can do this by calling the manage_{$post_type}_posts_columns WordPress filter. This Manage Posts Columns filter is used to set the columns shown when listing posts of a custom type. So we will first call this filter and create our function to run.

add_filter( 'manage_committee_posts_columns', 'add_committee_columns' );
function add_committee_columns( $columns ) {
     $columns = array(
          'cb' => $columns['cb'],
          'featured_image' => __( 'Photo' ),
          'title' => __( 'Title' ),
          'committee_member_name' => __( 'Name' ),
          'committee_member_email' => __( 'Email Address' )
     );
return $columns;
}

When calling this filter, we use the name of the custom post type (in this case, committee) to tell WordPress which custom post type we are wanting to change.

In the function, ‘cb’ refers to the checkbox which appears at the far left of the posts which allows the user to select the post. Featured_image and title are self explanatory, and the two committee_member fields are for our ACF field group.

At this stage, our admin page looks as follows.

Added columns to CPT admin page
Columns added to CPT posts page

It is starting to take shape, but it is obviously still missing our data from the post. The next step is to populate the columns with the post data.

Populating Columns with Custom Data

To populate the columns with our data, we need to call the manage_{$post_type}_posts_custom_column WordPress action. The Manage Posts Custom Column action is used to output the value of a custom column for a custom post type.

add_action( 'manage_committee_posts_custom_column', 'populate_committee_columns', 10, 2 );
function populate_committee_columns( $column, $post_id ) {
if ( 'featured_image' === $column) {
     echo get_the_post_thumbnail ($post_id, array(80, 80));
}

if ( 'committee_member_name' === $column ) {
     $name = get_field('committee_member_name');
     if ( ! $name ) {
          _e( 'n/a' );
          } else {
          echo $name;
     }
}

if ( 'committee_member_email' === $column ) {
     $email = get_field('committee_member_email');
     if ( ! $email ) {
          _e( 'n/a' );
          } else {
     echo $email;
     }
}
}

Again, we used our custom post type name committee when calling the WordPress action.

In our function, we retrieve the featured image, and the ACF field values. If there is no value in the ACF field, we just display n/a.

The get_field function is the ACF function for returning the value of a field.

Our posts page is now looking as follows.

CPT populated fields
Columns now populated with our ACF data

Now that our data is populated into the columns, final step is to make them sortable. Currently the columns headings cannot be clicked on to sort yet. We will address that next.

Making the Columns Sortable

To make the columns sortable, we need to call the manage_{$post_type}_sortable_columns WordPress filter. The Manage Sortable Columns filter filters the list table sortable columns for the admin page.

add_filter( 'manage_edit-committee_sortable_columns', 'committee_sortable_columns' );
function committee_sortable_columns( $columns ) { $columns['committee_member_name'] = 'committee_member_name'; $columns['committee_member_email'] = 'committee_member_email'; return $columns; }

The outcome of this function is that our ACF field columns can now be sorted from the admin page (the column headings are now clickable links).

CPT sortable columns
Columns are now sortable

With just a little bit of PHP code, you can completely customise your custom post type admin screens to display your own ACF columns, making it much easier to maintain.