Since WordPress version 2.9, featured images (formerly known as “post thumbnails”) are integrated in the Write Post and Write Page panel. Not all WordPress themes make use of these fields, and a change to your template files is required.

In this post I will explain how you can add Featured Images to your posts and pages with only a modification to your functions.php file, and some basic styling using css. This is in particular useful when you have multiple Page templates, and therefore need to update several files to incorporate the featured images in each page.

This article will outline how to:

Enable support for featured images in your WordPress theme

Before you can add and use featured images, your theme needs to be updated to enable the feature. First of all, you need WordPress 2.9 or higher. Download the latest version of WordPress and upgrade if you haven’t done so already. If you do not see the “Featured Image” section on the right bottom side of your Write Post or Write Page panel (see image here), chances are that you need to enable this.

To do so, you need to add the following code to your functions.php template file:

// 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);
}

As you can see, in the WordPress backend, these are still referred to as Post Thumbnails. The key code here is to add_theme_support for post-thumbnails. The add_image_size lines define what dimensions the featured images will have when displayed.

The code is wrapped in a condition to only do this when the add_theme_support function exists, which should prevent any issues should someone try to implement this on a WordPress version pre WordPress 2.9.

Add a featured image to your post or page

Featured images can be attached to your post or page using the Write Post or Write Page panel. There is a section on the right bottom side where you can set a featured image. Walk through the following steps to attach the image to the post or page.

  • Click the set featured image link
  • Upload a file from your computer, or use an image from the media library
  • Wait for the image to upload, and the following screen to appear. Click the “Use as Featured Image” link
  • The featured image will now show on the Write Post or Page panel

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

    Now we want to insert that featured image in our post or page. To complicate this slightly, we want to use two different dimensions. On our blog index page we want to show a small thumbnail (150px by 150px), but in the full blog post, or on a page, we like to show a larger version of that same image (say, 350px by 350px). We’ve already added code for this in the first step of this tutorial.

    WordPress uses hooks to enable developers to add actions, or add filters to any content that is to be displayed on your site. Without going into too much details, we will use the hook for the post or page content and add our featured images thumbnails to that content, without having to modify any theme template files.

    To do so, we will create a new function that will “hook into that hook, and add to the content”. Add the following code to your functions.php template file:

    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' );

    For those interested, a quick rundown on this code:

    • line 01 defines and names the function (InsertFeaturedImage)
    • line 03 makes sure we have the relevant post or page data available for this function
    • line 05 saves the content of our post or page
    • line 07 ensures that the following code is only executed if there is support for the post-thumbnail function.
    • line 09 checks to see if the content is from a single blog post or page, and if so,
      • line 10 replaces the content with the featured image (the_post_thumbnail), using the ‘page-single’ format (350px by 350px)
      • line 11 appends the saved original content of the post or page to the content with the thumbnail now inserted first
    • Line 13 and 14 do similar for blog index pages, or archive and category pages, making sure the smaller format (150px by 150px) is used
    • Line 18 will send the modified content back, just before it is displayed on your site
    • Line 21 finally will make sure that this function (InsertFeaturedImage) is executed each time before any post or page content is to be displayed

    Style the images in your post or page content

    Finally, we will style the images so that they float nicely to the left of our content, while leaving a bit of room around the image. The image classes (.attachment-page-single and .attachment-index-categories) are created automatically by WordPress, and are based on the image-sizes we defined earlier in step 1.

    Add the following code to your stylesheet style.css.

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

    And that should do the trick. Feel free to leave your comments below.


    added 2011-05-23: To add theme support for post thumbnails on posts AND pages, use the following code:

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

