Show Featured Images in RSS Feed and Feedburner


Today I want to tell you about “Adding thumbnails to RSS feed” or better to say “Show featured images in RSS feed“. This method will work with your WordPress RSS feed and with Feedburner RSS feed. As you know, you can add a featured image to your blog post and this image will be displayed in a specific place, somewhere near to your blog post excerpt on the home page of your blog (the place and size depends on your template).

By default this thumbnails or featured images will not be shown in your RSS feed, but you can fix that by adding some piece of code into your functions.php file.

Why to Show Featured Images in RSS Feed

To Make Your RSS Feed Look Better

By displaying featured images or post thumbnails in your RSS feed (or Feedburner feed) you will make it more accurate, beautiful and more informative, especially if you are showing just excerpts of your posts. This will improve web design of your blog. Text is boring, give some images to your subscribers. As an example you can visit My RSS Feed, Don’t forget to subscribe! :)

And this is how my RSS feed looks in RSS reader:
add thumbnails to RSS Feed

Get More Traffic from Your RSS Feed

My statistics shows that subscribers are coming from RSS readers more often if your post have some images. That trick is working on my blogs, maybe it will work on yours.

How to Show Featured Images in RSS Feed

To output your featured images in your RSS feed, you need to add some code to your functions.php file. Go to your WordPress Dashboard / Appearance / Editor, choose functions.php and add this code at the end in new line (make a copy of your functions.php file… just in case).

function featuredtoRSS($content) {
global $post;
if ( has_post_thumbnail( $post->ID ) ){
$content = '' . get_the_post_thumbnail( $post->ID, 'thumbnail', array( 'style' => 'float:left; margin:0 15px 15px 0;' ) ) . '' . $content;
}
return $content;
}

add_filter('the_excerpt_rss', 'featuredtoRSS');
add_filter('the_content_feed', 'featuredtoRSS');

Save your changes.

The example of inserting the code to functions.php file:
Show Featured Images in RSS Feed

Styling Your Featured Images in RSS Feed

Size of the Featured Images

