Learn how to add a custom column to a WordPress post or any other post type you want with an easy OOP approach. In this tutorial we will show the user who last edited a post.

In the article before these one we have learned how to create WordPress Menu pages with the OOP approach. Similar techniques will be also used in this tutorial. We will have a class that will used to create each column and we will call that class WordPressColumn. Really inventive, right?

Why use OOP to add Custom Columns in WordPress?

Is there really a need for any OOP? No, we can all create simple procedural functions and create everything. But, with OOP we do not make repetitive tasks. We can write 5 lines for each custom column instead of 20-30 which does make our lives easier when developing WordPress solutions.

By using OOP we will only provide 2-3 simple definitions for each column and our columns will be “magically” created. It is not magic, if we know what happens but every time you add those line for new column and this new column appears in the WordPress admin area, you will be happy!

Our Simple Definition

In our simple definition we will create our class and add attributes for the column options.

The attribute $defaults is used to store our defaults definitions. By using this variables we can pass only a few of those definitions. The only attribute that must be always passed is the column_key. This rule will be defined in our constructor method:

These are some simple rules. Let’s summarize what we do here:

  1. Merge the provided options with the defaults. If some of the defaults are not passed in the array $options add them from $defaults
  2. Check if there is a column_key provided. If there is no column key, throw an exception
  3. If there is no column title, create one from the column key by making the first character of the column key uppercase.

Attaching our Column

As you could see we have used our constructor method just to assign the passed values and to check them or fix them if needed. We have decoupled this constructor method from our methods used to attach our column. Copy this method which we will use to attach our column:

This one is not so simple as our constructor method but it is not too hard to understand. Before I go into explaining what we have done here, you have to understand that for attaching columns WordPress uses one filter hook and one action hook.

Filter for post:

Action for post:

Filter for custom post type:

Action for custom post type:

Filter for page:

Action for page:

You can see here that only the middle of each action or filter gets changed. In our method attach we first define our variable $post_type which if will add the additional part of the action or filter hook for custom post types. If the column is defined for a post or a page, then this variable is empty. Otherwise it will add ‘_post_type’ to the action and filter hook.

If the column is defined for a page then the main middle part is changed from post to page. After that we construct those hooks and add methods to them that will be called when the filter or action is called.

The method that we are passing there are add_column and column_data.

Method for adding the Column

This method is used to add our column to the array of columns. We are adding our column key as the array key and our column title as the array value. This is an associative array which returned back to the filter which is then used to render all the columns.

Method for Displaying Column Data

This method is checking if the parameter $column is the same key as our column key. If that is true, then we will check if the value of our key column_display is set to column_key. That means that we will render the post meta value under the key of our column. If not, it will then call the function by the name provided in the column_key. When calling that function, it will also pass two parameters that can be used to render some data.

Example: Show the User who Last Edited the Post

In this example we will see how we can use this class to show the username of a user who was last editing the post.

We have defined our custom function that will use the $post_id to get the post metadata and also the $column_key as the meta_key of the data. After we get the results which is the user ID, we use that user ID to get the username which is then echoed back.

WordPress Custom Column Factory

What if we have more than 1 column? We do not want to create each column and for each column call the method attach(). It is somehow repetitive too much. With another simple class we can create a factory that will store all our columns and after each of them call the method attach.

In this simple class we have defined an attribute $columns that will store all our columns. After that the constructor method is passing the array with columns to our attribute $columns.

When we call the method add_columns(), we will call the method attach on all columns.

Example 2: Using our Factory to Create Custom Columns

Refactoring our Factory

Now, we still have to create each column separately and then appoint that column in the array for our factory to work its magic. What if we could just pass the definitions for our columns and then let the factory create our columns for us and call the method attach()?

We would have a much convenient way of creating our columns and less repetitive tasks or lines to do. So let’s refactor our code in WordPressColumns:

By providing an array of definitions we will create a WordPressColumn object for each array. Once the object is created, we will call the method attach().

Example 3: Using our Refactored Factory for Custom Columns

Here is the final example where we will use our refactored WordPressColumns class:

Now we are only providing arrays with definitions to be used in WordPressColumn.

Conclusion

In this tutorial we have seen how to create simple custom columns by using object oriented programming. We could have done all of that with regular functions but then we would have to extend our functions for each new custom column or create new functions for each custom column.

With object oriented programming we had to define 2 simple classes that will handle everything for us. We only need to provide our column definitions.

Have you ever tried adding custom columns? Did you struggle with it? Have you tried the OOP approach in WordPress? Share your story with us in the comments below!

Become a Sponsor

Posted by Igor Benic

Web Developer who mainly uses WordPress for projects. Working on various project through Codeable & Toptal. Author of several ebooks at https://leanpub.com/u/igorbenic.

Leave a reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.