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:
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:
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.
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.
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 =).
That would be great if you could write about embedding buttons on feeds. There is no such tuts available online for doing that. I was in search of that for months. I;ve now subscribed to your feeds to make sure I get it when you post.
ok )
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
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
Everything is OK with your feed. I see all your images in my RSS reader and in my incoming e-mails.
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?
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.
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)
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.
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.
Any error in above code? Your help will be really appreciated! Thanks so much.
Can you send me your full functions.php file? Send it to my e-mail: mociiadmin[at]gmail[dot]com
I’ve sent you off my email with attachment.
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
thanks for this hack, i tried but don’t work after 36 hours. i sent you my functions.php file, please help me.
hi, i added the new code but I think something is wrong , please visit my feed I would greatly appreciate your help
something wrong with your feed. Does “SmartFeed” is activated at Feedburner option page? (Optimize tab). “BrowserFriendly” must be activated too
sorry, i removed the code, but i send you an imagen capture of my feed
image
Try to activate “SmartFeed” and “BrowserFriendly”
I have activated “SmartFeed” and “BrowserFriendly” =/
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
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 )
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).
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
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). You and Azza (from previous comment) have similar rss codes and errors.
The errors appears because of this line of code in your RSS feed:
some kind of rss module
i don’t have any rss plugin, I just redirected my feed to feedburner from .htaccess.
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?
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?
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????
it depends on the structure of your functions.php file (you can have different wordpress template). Can you show me few last lines of your functions.php file?
Hi Alex
Cheers
Many thanks I have sent you my functions php file in email
I am getting an error message at the top of the dashboard. Thanks for any assistance.
Thanks Alex, i was disable tu summary of feedburner and it worked without problems. Apparently that was the problem . Good luck dude
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
How exactly you want to separate your images from the text?
I want to put the image in a div on the left and the text in a separate div on the right with the title above it like this: http://www.surfindustries.com/test/blogFeed.jpg at the moment it is all under the title…
Just use the first code
yes i have but the image comes through as part of the itemDescription so it display like this: http://www.surfindustries.com/test/blogFeed.png
I was hoping to have the image in a side div separate to the title and description text.
Is this possible?
I appreciate your time.
Tess
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
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
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.
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.
Another question is there a way to show the featured thumbnail with the all the text from the post?
try to change: settings – reading – For each article in a feed, show – full text
Thanks for the article. It was amazing. Was useful. I surely shall try and implement it !!!
Thanks Alex! W!
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
sorry, I am using version 3.2.1 the WordPress MU.
Thank
alex, you saved my ass tonight with this hack.
Is there any way a widget or wordpress plugin can accomplish adding images to the feed?
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?
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.
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?
Great article.Its really useful.Thank you for sharing.
OMG! I did this an now my site won’t even show up don’t know how to fix it. Please help
looks like your site is fine
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!!
You only need to change the “thumbnail” in …( $post->ID, ‘thumbnail’ to ‘full’
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!!
try to change: settings – reading – For each article in a feed, show – full text
Hmm, yea it’s already in ‘full text’ mode…
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!!
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
This worked great! Tucking this away in my list of tricks… Going to do this on all of my wordpress blog Feeds. Thank you!!
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.
ok.. I had the same issue. But fixed it myself. I was unable to login to wp-admin and it was all white screen. Logged into my hosting server and searched for functions php file and I could see some extra space. removed all extra space or line and it could access everything and was back to normal and I could access my site howtotechguru.com
Author: Thanks for this info. I will wait for 24-48 hours so that my RSS feeds will have large images. Thanks a lot.
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.
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.
Just a tip – to speed up the Feedburner ‘burning’ process, go here. This will force Feedburner to ping your current feed source.
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
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
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!
Hi, how do we add images from custom post types to the feed?
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.
is there any way to control image width and height?
Thank you very much for the fix, works very well!
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!
Thanks, saved me a lot of time!
This float: left styling isn’t working for me. Any ideas why?
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!
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?
Can you give me some information how i give design to my feedburner subscription box!
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.)
Good..good..thx
Got anything for wordpress 2.7? Great site and thanks!
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?
Yes, this worked great. Thank you so much.
I have the twentyten theme, and encountered no problems.
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?
Thank you for this tips.
Does this method increase the reactivity of your readers ?
works great! thank you!
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
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?
Worked really well for us. Thank you.
Hi Alex. It worked great.
Is there a way to show an default image in RSS feed, if the post has no featured image ?
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.
Thank you, works fine.
What if i want to add this featured image, but at the bottom of tha page? Is that possible?
Thanks for this! For those having trouble, make sure you paste the code inside the block of your functions.php file.
Sorry, that should have read “scripts” block, but the tag was stripped out.
thanks Alex! it worked for me
It perfectly worked for me.. Thanks for providing a quick fix…
Hi there,
I just came across this post the other day, and posted the code into my functions.php file and it worked great, showing the featured image in my rss feed. However I am having a problem as I am using a rss driven campaign in mailchimp and for some reason it shows the image name before the text content in the email.
eg. “6c9b2578f8698069b53156ddcb6a4c26.jpg The weekend is almost here, so let’s get into it! Here’s five links to distract, amuse and entertain until the good times arrive..”
But when I take away this code it goes away? Is there anyway to still be able to use this code to show images in my rss feed and my rss mailchimp campaign at the same time?
Cheers
Hi Alex,
How can I do this in my Blogger feeds?
Hi, I just tried adding the code to my function.php file to the bottom. I immediately got a blank page. Now I can’t access my wordpress admin page anymore and the website is also just a blank page. Any ideas what went wrong or how to fix it?
Success! Thanks!