HOW TO ADD FEATURED THUMBNAIL / IMAGE FEATURE TO WORDPRESS THEMES

This tutorial which shows how to simply add a featured image option to your WordPress theme. You have to check first if your theme already has this. Look at the bottom right hand side of the screen where you edit posts just below where you create tags for your posts. If this feature is there, then you don’t need to add this feature again. You might just want to read on now to see how you can use it to add featured image. See the image below:

I don’t think your aim is to learn PHP codes now but simply to add featured image to your theme. If that is simply your aim then just follow the steps below because I will not be explaining the codes. If you need explanation, make your comments and requests. I will add that in due course.

Enable support for featured images in your WordPress theme:

To achieve this, you need to add the code below to your functions.php template file. Add it just below the (?>) closing tag.

// Add support for Featured Images
if (function_exists('add_theme_support')) {
    add_theme_support('post-thumbnails');
    add_image_size('index-categories', 150, 150, true);
    add_image_size('page-single', 350, 350, true);
}

Insert featured images as thumbnails in your post or page content:

Still in your functions.php template file, edit the code below.Add it just below the (?>) closing tag.

function InsertFeaturedImage($content) {

global $post;

$original_content = $content;

    if ( current_theme_supports( 'post-thumbnails' ) ) {

        if ((is_page()) || (is_single())) {
            $content = the_post_thumbnail('page-single');
            $content .= $original_content;
            } else {
            $content = the_post_thumbnail('index-categories');
            $content .= $original_content;
        }

    }
    return $content;
}

add_filter( 'the_content', 'InsertFeaturedImage' );

Style the images in your post or page content by adding the following code in your style.css file

.attachment-page-single {
    float: left;
    margin: 12px 8px 8px 0px;
}

.attachment-index-categories {
    float: left;
    margin: 12px 8px 8px 0px;
}

Now go to your post editor to create a new post or edit an existing one. Check the featured image function, it should appear there now.

To add a featured image:

1. Click on “Set Featured Image”
2. Select the image from your desktop of from a URL and upload it.
3. After successful upload, click “Use as featured image” option.

You should have your featured image now.

HOPE IT HELPS!

TO RECEIVE UPDATES ON THIS TOPIC AND VERY USEFUL TUTORIALS IN YOUR EMAIL, SUBSCRIBE BY SUBMITTING YOUR EMAIL IN THE BOX BELOW.

Don't keep this to yourself, Share it with your friends with the Buttons below.