Custom Column in Posts

123

Step 1 Activate Featured Images

In this tutorial we will use the functions.php file available in our active theme directory. If the file is not present, you can create a new one with the following contents:

<?php
// FUNCTIONS
?>

First of all, check if the Featured Image is available on the Add New Post page:

If you don’t see the Featured Image box, add this line to functions.php:

 

add_theme_support('post-thumbnails');

We also set a custom size of 55 pixels that will be used to show the featured image’s preview:

add_image_size('featured_preview', 55, 55, true);

Step 2 Add Custom Column to the Posts Screen

// GET FEATURED IMAGE
function ST4_get_featured_image($post_ID) {
    $post_thumbnail_id = get_post_thumbnail_id($post_ID);
    if ($post_thumbnail_id) {
        $post_thumbnail_img = wp_get_attachment_image_src($post_thumbnail_id, 'featured_preview');
        return $post_thumbnail_img[0];
    }
}
And we define two functions: the first will add the new column, the second will call and show
the featured image in every cell of the new column:
// ADD NEW COLUMN
function ST4_columns_head($defaults) {
    $defaults['featured_image'] = 'Featured Image';
    return $defaults;
}
// SHOW THE FEATURED IMAGE
function ST4_columns_content($column_name, $post_ID) {
    if ($column_name == 'featured_image') {
        $post_featured_image = ST4_get_featured_image($post_ID);
        if ($post_featured_image) {
            echo '<img src="' . $post_featured_image . '" />';
        }
    }
}
//Hook Functions
add_filter('manage_posts_columns', 'ST4_columns_head');
add_action('manage_posts_custom_column', 'ST4_columns_content', 10, 2);

Final Result

Now we can finally write a Post with a Featured Image:

So, when you open the manage Posts screen in /wp-admin/edit.php, you’ll see the new Featured Image column:

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s