This hack will add featured image with “thumbnail” size and it will be shown from the left side of the post excerpt, but you can change it. In the this line: . get_the_post_thumbnail( $post->ID, 'thumbnail' change the word ‘thumbnail‘ to ‘medium‘, ‘large‘ or ‘full‘ (‘full’ will show the original size of your thumbnail image, I’m using full images). It will be a good idea to delete floating if you will change the size to ‘large‘ or ‘full‘, because images will not fit to your text. So read my next tip.

Style of the Featured Images

By default this hack will put images to the left side of the excerpt, but you can change the float side in this line: 'float:left; margin:0 15px 15px 0;'. Change that line to this one (with quotes): 'float:right; margin:0 20px 20px 20px;'.

To remove the floating (for large and full sized images) and put your image on the top of the post, just use this code instead of the previous one:

function featuredtoRSS($content) {
global $post;
if ( has_post_thumbnail( $post->ID ) ){
$content = '<div>' . get_the_post_thumbnail( $post->ID, 'thumbnail', array( 'style' => 'margin-bottom: 15px;' ) ) . '</div>' . $content;
}
return $content;
}

add_filter('the_excerpt_rss', 'featuredtoRSS');
add_filter('the_content_feed', 'featuredtoRSS');

“I Did Everything Like You Said, But Feadburner Doesn’t Showing Featured Images!”

This hack is working (for WordPress 2.9 and later ) but not immediately, because Feedburner needs to update your changes first. You need to wait 24 hours or write a new post to force Feedburner to update your feed.

I hope that this WordPress hack was useful for you. Just leave a comment ff you have any questions about adding thumbnail images to your RSS feed and Feedburner.

About Alex Joy

I'm founder and editor of Webdesignzo, architect designer, web designer, graphic designer and SEO optimizer.

96 Responses to Show Featured Images in RSS Feed and Feedburner

  1. Techgyo says:

    That’d be very good for newletters. Does it work with feedburner. And I was also looking to embed share buttons on feeds, just like mashable feeds.

    • Alex Joy says:

      Yes, this hack works with WordPress RSS feed and Feedburner RSS feed. This hack can be used to embed social share buttons to feed, but the code will be a little bit different, I think that I will write a new tutorial about that =).

  2. Hello dear, i want to know how can i send first image to my blog feed subscribers. Here is my blog feed url http://www.TodaysBollywood.com/feed and here is feed url at feedburner http://feeds.feedburner.com/todaysbollywood Thanks

    • Alex Joy says:

      Mark your first images as “featured image” and do the hack from my post.

      • Thanks for reply alex, i have a question and that is. if you have seen the url
        feeds.feedburner.com/todaysbollywood
        you will notice that images are already there in my feedburner feed, but i dont know what may be the reason those images are not being send to subscribed users.
        So if you can open the url
        feedburner.google.com/fb/a/mailverify?uri=TodaysBollywood
        and subscribe yourself for few day then you will see that images are not coming in mails. can you tell me the reason for this?.

        Thanks

  3. It would be nice if you could give us a way to add a link to the article around the image in the RSS feed?

  4. Sonia@7spice says:

    Hi Alex, I inspired from yout tutorial and tried your above code replacing ‘full’ image in the place of thumbnails. But somehow it didn’t work out. Instead it shows only post title in feeds. Could you please tell me why? I have removed the code right now and kindly awaiting for your reply. I really want to get this. Your any kind help will really be appreciated! Thanks.

    • Alex Joy says:

      You must wait 24 hours to let feedburner to refresh your feed (you can try to post new article to force feedburner to refresh your feed)

      • Sonia@7spice says:

        Yes, I did it along with I published my new post at the same time. Let me try again with testing post. Will let you know my result.

        • Sonia@7spice says:

          Alex, it didn’t work out for me yet! It’s been more than 24 hours but don’t see any result. I’ve placed the follo code in my php file. I like to show full image so adjusted as well.

          function featuredtoRSS($content) {
          global $post;
          if ( has_post_full( $post-&gt;ID ) ){
          $content = '' . get_the_post_full( $post-&gt;ID, 'full', array( 'style' =&gt; 'margin-bottom: 15px;' ) ) . '' . $content;
          }
          return $content;
          }
          add_filter('the_excerpt_rss', 'featuredtoRSS');
          add_filter('the_content_feed', 'featuredtoRSS');

          Any error in above code? Your help will be really appreciated! Thanks so much.

  5. Sonia@7spice says:

    I’ve sent you off my email with attachment.

  6. Jimmy says:

    Excellent, now Featured Images show up in your feed!

    Now, on the flip side, can you show us a way to retrieve that image when displaying an RSS feed on my WP site?

    Seriously, the whole image getting thing from RSS feeds isn’t even on popular plugin marketplaces like Codecanyon. The only WP plugins and tutorials I’ve found do it by the use of Enclosures and no one uses that or in most cases have even heard of that.

    Thanks Alex

  7. snake says:

    thanks for this hack, i tried but don’t work after 36 hours. i sent you my functions.php file, please help me.

  8. snake says:

    hi, i added the new code but I think something is wrong , please visit my feed I would greatly appreciate your help

    • Alex Joy says:

      something wrong with your feed. Does “SmartFeed” is activated at Feedburner option page? (Optimize tab). “BrowserFriendly” must be activated too

  9. snake says:

    sorry, i removed the code, but i send you an imagen capture of my feed

    image

  10. azza says:

    Hi. I added the code in functions.php but i got this problem : The URL you entered does not appear to be a valid feed. We encountered the following problem: Error on line 33: XML document structures must start and end within the same entity. and this is from feed verficator : http://feedvalidator.org/check.cgi?url=http%3a%2f%2ffeeds.feedburner.com%2fsidibouzidnews (line 33, column 171: XML parsing error: :34:0: unclosed CDATA section [help]

    … nctions.php on line 820
    ^
    In addition, interoperability with the widest range of feed readers could be improved by implementing the following recommendation.

    line 13, column 100: Self reference doesn’t match document location [help]

    … rel=”self” type=”application/rss+xml” />)
    what should i do i really want a thumbnail in my feeds.. help plz

    • Alex Joy says:

      I’m really don’t know why it’s not working. This hack 100% compatible with Twenty Ten theme and all Twenty Ten based child themes (my blog is build on modified and redesigned Twenty Ten theme and it’s working). The problem can be in your theme (template), the problem can be in your RSS feed, or you have incorrectly insert this hack to your functions.php file. You can send me your functions.php file and I can check it, but I can not guarantee you that it will work (send it to my mail – mociiadmin(at)gmail(dot)com )

    • Alex Joy says:

      What version of WordPress are you using? WordPress Thumbnails are working on 2.9 +, and it mast be activated.
      Do you use any RSS plugins on your blog? (you rss code looks different, this can be the problem).

  11. snake says:

    My Feed:

    This page contains the following errors:

    error on line 2 at column 6: XML declaration allowed only at the start of the document
    Below is a rendering of the page up to the first error.

    I’m very sad because I can not make it work

  12. azza says:

    I’m using WordPress 3.1.2. I dont have rss plugin just options from the theme to set the feedburner id.
    Maybe beacause I have another file of functions by the theme : spider-functions.php ?
    really no clue?

  13. hi
    i m using 3.1.2 version. i added code function files 36 housr ago but not seen. “SmartFeed” and “BrowserFriendly” is active. my rss adress is http://feeds.feedburner.com/turuncumikser . i send your mociiadmin(at)gmail(dot)com mail my function file. can you help me?

  14. oh I just tried adding that code and it frightened me to death as it all went haywire. Then I removed it and my site was still haywire… Oh what an awful feeling you get when that happens eh?
    All I did was copy the code as you said and added it at the very end of my funtions php file… did I miss something????

  15. snake says:

    Thanks Alex, i was disable tu summary of feedburner and it worked without problems. Apparently that was the problem . Good luck dude

  16. tess says:

    Hi Alex,
    This plugin is great and worked a treat – thankyou!
    can you advise me how I get the image separate to the text.
    I am running the feed into the home page of the new site I am building and I want to format it so the image is in a separate to the text .
    Thankyou!!
    Kind regards
    Tess

  17. Jim says:

    Great tip Alex. I implemented the code and it works fine on the WordPress built-in feed. However, I have a separate full text feed for members that is located in the theme’s directory. Is there a way to change the code so it will show the image as well?

    Thanks

    Jim

  18. I have configured it as instructed and am using 3.0.4 on my site. If I check the link http://photoinsomnia.com/feed I can see the images but not via http://feeds.feedburner.com/PhotoInsomnia.

    I have SmartFeed and BrowserFriendly activated. Any ideas on what could be blocking issue?
    Thanks in advance

  19. Barb says:

    Thanks for this tutorial, very helpful. So far my feed is only showing the first post with the featured image. I did add featured images to a few other posts but they won’t show up.

  20. Sue Surdam says:

    Is it possible to control the length of the excerpt? The default WP excerpt length is 55 words, but only 40 some words are showing. I use Feedburner as my RSS service.

  21. Sue Surdam says:

    Another question is there a way to show the featured thumbnail with the all the text from the post?

  22. Uday Vaswani says:

    Thanks for the article. It was amazing. Was useful. I surely shall try and implement it !!!

  23. Oltreverso says:

    Thanks Alex! W!

  24. RaBoLo says:

    hello,
    I am what you write but I can not get
    function. I am using version 3.2.1 with the theme WP headliner
    (I tested also with TwentyTen).
    Could you help me?
    thank you

  25. Benjo says:

    alex, you saved my ass tonight with this hack.

  26. Is there any way a widget or wordpress plugin can accomplish adding images to the feed?

  27. Matt says:

    Hi there, thanks for putting this tutorial up.

    When I add the code to my functions.php file, I get this error…

    Parse error: syntax error, unexpected T_STRING in /home/hardcand/public_html/wp-content/themes/shoutbox/functions.php

    What could it be?

  28. nikbanks says:

    I would like to code my rss feed from my website http://www.thesinglegirlsguidetomen.com with an image and excerpt on the homepage of my new website http://thesinglegirlsguide.net will this hack work in displaying the rss feed and the excerpt and is there anyway i can display the rss feed with images on the new site? i can’t find the code anywhere.

  29. anthony says:

    i used the code and got error
    Parse error: syntax error, unexpected T_STRING in /home/late/public_html/wp-content/themes/brightbox/functions.php on line 110
    any help?

  30. adumpaul says:

    Great article.Its really useful.Thank you for sharing.

  31. Shelley says:

    OMG! I did this an now my site won’t even show up don’t know how to fix it. Please help

  32. Doug says:

    Great fix Alex!

    Quick question about if we want a ‘full’ size image instead of ‘thumbnail’…

    Do we need to change ‘get_the_post_thumbnail’ to ‘get_the_post_full’ as well?
    Or we only need to change the thumbnail’ in ‘…( $post->ID, ‘thumbnail’,…’ ?

    Hope that makes sense :)

    Thanks!!

    • Alex Joy says:

      You only need to change the “thumbnail” in …( $post->ID, ‘thumbnail’ to ‘full’

      • Doug says:

        Thanks Alex! One more question: the images are showing up totally awesome now, but the text has been compressed to only a small line / excerpt. Is there a quick fix in the code to show the full post text?

        Thank you!!

        • Alex Joy says:

          try to change: settings – reading – For each article in a feed, show – full text

          • Doug says:

            Hmm, yea it’s already in ‘full text’ mode…

          • Doug says:

            Alex I think I resolved it. It’s actually a Firefox-specific issue as the RSS feed appears fine in Safari and Chrome (in full post form).

            Thanks so much for your help, I really appreciate!!

  33. Jorge says:

    hi, if i paste this code at the very end (after ?> ) it will just mess up my rss and show a string of numbers and crazy stuff from the rss output and add it to the header of my web! nasty. If i paste it before it, the rss appears ok but no thumbnail, it just adds this to the end of rss on every post: MEDIA ENCLOSURE: http://bufonismo.com/wp-content/uploads/2011/11/discursospoliticos-150×150.jpg

  34. This worked great! Tucking this away in my list of tricks… Going to do this on all of my wordpress blog Feeds. Thank you!!

  35. Hi Alex,
    I just put the code above on my theme function php. (there was nothing else that said functions php.) and my site went completely white. I called blue host and they fixed it saying that there was a t string error caused by the add filter part of the code. They restored the site for me, but I’d still love to get this function working with my email subscriptions. (have seen this feature from other emails I receive and it’s great!).

    Is there another place the code should be placed? Like I said, I couldn’t find anything else that said functions php. except for under the title ‘theme functions’. Is there an alteration to the code that might work? I’m using wordpress.org, by the way.

    Thanks,

    Nancy P.

  36. Ralf says:

    Hi Alex,
    great work, but I can’t get it to work. When updating the functions.php in the last line, the code is rendered then on top of every WP-page. What am I missing?

    Thanks in advance for your support and have a great 2nd Advent :-)

    Ralf.

  37. Jade says:

    Something went wrong on my dashboard. I’m using WP 3.3 and Theme Solo Theme Clear 2.0. I got this error after adding the codes you’ve given:

    Warning: Cannot modify header information – headers already sent by (output started at /home/gadjade/public_html/wp-content/themes/wp-clear/functions.php:221) in /home/gadjade/public_html/wp-content/plugins/wordpress-mobile-pack/plugins/wpmp_switcher/wpmp__switcher.php on line 506

    Warning: Cannot modify header information – headers already sent by (output started at /home/gadjade/public_html/wp-content/themes/wp-clear/functions.php:221) in /home/gadjade/public_html/wp-admin/theme-editor.php on line 103

    I already removed the codes but these error message keeps appearing. Please help.

  38. VulgarBulgar says:

    Just a tip – to speed up the Feedburner ‘burning’ process, go here. This will force Feedburner to ping your current feed source.

  39. Eyal Oren says:

    Thanks for this. Works great except for two issues.

    I added the code in my theme’s function.php file but now find that when I try to access W3 Total Cache’s ‘clear all caches’ dropdown from the top bar in dashboard view, I get an error message that looks like the code I input. I also see that code in the beginning section of the WordPress Blog and Incoming Links on my Dashboard.

    Also, since setting the Feature Image, I find I have duplicate images in my blog posts and blog page as well as when browsing tags and categories. Any idea how to fix this? I posted in my theme’s support forum as well as it may be a specific question for that theme (I use Dandelion by Pexeto).

    Thanks
    E

  40. cha says:

    Hello I used the codes but it is not working as suggested. I have activated browserfriendly and smartfeed. I also added the codes. I am using a thesis theme. Can you help me figure out what is wrong?

    this is the link to my feeds
    http://feeds.feedburner.com/FamilyOnTheMove

  41. Tom says:

    Hi,

    Thanks for the post, I think I’m nearly there now! The only question I have is how do I get my feedburner feed to just show the Featured Image? At the moment if I choose ‘full HTML’ it shows the Featured Image followed by all of the images in the post, and if I choose ‘plain text’ it doesn’t show any images at all? All I need is for it to show the Featured Image followed by the title and excerpt, a little like they have here -

    http://www.stamplondon.com/

    Thanks again!

  42. Hi, how do we add images from custom post types to the feed?

  43. LolDig says:

    Worked great with latest wordpress! I also changed ‘thumbnail’ image size into ‘medium’.
    To refresh the Feedburner, you simply need to make another post. Pinging works too like VulgarBulgar suggested.
    Thanks again for this, I really needed the featured image in the feed for my site.

  44. Peter Safwat says:

    is there any way to control image width and height?

  45. Oliver says:

    Thank you very much for the fix, works very well!

  46. Hich says:

    THank you for this hack, been struggling hard with WordPress, trying to install plugin that didin’t work…until I found your blog.You saved me with the little trick, however I have an issue and don’t find any solution:
    It looks like the images appear only on the latest posts but not for the previous ones.
    http://feeds.feedburner.com/FGMagazine
    All I need is to be able to display images into all my posts in order to build RSS to email newsletter.
    The best option in this case is to add the images of the other 3 posts to their main content so all of the posts have images added in tags for example in order to create an RSS email template.
    Would be great if you could help me on this!

  47. samueljesse says:

    Thanks, saved me a lot of time!

  48. James says:

    This float: left styling isn’t working for me. Any ideas why?

  49. Mary says:

    Hi Alex,
    Ever so happy to find this. It works like a charm in Firefox– displaying only the featured image and an excerpt of the post. Unfortunately, in IE8 the entire post shows up as well as every other picture I have in the post. Can you help?
    Thanks!

  50. Mark says:

    This worked great but one question: Also included in my feed item is the title of my blog with a link to it (right about the text summary and image). Is there a way to remove that?

  51. Toufiq says:

    Can you give me some information how i give design to my feedburner subscription box!

  52. Does this still work with WordPress 3.3.1.? Also, I understand to copy and paste the code but do I have to create a custom field called Featured? Right now I have two Custom fields I use in each post called Image and Thumbnail. (Sorry if that is a dumb question.)

  53. Marcus says:

    Got anything for wordpress 2.7? Great site and thanks!

  54. Dan says:

    this seems great, thanks.

    i hope it works after 24 hours.

    also, you seem to have some overflow on your rssfeed, what’s the best way to counter that?

  55. Dan says:

    Yes, this worked great. Thank you so much.

    I have the twentyten theme, and encountered no problems.

  56. George says:

    Hi,
    I want the FIRST image of every post to be displayed in the rss feed and also in the feedburner newsletter. I have installed a plugin called “RSS Image Feed” on my WP site that is supposed to do just that. The problem is that is works on the rss feed, but not in the feedburner newsletter, in the newsletter, it dispalyes ALL images in the post, not just the firsts one. Do you know how I can make the first image of every post to appear on both the rss feed and the feedburner newsletter as well?

  57. megafreetv says:

    Thank you for this tips.
    Does this method increase the reactivity of your readers ?

  58. Julia says:

    works great! thank you!

  59. Jay says:

    may i know why my uni blog powerby wordpress when i log in i can see the image in rss, but when i log out cant see ady..do you know why?
    (before that cant see at all, i got modify the function.php file, so now admin, can see..when log out and i press f5 at the rss page, the pic gone ><) weird

  60. Chris says:

    I tried do this with our RSS feed – claimkit.com/feed – but it did not work. The code was just added as a header at the top of our blog page. Thoughts?

  61. Clint says:

    Worked really well for us. Thank you.

  62. ethan kaplan says:

    Hi Alex. It worked great.
    Is there a way to show an default image in RSS feed, if the post has no featured image ?

  63. cgvector says:

    i have add this code in my blog http://www.cgvector.com but it’s not working.. please tell me where should i paste this code in function.php file…thanks in advance.

Leave a Reply

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

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>