167 comments

  1. كازينو

    Hi guys, tried loading this blog through Google RSS reader and got a strange error message, any ideas what could be the issue?

    1. Ronald

      Since the WordPress images are physically resized (so not dynamically during page load), images on a remote server can’t be used.

      Before WordPress implemented this feature in the core, timthumb was (and still is) a popular solution. It does resizing on the fly, and will save resized images in a local cache folder in your WordPress site.

  2. Stuart Felkner

    Very helpful post and easy to follow. Just completed the steps and am now able to utilize feature images. However, one quick question. How can I add padding to the image so the post text is moved further over to the right, away from the featured image?

    Thanks

    1. Ronald

      Hi,

      you’ll have to play with the margin settings in the CSS code. The 2nd value in the list of four (8px) is the value for the right margin.

      1. Stuart Felkner

        Thanks for the quick response. I increased the margins from 8px to 20px and no change occurred. I played with all four margin values and nothing was changed. Any advice?

        Thanks

        1. Ronald

          Hi,

          I need to see this “in action” on your site, can you post a link?

          1. Stuart Felkner

            Hey

            Thanks for your help. I was able to fix the margin on the page by adjusting code elsewhere. However, now my issue is that I don’t want the featured image to show up on the post-page as well. Any idea what code I can delete or adjust so that featured image appears on home page (150px by 150px) as it does now but not on the post-page?

            Thanks

  3. John

    Thats fine but could you please specify that after or before of which line we need to add these code mentioned by you

    1. Ronald

      You can add the code to functions.php anywhere, just make sure you do so before the closing ?> at the end of the file. The css code should go in your themes stylesheet, it doesn’t matter where really.

  4. Dannyb

    Thanks for the great post! This was pretty much exactly what I’ve been looking for.

    Does anyone know how I could align the thumbnail to the left of the post title, not just the content?

    Here’s my page: http://mynocodata.com/blog/

    I’m using a custom loop.php page to display the post excerpts.

    Thanks

    1. Ronald

      Hi,

      this article describes “the easy way”, in which the image is added to the_content. The content will be displayed (generally) after the header of the post is displayed, so you can’t use this “easy” method using the functions.php.

      You can however skip the (code in the) functions.php bit, and add

      <?php the_post_thumbnail(‘page-single’); ?>

      in your theme template file before the post title (or page title) is output.

      1. Dannyb

        Thanks for the reply. I see your point and think I better understand it now.

        However I tried using “” directly into the template but the output image was full-size, not a thumbnail.

        But thanks for your help. I can use your method from this post until I learn more.

  5. Brice

    Thank you so much for sharing mate, something as simple as setting up a featured image drove me crazy… you made my day

  6. yael

    Hi there,

    Thanks for this. Would you happen to know why I do not have the “use as featured image” link in the upload feature image div? I’m using version 3.0. Also the size option are not there…

  7. LUCKY

    Thanks, for this article now i can add feature image for my client.

  8. Joeri

    Wow, finally the information I needed! Thank you so much!
    One problem, I’ve copied all these codes and put them in the right files, but the images don’t automatically get the right size in the slideshow.
    How can I solve this?

    1. Ronald

      This code will work for featured images in a single post or index/archive page. Not for a slideshow.

  9. Bonita

    Thank you for this!

    I have a question: Is it possible to alternate the way that the featured images display in a list of posts? For example, on the home page in the list of posts, each featured image per post is aligned left with content next to it on the right. Is it possible for me to make every second post’s featured image align right, with the text to the left?

    Please help!

    1. Ronald

      I now realise that you mention “change every second post”. That will require a bit of extra trickery, either in php, css or javascript (jQuery).

  10. Amer Ghalayini

    Thanks alot this was smooth and simple

  11. GM Coffi

    This is the tutorial I’ve been looking for! well documented and easy to understand…great job.

    For some reason my thumbnail have no thumbnails…But I read in other blogs that it usually the other way around (new posts have thumbnails and old ones don’t)

    Any idea on how to fix it?

    Regards,
    GM Coffi

  12. Alex Navas

    First of all, thank you for such a clear explanation. I was trying to figure it out but couldn’t.

    I do have one questions. I’ve followed your instruction to a T but made one change to the code to adjust the single post size to 250 x 250.

    Here’s the code directly from the functions.php file:
    if (function_exists(‘add_theme_support’)) {
    add_theme_support(‘post-thumbnails’);
    add_image_size(‘index-categories’, 150, 150, true);
    add_image_size(‘page-single’, 250, 250, true);
    }
    However, on single pages, it still shows up 350 x 350. Here’s an example: http://www.alexnavas.com/how-packaging-your-business-can-increase-your-income/

    I’m using Builder as the theme.

    Thanks for your help

    1. Ronald

      there is other css code that is overriding the code you added (.hentry img). That leaves you no other option than to specify height and width yourself, e.g.

      img.attachment-page-single {
          float: right;
          margin: 0px 0px 10px 8px;
          height: 250px !important;
          width: 250px !important;
      }
      
  13. Shaun

    Thanks so much for this. I have one problem. The images are showing up on both the excerpt and the post…however, they are flush left and instead of the text lining up next to it on the right, the text is appearing below the image.

    Is there something I can do to remedy this.

  14. shaun

    Actually, for whatever reason the thumbnail is now left with the text to the right, but the top of the thumbnail is not alinged with the text. The text starts above the thumbnail, giving the thumbnail and awkward appearance on posts where the text is shorter.

    Is there a way to fix this?

    I input everything as you suggested, although I replaced 150, 150 for 350, 350 since I wanted the smaller size to appear on both the excerpt and the main post.

    Thanks so much for your help with this.

    1. Ronald

      you’ll have to fiddle with the CSS code, increase the margins probably.

  15. David

    Thank you so much for this post, a real lifesaver!!!

    I prefer to avoid plugins at whatever cost and this worked like a charm, I had some initial trouble and had to recreated one post cause the thumbnail wouldn’t behave but now she’s under control :)

    Keep up the good work

      1. David

        Im adding this to another site but I don’t want the featured image to appear in the post just the excerpt, I figured if i just remove

        ‘ $content = the_post_thumbnail(‘page-single’);
        $content .= $original_content;
        } else {‘
        that it would work but it doesn’t. Can you help shed some light on this for me.
        Thanks.

  16. Holger

    Ronald,

    worked on first try, used manually enable instructions.
    very detailed and easy to follow.

    thanks for the quick reply via forum.

  17. Stu Mo

    You state featured images on posts AND pages. I’m running wordpress 3.1.1 and have featured images and have set them on POSTS but have no option to add them to or feature them on PAGES. Can you explain how I do this for PAGES (not POSTS), thanks.

    1. Ronald

      good catch, I didn’t include the proper code to enable support for posts AND pages that in functions.php.
      I just added it to the end of the article.

  18. ashutosh joshi

    I can’t tell you how much this article helped my. Adding featured has highly improved look of my website. thank you very much. and keep giving such posts…

    1. Ronald

      Add the same line of code for the_excerpt in functions.php:

      add_filter( 'the_excerpt', 'InsertFeaturedImage' );
  19. ashutosh

    Sir I how can I show continue reading after the excerpts?
    please give reply to my questions sir..

  20. ashutosh

    Sir I has got one other question-
    How can I link the featured image with post?

  21. Kevin K

    Hello, sorry I’m VERY new at this and I’m setting up my website now. When I follow your instruction. I’m getting a small icon and the large picture. You can see http://www.briefopinions.com

    Now that I’ve played with it, I think my “featured” picture is automatically being inserted into the post even though I never clicked the button “insert into post.” Any ideas?

    1. Ronald

      Hi,

      “the easy way” in the title indeed refers to the fact that this is done automatically, which is what this article is about.

      If your theme already inserts featured images, you should not need to add additional code to do the same.

      1. Kevin K

        Wow I got it now. I guess it was very late last night. Thanks for the help. Great tut.

  22. Siobhan

    Hello,

    I’m trying to figure out if it’s possible to use a rollover image as the featured image thumbnail.

    Here is a link to my site: http://siobhanmcdevitt.com/

    As you can see, all of my project thumbnails are illustrated using a blue & white color scheme. When the mouse moves over each thumbnail, I would like them to change to photographs of the projects.

    I’ve been researching how to accomplish this for a long time with no luck, so any ideas are appreciated.

    Thanks!

  23. indika

    Hi Ron,

    Thanks for the very useful article. is there a way i can add a different css style to the thumbnails on wordpress categories. i got this page on my site where showing posts from a category. for this page i need to give a different style.

    very much appreciated if you can help me on this.

    1. Ronald

      You could add another condition based on category, such as is_category (http://codex.wordpress.org/Conditional_Tags#A_Category_Page) and assign a different thumbnail size. This code should go into functions.php (http://vanweerd.com/how-to-add-featured-image-thumbnails-to-wordpress-posts-and-pages-the-easy-way/#insert_image)

      Then add the required css code for that new selector (http://vanweerd.com/how-to-add-featured-image-thumbnails-to-wordpress-posts-and-pages-the-easy-way/#style_image).

      index-categories is currently used as a general selector for all posts or pages that are not single posts, but the name is irrelevant, you can name it anything you like.

      1. Haseeb

        Hey Ronald, great article. I came across because I am having a problem in increasing my featured image size that is shown at home page with the respective post. I have a theme that has the thumbnail support by default but I have done everything to increase the size of featured image thumbnail on index page. Can you please help me out in it. I’ll be very much thankful. I don’t know codes and stuff.
        Regards

  24. indika

    Hi Ron,

    How can i enable different thumbnail sizes for post & pages. is there a modification i need to do your script.

    ex: post thumbnail – 200 x 200

    page thumbnail – 150 x 150

    kindly provide me some help.

    indika.

  25. Luxurytracks

    When I load my site on to facebook or any other social network the facebook or twittter thumbnail comes up as the icon! I would like for my logo to appear as the icon..Any advice?? Thanks

  26. Sarah O'Neill

    Hi Ron,

    I recently installed a script to migrate my pixelpost blog to wordpress. It seemed to work but the thumbnails and images are not showing in the migrated posts. If I upload a new image in a post, the ‘featured image’ works. I have over 600 posts from my pixelpost blog … I have tried looking into bulk actions in the ‘Posts’ section but the option isn’t available for ‘featured posts’. I have to manually go to each migrated post and set the featured image option, show the photo I want to attach to post and resave.

    Is there any way around this then doing every manually?

    Sarah

  27. yp

    Could you help me fix the following:
    The images are showing up on both the excerpt and the post…however, instead of the text lining up next to it on the right, it is appearing below the images.

    1. Robyn

      This is the same exact problem I am having!

  28. yp

    Nevermind, I got it to work.

    Thanks for the great article!

  29. Zininweb

    Great article, veryy helpful. My question is if it is possible to have more than one featured images on one page.

    1. Ronald

      no, WordPress allows you to attach only one featured image to a post. You can of course insert images in post and page content yourself.

  30. Raj

    will this featured image be good for listings on google search results?

  31. Ashutosh

    Sir I am very thankful to you. I am just a child in the field of wordpress but your easy tips helped me a lot.
    I have totally transformed my wordpress theme.
    you can check it http://www.funnattack.com/home
    but sir I have one more question…
    I want to change the background color of read more button. will you help me please…
    Thanking you
    Ashutosh

  32. Diogo

    I just want to say thank you so much Ronald! Awesome tutorial!

  33. Alex Navas

    Hey Ronald, I used this again on another site and now found out that the featured image is appearing twice on my site at http://www.AwakenedPurpose.com/blog. Do you know why this could be happening? I checked the code and I’ve only placed it once from what I see.

    Thanks again for this great resource.

    1. Ronald

      Hi Alex,

      perhaps the theme is loading the featured image by default (so you don’t need this function to do so yourself)?

      Otherwise, hard to tell from here, can you double check the code in functions.php and in index.php?

      1. JimmyLaz

        I can confirm the featured image is appearing twice in category list view…can’t report URL because site in development but having the same issue here.

        Plug-ins installed: Regenerate Thumbnails, Auto-Hyperlink URLs and Front Slider. I doubt any of those are interfering.

  34. Mike

    Great article, exactly what I was looking for. However when I add the code, the thumbnail shows up twice. Any idea where that is coming from?

    1. Ronald

      Mike, check the comment right above this one. What is the url of your site, page where this happens?

  35. Felipe Veiga

    Thanks for the post, it really clarified my questions. And also, thanks to Jimmy for the plugins he nominated, really usefull. Thou I am now using Ajax Thumbnail Rebuild.

  36. Tom Durkin

    HI really useful and easy to follow, thanks!

    One question, I use images that have all different aspect ratios so setting a width and height for every single image by default leaves some distorted.

    Is there a way that the feature image can automatically ‘crop’ rather than actually resize the image?

    This would be really useful for me

    Thanks again

    Tom

  37. Mike

    I too am getting the double thumbnail issue on both the single post page and the category page. On the category page the thumbnail appears next to each other, on single page the extra thumbnail is added at the top of the page, along with the post excerpt. On checking the source code the thumbnail and excerpt appear just after the body tag.

    Had a route around and can’t see anywhere else the thumbnails are being called. I’ve disabled the thumbnails for now, but can send both my functions and single pages if you’d like?

  38. Rohan

    Hey. Awesome article.

    But, I don’t know, I did something wrong while editing. :(
    1. I followed your instructions of adding the feature of “Featured Image” in the blog – That’s Done.!
    2. I tried one post and then adding one Featured Image, I posted one article. – That’s Done.!
    3. I can now see that, Featured Image is displayed on screen. :)

    But, The image is aligned at left (which is right) and text is displayed below the added image. What I want is, Featured Image on left and Text of the post should start just after the image on its right.
    Why the text is displayed just beyond the image?

    Please help me out.
    In case of any editing, please tell me, what should be done.
    Thanks a lot, in advance.

    1. Ronald

      the css code should align the image in such a way that text sits next to it. Check your code, and if you want me to have another look, also add a link to your site.

      1. scott

        hey ronald, i am having problems with adding featured posts. http://rugbywarfare.com/ that is the website. the image is on the left, i have altered the margins that the text is on the right ( but it is still below the image ) and it just looks horrrible. this is really frustrating

  39. Magnus

    Great Article!

    I managed to get the thumbnail but the text is not floating around the image even though I added the CSS as described.

    I suspect something is overwriting it?

    Could you have a look:
    http://www.magnusbogucki.com/blog

    thanks!

  40. Magnus

    Also, by default it seems the thumbnail picture is 366×500 whilst I set the thumbnail on my index page to 100x 100 but Googe Page speed complains and says this

    “http://magnusbogucki.com/blog/Hochzeitsfotos/morcote13.jpg is resized in HTML or CSS from 366×550 to 99×150. Serving a scaled image could save 40.1KiB”

    So my question is, how can I get around this?

  41. Juddc

    Hi Ron,

    Any way you know of to add a link to the Featured Image? Say I have a display image that I want to link to another website or a specific URL. Any thoughts?

    Thanks for your time,
    Judd

  42. Wella Baker

    Hi Guys,

    I hope you can help me. I am not really familiar in WordPress Codex. I have a problem about my featured image theme of each blogs. I just add blogs to my site and after that the featured image in the theme got error44. Please help me…..

  43. Johan

    Wow this code work likes Rocket !! So much thanks for this type of post :)

  44. Daniel

    Do you know if it’s possible to disable a featured image on a multi-page post? For example, I want the featured image to display on the first page, but then once the user visits the second page, they don’t see the featured image? (as at the moment, I’m only able to make it appear on both of them).

    Any ideas, or advice on how I could go about this? It’d be much appreciated.

  45. Dave

    This has help me with the exception of one problem. yp stated it above, the featured image shows up, but the excerpt text is below the image, not to the right of the image.
    I have added the css from the tutorial above, but am now stuck. Any suggestions?

  46. Praveen

    I face some problem in showing Thumbnail. anyway thanks for this tutorial i will sort and fix the problem out. :)

  47. Scott Sprich

    Ron. Your EASY instructions finally got this to work on my site. I’ve looked all day and every other explanation didn’t work for whatever reason. I did exactly what they said, but obviously you say it better.

    You saved me valuable time and made my site that much more appealing to readers.

    Thanks a bunch.

    Scott Sprich

  48. Scott Sprich

    So after further inspection I’m having some issues. On some of my posts where the featured image is a larger size it’s replacing my header image when on the page. Here’s an example: http://sprichie.com/adding-the-pin-it-button-to-ipad-bookmarks/. I used firebug to tell me some more and this is what it shows:

    On the incorrectly viewed post:

    The way it should look with my main theme’s image:

    It’s happening here as well: http://sprichie.com/2012-new-years-resolutions/

    As you can see when the original featured image I upload is of a larger size it’s replacing the header image, at least it appears to.

    These are the changes I made to the “Add support for Featured Images”.

    // Add support for Featured Images
    if (function_exists(‘add_theme_support’)) {
    add_theme_support(‘post-thumbnails’, array( ‘post’, ‘page’ ) );
    add_image_size(‘index-categories’, 250, 250, true);
    add_image_size(‘page-single’, 515, 515, true);
    }

    Just trying to give as much info as possible. Thanks Scott

    Also what comment plugin are you using?

  49. Shivkumar

    While going through the post simultaneously applying on my blog
    got a kindle error but your reply to others comment help me a lot
    thanx Ronald

  50. Luv What You Do

    How do I make a featured image in Windows Live Writer?

    Any idea how to make a Sticky Post in there too?

    Thanks!

  51. This worked PERFECTLY.

    I had to remove lines 10 and 11, but once I solved the dupe image issue, it was perfect.

    You have no idea. I’ve been pulling my hair out over this. THANK YOU for such a detailed and helpful tutorial.

    1. Ondra

      Everything is OK. Fail = Related posts. Related posts now OFF and I have one picture in post.

  52. Danny Geraghty

    Great post. I’m having an issue that one other user mentioned above but for some reason I cannot solve myself. I’m trying to get the thumbnail to align to the left of the title + text + meta data and not just the text itself. On Nov 7 2010 you said put this code before the title:

    I did that in content.php but for some reason the thumb still appears above the post. I’m trying to do this for my index page only using the standard twentyeleven WordPress theme.

    Do you have any suggestions?

  53. Sue

    I dont want the image to appear in the post,only in the excerpt,but I`m not a codes savvy.Can you direct me to a plugin that could help me with that?

    Thank you

      1. BlogGirl

        thank you for this answer! :) Was about going crazy just thinking of a solution. ;))

  54. Jakob

    Hey. very useful code! thanks!

    Is there a way to add the featured image above the post-title? I’m working on a thematic child theme and i’m having some trouble with this

  55. Rob H

    Thank you for writing such a clear post, especially giving explanations too.

    I used it exactly as it is and have no problems; in fact, thanks to your explanations I have been able to tweak styling etc. to suit my needs.

    Also, it is great not to have to use a plugin as this only slows a site down; and I for one would rather have full control over my site rather than use another plugin.

    Thanks again!

  56. Mike

    Thanks a lot, I have been searching for this solution for quite a few hours now :-)!

  57. Nikita Sharma

    This post really helped me so much.
    I enabled featured image in my wordpress theme.
    and now I also know, how to use CSS for featured image.
    thank you so much admit for this wonderful article.

  58. CoffeeChug

    This code works nearly perfectly, however when I do a search on the site, the results posts all have 2 thumbnails. Any suggestions?

  59. Dachel Miqueli

    What if you have the “Feature Image” available when Im creating pages but when I try to write a Post is not available. Any suggestions?? I tried to do the tutorial but I think Im not that smart for codes :(

  60. Vipin

    i was looking for this since long..thanks alot ronald for this..

  61. KAF

    ThanX alot
    god bless you man
    it works 😀
    easy & effective.

  62. Andy

    Great post! Helped me sort out the thumbnail issue. 110% useful and thanks for this.

  63. Nick

    2013 and still this guide help me do what I needed to! Thanks a lot :)

  64. Jack Logan

    Thank you very much!
    Very useful article. I learned something else.
    Best regards,
    Jack

  65. .com

    I’m new to this entire writing a blog thing and putting feedback for backlinks. I see tons of individuals are just adding in comments like “wonderful article” or “superior post”. Isn’t
    this spam? Why do a lot of websites allow this stuff to be published?
    Is there not an automatic get rid of function for posts?

  66. henry

    thanks for these instructions …
    it worked somehow, BUT the following shows up: after pushing “home”
    the featured images in the post is in correct size (150×150)
    the same image is added right below in big size, what is very disturbing
    >>> so I have image doubled
    in archive the missing image now shows up – very fine BUT in big size too

    any advice/tips/hints what to change in the code in functions.php ?

    p.s. I tried to set “add_image_size(‘page-single’, 150, 150, true)” – but this was ignored
    installed local WP 3.5.2.

  67. Dina

    Hi,

    This worked great for me! Thank you!!! Except the CSS classes are not working :( I tried adding a border and even that doesn’t work.

    I would ultimately like to have the featured image appear on the left side of both the title, meta, and text of the post. Can you please advise me on how to edit this code in order to do that.

    Thanks again!!!

    Dina

  68. Rita

    I am not seeing the same dialog box, where it gives me the options for alignment, size etc.
    so in my post the image is appearing above the content and I want it to appear to the left side.

  69. w3helps

    Thanks for nice post. I think I want to show all featured image in one page.

  70. Paul Beach

    This was a super helpful post. The only issue I had was resizing & styling the image that is posted to the single post. Specifically, this line.

    add_image_size(‘page-single’, 350, 350, true);

    I was trying to insert larger pictures 650W by 300H and for whatever reason when I played with this code I couldn’t get it to work. I ended up taking this line of code out so I could manually insert the picture, which requires more work but for my needs is easier to configure. Anyhow, thanks for the lines of code – on my main site (not the one listed above) it’s working beautifully.

    Cheers,
    Paul

  71. vas gargan

    Very nice tutorial, helped me a lot!

    I want to mention a couple variations I used that may be useful:

    1. Instead of specific image dimensions

    add_image_size(‘index-categories’, 150, 150, true);
    add_image_size(‘page-single’, 350, 350, true);

    I used

    the_post_thumbnail(‘thumbnail’); // Thumbnail (default 150px x 150px max)
    the_post_thumbnail(‘medium’); // Medium resolution (default 300px x 300px max)
    the_post_thumbnail(‘large’); // Large resolution (default 640px x 640px max)
    the_post_thumbnail(‘full’); // Original image resolution (unmodified)

    from http://codex.wordpress.org/Post_Thumbnails

    2. Nowadays a lot of themes use special .php files for filters. I think you should mention that before editing functions.php file

  72. ragots

    Thank you. This is the only place I found clear instructions. Thank you. God bless

  73. Wiz

    Your code helped a lot, I feel I should let you know that all of your images are broken.

    1. Ronald

      Hi, thanks for letting me know, and I know, I am busy getting other peoples sites up and running, and way behind getting my own maintained and up and running properly, but I do appreciate your message.

  74. Andrew

    Excellent code.

    As I noticed, a few people have been having double post images. I have not been able to find a solution for my problem. I looked around and could not find the theme already loading a featured image. I also tried disabling related posts and other plugins I am using, but it’s still loading two images.

    Any help would be greatly appreciated.

  75. OLivier

    I was looking for “How to re-enable the featured image box modal” but I didnt find it; Now this article showed me how I can just & simply add a featured img to my theme.

    Thank you Author.. Nice job !

  76. Ashween

    Hello I am using a wordpress site with Charlize theme. The post pages did not have thumbnails hence with the help of the above article I copied in certain things to the editor (functions.php, style.css).

    However, while doing so my blog just went blank. I cannot see anything but a blank page now. If I log in from another computer it shows
    “Server error. It may be down for maintenance or configured incorrectly.”

    I am new to wordpress and blogging. Have been blogging since 1.5 months now.
    So please use basic language while explaining me the solution.

    My website link is:
    http://www.life360degrees.com

    Please help.

  77. […] How to add featured image thumbnails to WordPress … – Since WordPress version 2.9, featured images (formerly known as “post thumbnails”) are integrated in the Write Post and Write Page panel. Not all WordPress themes … […]

Leave a Reply