PureNews

PureNews is an amazingly sleek and powerful news theme with unlimited color variations.

View full feature list Check out the live demo Buy this theme today

Featured Image: WordPress’ Best Underused Feature

Posted by on 24th Jun 2010 | 31 comments

With recent releases WordPress has been moving more and more away from being a basic blogging platform and into being a full-fledged CMS. This is especially true with the recent release of 3.0 and the merging of the regular and Multi-User versions of the product.

However, one feature, implemented in WordPress 2.9, has a lot of potential both for bloggers and for those wanting to use WordPress in a non-traditional way. That feature, Post Thumbnails, now listed as “Featured Image” in 3.0, is a powerful tool for adding a strong visual presence to your site.

Best of all, it takes a lot of the work of adding images to your site out of your hands and automates much of the process of adding images, including sizing and cropping them.

Unfortunately, it’s a feature that is not seeing a lot of widespread use, largely because it is new and many WordPress users don’t fully understand what it can do. However, it is a feature that has the potential to make sites better and eliminate a lot of the work with creating new posts, making it well worth exploring further.

What is a Featured Image?

The basic idea behind WordPress’ Featured Image function is that many bloggers, on their home page, want to display an image that is associated with a post. This is very common with magazine-style themes where images are frequently used with text snippets rather than the actual post.

However, implementing this has always been tricky. Previously, users had to take advantage of custom fields, which would allow users to specify additional information about a post, in this case the location of a thumbnail image.

But while that system was effective, it was kludgy and required a lot of work on the part of the user. The user not only had to specify the custom fields the theme was going to use, but had to crop the images to the exact right size and then upload them (possibly using WordPress’ media uploader) and then paste in the raw URL. Considering one post might need multiple image sizes, this can be a huge hassle resulting in a lot of time wasted cropping and uploading different images.

WordPress now offers a better way to do this through Featured Image. The user simply uploads a single image, designates it as a featured image and then WordPress resizes it as appropriate and places it into the theme where desires. So, where previously one might have to resize and upload multiple images, now a user can upload just one and not worry about resizing.

In short, it is a powerful feature that can simplify the use of images on your site and greatly help you beautify your presence on the Web.

Why So Underused?

To be fair, though the feature is underused, the featured images tool is getting more and more use. A big part of the problem is that use of the feature requires a compatible theme and most, as of the release, of 2.9, simply were not compatible. That is slowly changing and even the new default WordPress theme, Twenty Ten, supports it.

Still, most themes do not support the feature and though you can convert a theme to use it, the process is far from simple for someone easily intimidated by code.

But even on themes where it is available, there isn’t always much use for it. A site with a traditional blog layout can always make some creative uses for the feature, but most themes were not built with this feature in mind and don’t really have a use for it. It is the new themes, being developed now, that are making great use of it.

How to Use Featured Images

If your theme isn’t compatible with featured images, you need to first set it up. You can read how to do so here with some additional sizing suggestions here.

Once you do that, if you are using WordPress 3.0, you should see a Featured Image box on the right-hand side of the post page. Initially it will only include a link to “Set Featured Image”. If you are using WordPress 2.9 it will refer to it as a Post Thumbnail.

Clicking the link will open up the usual WordPress image uploader where you will upload the image as usual. Simply make sure that it is either the same size or larger than what the final thumbnail will be. Once you’re done uploading the image, simply click the link that says “Set Featured Image”, which is next to the button to insert it into the post.

Once you’re done, a preview of the image should appear in the right-hand box and you are free to insert the image into the post as with any other image.

WordPress should take care of the rest, including resizing, cropping and ensuring that the image is in all of the right places.

Bottom Line

Featured Images is probably one of the most powerful tools that has been introduced into WordPress over the past few years but it is one that we have only begun to see the fruit from.

What is going to be most interesting about this tool is how it will share WordPress development over the next few months and years and the new themes, ideas and uses for it that will come out during that time.

However, that also means that now is the time for bloggers to familiarize themselves with the feature as the next theme they use or site they build will likely take advantage of it and it’s best to hit the ground running on these new features.


31 comments - Leave a reply
  • Posted by Online Marketing Exp on 24th Jun 2010

    You can create your own online bookstore to sell used books. Decide a name for your bookstore, which can easily attract large number of buyers. It is advisable to choose a name that describes what you do. For instance, Quality books or reader's paradise can be a right choice.

    • Posted by Mark Cofano on 25th Jun 2010

      The only bug that I've found so far is that when specifying a featured image, if the image has a width of more than 640 pixels, WordPress resizes ONLY the horizontal dimension so that the image is now 640 pixels wide. This causes the resulting image to be "squished" as the vertical size remains unchanged.

      It's curious that WordPress did not include all of the options included in the standard Insert Image dialog (where a user can decide on the size of the image after resizing, i.e thumbnail, medium, large, fullsize).

      • Posted by guitarguynec on 25th Sep 2010

        Hey Mark. I'm pulling the featured image in two places. On the home page I use

        the_post_thumbnail('thumbnail');

        to pull the auto sized thumb. It's 80×80 as set in the media settings.

        On my author page, I wanted a 40×40 to show in independent feeds. So, I used this

        the_post_thumbnail( array(40,40) );

        Hope this helps! -Anthony

        My recent post Lower the Federal Interest Rate

  • Posted by joe on 28th Jun 2010

    What about time for your web site to load.? Does all the images slow that process down.?

    Heard that new google search process penalizes if your site is too slow to load, not to mention visitors waiting around for loading.

    Joe

  • Posted by Jen on 1st Jul 2010

    Can you set a featured image and then customize the link behind it? I'm confused by the settings, there only seems to be File URL and Post URL, neither seem to be editable.

    I want to set a featured image for a post and then direct the destination when someone clicks it. Is this possible?

  • Posted by Reggie on 10th Jul 2010

    I just installed the "Socket" theme on WordPress 3.0 and I'm having a tough time getting my image to work on the 3D slider on the home page. Can anyone give me some insight on this? Thanks.

  • Posted by AlexA on 13th Jul 2010

    Hi Jen,

    Yes, I want to customize the link behind it also..did you already found a solution?

  • Posted by Jen on 13th Jul 2010

    I have not found a solution. Apparently everyone thinks the featured image should link to the post and only the post. I think we should have the option to have it link other places.

    • Posted by johncrumpton on 6th Oct 2010

      I agree, although there should be a way of changing this via the functions.php

  • Posted by Christopher on 8th Sep 2010

    Thanks for this clearly written resource. I've created a site where each page has a custom background, and have started to use the featured image feature of WordPress to accomplish this. Thanks for the links to justintadlock.com and wpengineer.com, between the three articles I got everything I needed!

    To the commenter above asking about load times: all images increase the time it takes to load a page, and images like this, which require a call to the database to generate the image source, increase it more. Of course, for individual, small pictures, the increase is minimal, and if you don't have tons of pictures on a page, it's no big deal. If you care about page load times a lot, I suggest a great article I just read by Chris Spooner at Line 25.
    My recent post Figuring out if a WordPress page is descendant from another

  • Posted by Winnipeg Web Designs on 23rd Sep 2010

    Does anyone know why when you use a featured image in WordPress 3.0+ The height seems to maxout @ 200px? For example I took 600px file and selected it.. When you view the WordPress site the Featured image is 600px wide but 200px in height. If I use a 400px wide file then the file will be 400px wide but 200px high??? I just want WordPress to apply Medium settins for all pics (300×200) for displaying!

    • Posted by guitarguynec on 25th Sep 2010

      I put more details above, but try pulling the image like this

      the_post_thumbnail( array(600,600) );
      My recent post Lower the Federal Interest Rate

    • Posted by Amy on 30th Mar 2011

      Did you figure this one out? This is exactly the issue I'm struggling with. It only happens if the image is very wide, I noticed if I sized the image down to thumbnail size, it doesn't cut it off at 200 high.

  • Posted by @mattmcgill on 2nd Oct 2010

    is it possible to set a default featured image? i have twitter tools create a post once a week on my blog, it would be nice if i didn't have to go in after and set the featured image…
    My recent post my tweets from last week

  • Posted by Stijn on 10th Oct 2010

    Indeed a very powerful feature. I'm building a site for a client, and he asked a possibility to have a different image on the right of the layout on almost every page. After a little bit research I found this article… so my problem is solved! Thanks for writing this down!
    My recent post 9 Great Reasons to Use WordPress for Building Websites

  • Posted by lextergroove on 2nd Nov 2010

    It looks like an image can't be used twice as featured image in multiple articles?

  • Posted by AJ C. on 10th Nov 2010

    Featured Image is one of the best improvements of WP 3.0!

  • Posted by Greg Swift on 12th Nov 2010

    This is a great resource for us WordPress users who are learning. Thank you!

    What I'm wanting to do, with the Suffusion them I'm using, Is have the Featured image show up on the front page where my posts are listed (seems to default to a small size no matter what I choose), and then have the larger image inserted directly into the post without the featured image showing up again.

    Does that make sense? You can see what I mean by looking here: http://www.GregSwift.com .

    Thanks in advance for any help on this.

    Greg Swift
    My recent post NIA President on Fox News – Beware of Massive Food Inflation

  • Posted by rajeev on 8th Jan 2011

    how to insert featured image in post from frontend

  • Posted by Grant on 10th Jan 2011

    Everytime I change the "Link URL" to the Featured Image, click "Save All Changes" both times and then hit "Update", it automatically reverts the "Link URL" back to the original one. What do I need to do differently in order to get it to point to an external link? In a perfect world, the user would be able to click the Featured Image and it would open an external link in a separate window. Unfortunately, I am FAR from having this all happen. :) Thanks in advance!

  • Posted by pranoy sinha on 16th Jan 2011

    HI,
    I am using the latest WP version and have pasted this code in functions.php to show featured Image.
    if ( function_exists( 'add_theme_support' ) ) // Added in 2.9
    {
    add_theme_support( 'post-thumbnails' );
    }
    In TinyMCE editor interface i can feature an image but when i am updating the post OR open the post for edit NO Custom meta box for this Featured image appears. Pls help. Any idea pls help me.

    Cheers,
    pranoy

  • Posted by @PaulJAlbertson on 5th Feb 2011

    Hi – If anyone is using featured images for a Home page slider or just as a picture on a home page etc and they want to link to a different page or post or even just remove the link this plugin will help:
    http://wordpress.org/extend/plugins/page-links-to

    To make the Featured Image to appear as if it has no link (i.e. home page slider etc.) just put a # into the post/pages new link box when you install the plugin. – works really well and save loads of time digging in to the code. Hope it helps.
    My recent post John Carlton Giveaway

  • Posted by winnipegcomputermaster on 9th Feb 2011

    Hey thank you for the great insight for wp users looking to learn about maximizing word press potential! this is a great article i dugg and delicisioused ya for others to find! great job and good work!

    My recent post Free Winnipeg Computer Repair Guides

  • Posted by Mike Campbell on 10th Feb 2011

    Does anyone know how to link a featured image from someone else's blog on mine?
    I am linking to their website for the article, but want to be able to link the image as well.

    My recent post Cold Cash and Values – Busted Halo

  • Posted by Jan on 16th Feb 2011

    How do I link the featured image to a url not to a post or image?

  • Posted by wizmosis on 28th Feb 2011

    Using 'set feature image' in the default twenty-ten theme and having big problems;

    It frequently decides to disappear even after working for a while, and worse; When I have a gallery or slideshow on the page, it insists on adding the featured image, which I have sized to fit at 940 x 198, into the gallery or slideshow as well, where its long thinness looks ridiculous amongst the other images. I don't want it in the gallery at all.

    When I remove it from the post everything falls apart; the gallery skips random images and my feature image is gone not only from the gallery but from the top of the page. All my pix have been sized before uploading so they aren't too big. Don't know why it's acting so buggy, and I have to teach a roomful of people how to use WordPress tonight. Yikes. Help.

  • Posted by @reformedstudent on 19th Mar 2011

    did you ever get this figured out? – I would like this ability too!

  • Posted by Kavita on 26th Mar 2011

    Hi Jonathan, thanks for the post. I am using swift theme. It is creating 5 different size images. I want only one. Do you have any idea where to necessary setting for it
    My recent post How important is video blogging to conventional blogging

  • Posted by Hypebabe on 1st Apr 2011

    I wonder if you were able to fix this issue as I am experiencing this same thing too using the same theme-Suffusion. Is there a way to upload the featured image without getting a duplicate? The default is so small and I will like it to be a medium size. I know this is possible because I have achieved this result in a different blog that I had also using Suffusion theme but for some reason I have completely forgotten how I arrived there before. Please someone help

    Thanks

  • Posted by Pam on 20th Apr 2011

    I set the featured image. Now I want the image to appear with the title of the post on the front page of the site. Right now only the title is showing. Is this possible to do?

  • Posted by Arvind Ranabhat on 25th May 2011

    How can we set the featured image using the URL? the url box only gives the option for inserting the image into the post.