WordPress: Add featured image to RSS feed

I’m a firm believer in minimising the amount of plugins a WordPress site uses and instead making code changes to get what you need. This removes the overall bloat of a site and makes things far easier to manage. From time to time I come across useful plugins, but instead of using them I work out the quickest way to achieve the same goal by coding it myself (for example). Here’s a simple function I use to show a post’s featured image in the RSS feed (something WordPress does not do by default):

function featured_image_in_feed( $content ) {
    global $post;
    if( is_feed() ) {
        if ( has_post_thumbnail( $post->ID ) ){
            $output = get_the_post_thumbnail( $post->ID, 'medium', array( 'style' => 'float:right; margin:0 0 10px 10px;' ) );
            $content = $output . $content;
        }
    }
    return $content;
}
add_filter( 'the_content', 'featured_image_in_feed' );

Just paste that code into your theme’s functions.php file and you’re good to go. You can obviously modify the style attribute to have it display however you wish, as well as the image size (set to ‘medium’ in this example) – the options for this are: thumb, thumbnail, medium, large & post-thumbnail.

Tags: , , , , ,

37 Responses to “WordPress: Add featured image to RSS feed”

  1. Gary September 20, 2012 at 5:59 pm #

    Hi,
    Just used your snippet on a clients website. Worked a treat. Thank you.

  2. Javi October 13, 2012 at 12:24 pm #

    Hi,
    I did what you said in my wordpress blog and it did not work. There are lots of people looking for this feature and I do not want to install a plugin at all.

    I have two function files functions.php and theme-functions.php and I tried already in both.

    I am not seeing the images in your feed neither… Hope you can enlighten me

    Thanks

    • Hugh Lashbrooke October 24, 2012 at 8:08 am #

      Hi Javi,

      The code itself should work fine if you paste it into your theme’s functions.php file in the root folder for the theme. If it’s not working for you then make sure you are setting your featured image correctly (using the WP featured image and not your theme’s custom image setting).

      Since changing some things on my site I have removed the images from my feed – I’ll put them back sometime, but for now you won’t see them there.

      Hugh

  3. AR May 8, 2013 at 1:40 am #

    I have been trying to give an image to RSS I include on my WP blog. However, it always results in failure. your recent writing I am reading now works well, unfortunately I am not so familiar with coding or something similar. could you please provide me with something simpler instead?

    • Hugh Lashbrooke May 8, 2013 at 7:24 am #

      I have tested this code again in the latest version of WordPress and it works correctly as it is now – I can’t really provide you with anything simpler as this is about as simple as you can get for this kind of thing.

  4. Victor Lava May 8, 2013 at 5:04 pm #

    Worked like a charm. Thanks for a code share! :)

  5. Camp Trend May 23, 2013 at 7:08 pm #

    Thanks so much, works perfect!!

  6. Nghia May 31, 2013 at 4:47 pm #

    I pasted the code into my function.php but when i view my RSS source, i dont see any images to my items. I’m using the WP featured image function of WP (running latest version); What am i doing wrong?

  7. Pratish June 24, 2013 at 3:42 pm #

    Thanks for this Hugh – needed it for a cartoon blog I am running and relieved at the thought of not having to add in another plugin! I’m curious to know if there is any way of overlaying some message on the thumbnail in the feed (e.g. click on cartoon to view full image on the site) – or even if I could insert the message under the featured image in the feed itself it would be great… any suggestions please?

    Thanks again!

    • Hugh Lashbrooke June 24, 2013 at 5:32 pm #

      Hi Pratish – the $output variable merely contains the HTML of the tag, so all you would need to do is add more text/HTML onto the beginning or end of that variable and it will show up as you have defined it. You have the global $post variable available so you can use that to display any dynamic post data you want at this point.

      • Pratish July 19, 2013 at 8:46 am #

        Thanks for the reply Hugh – sorry, I’m bit of a newbie so need a bit more help on this please. I’ve also been trying to get the thumbnail in the RSS feed to link to the actual post (so RSS readers can click on the image to see the full cartoon on the website). I’m honestly not sure how to tailor these two lines to include the “a href” to achieve this:


        $output = get_the_post_thumbnail( $post->ID, 'medium', array( 'style' => 'float:right; margin:0 10px 10px 0;' ) );
        $content = $output . $content;

        • Hugh Lashbrooke July 19, 2013 at 10:21 am #

          Hi Pratish,

          You could modify that code to look something like the code at this link: http://pastebin.com/raw.php?i=LGQFYXks

          I haven’t tested that code specifically, but it should wrap the image in a link to the post.

          • Pratish July 19, 2013 at 7:06 pm #

            Thanks for the Hugh – I tried it out and it crashed my feed… managed to fix it though :). The working code, including the link to the post from the thumbnail should read:


            $output = get_the_post_thumbnail( $post->ID, 'medium', array( 'style' => 'float:left; margin:0 10px 10px 0;' ) );
            $output = 'ID ) . '">' . $output . '';
            $content = $output . $content;

          • Pratish July 19, 2013 at 7:08 pm #

            Oops sorry I thought using the code tags would allow me to write the href too – I can send you the code if you’d like to update it. Basically the rel=”nofollow” bit in your pastebin thing was in the wrong place so it didn’t work.

            • Hugh Lashbrooke July 19, 2013 at 7:11 pm #

              Not sure how that rel=”nofollow” bit got in there – wasn’t supposed to be. Glad you got things working!

            • Jose March 24, 2014 at 10:19 pm #

              Pratish, Hugh,

              Thanks for sharing the solution… was thinking of how to link the image itself. Though not sure if I got it right: http://d.pr/n/2idb

              Appreciate your look at it…

  8. Lanaya | Raising Reagan July 18, 2013 at 4:16 pm #

    Hi Hugh …

    I’ve added the code to my php and it still doesn’t work. I have added all kinds of suggestions to the code, yours had a slight variation that I was hoping would fix the problem. I am SO baffled because I can’t think of anything else to do.
    I don’t know if it’s something in my overall Feedburner that isn’t picking it up?

    I would really love your expertise. I can send you anything you need to look at it.

    Thank you so much.
    Lanaya
    http://raising-reagan.com

    • Reid July 19, 2013 at 6:58 pm #

      Is there a logical progression from this snippet that would put the featured image in its own tag in the RSS feed (outside of the content). It would be nice to lead with the featured image, then display the title, date, then content.

      Any thoughts?

      I understand it would require editing the feed-rss2.php file in some way right?

      • Hugh Lashbrooke July 19, 2013 at 7:42 pm #

        To get the image above the content all you’ll need to do is remove the CSS from this snippet, so just remove this code: “, array( ‘style’ => ‘float:right; margin:0 0 10px 10px;’ )”. If you’re using the image as a header image then you may also want to change the size from ‘medium’ to ‘large’ (or any other custom size defined by your theme/plugins). That won’t get it above the title and date though – you’re right in thinking that you will have to modify the RSS template for that.

    • Hugh Lashbrooke July 19, 2013 at 7:11 pm #

      If you’re using Feedburner then the issue most likely that Feedburner is caching your feed and it will only refresh the new content at some point in the future. Other than that there’s no reason why this snippet wouldn’t work.

  9. George July 27, 2013 at 8:54 pm #

    Thanks for sharing this! I have an odd related question: would it be possible to add code that includes the URL to the featured image, but doesn’t display it on the visible feed item?

    I am looking to pull the Featured Image URL from each of my posts via the RSS feed, and display that image — hyperlinked to the related post — on a separate website. Basically I want to display thumbnails for current posts from the blog on the sidebar of my art portfolio (the art portfolio site is not a WP site, it’s a hand-coded site).

    Since my posts already have the same image used for the Featured Image inserted into the body of the post, adding your code results in posts with the image included twice. Is there a way to include the Featured Image URL “behind the scenes”, so it is included in the RSS XML code, but not displayed to the viewer?

  10. Nimrod August 11, 2013 at 2:42 pm #

    This is a very handy snippet! ..But I’m using a purchased theme so I prefer to use it as a plugin to avoid having to keep track of which files I have to check after an update of the theme. I also used to hard code changes directly into my theme files but I find it very messy when I have to update to the latest versions..

  11. Kenin Bassart August 21, 2013 at 8:20 pm #

    Hi, I had a quick question for you. I am trying to implement this solution to include the featured image in the post when there is only a snippet of the feed being used. When I view the full post in the feed my images render fine, but I would like the snippet feed to show a picture first, then the first few lines of text. Is this possible?

    • Hugh Lashbrooke October 11, 2013 at 1:20 pm #

      You should be able to achieve this by replacing ‘the_content’ with ‘the_excerpt’ in the add_filter() call, but I haven’t tested that to be sure.

  12. mywebprogrammer.com October 11, 2013 at 1:08 pm #

    Good plugin but doesn’t enable you to style the featured image in your RSS feed. Can’t change the size of the featured image.

    • Hugh Lashbrooke October 11, 2013 at 1:19 pm #

      Well this isn’t really a plugin – it’s just a code snippet that you should edit yourself to suit your needs. You should never just copy and paste other people’s code snippets without seeing if you can customise it for your use case. Besides, you’re wrong about not being able to style the image – you can use any CSS you like in the ‘style’ parameter inside the get_the_post_thumbnail() function to do this.

      • Trude November 12, 2013 at 10:37 pm #

        Hi, and thanks for a great explanation about rss feeds and images. You say one should add the code in the theme’s functions.php file. I have never done this kind of code editing before but I have read that one should do changes in the child theme. Is this correct?

  13. Melody March 10, 2014 at 7:55 pm #

    I’ve input the code into my Child Theme Functions.php and I still can’t get the images to pull in my RSS feed. Any other suggestions?

  14. Gerald@wpcustoms March 19, 2014 at 6:32 pm #

    Have you tried using the_content_feed instead of the_content as the filter?

    • Hugh Lashbrooke March 20, 2014 at 10:06 am #

      That would actually be a great improvement to this – I wrote this snippet some time ago and I think it definitely needs an upgrade. I’ll implement that sometime soon :)

Trackbacks/Pingbacks

  1. 8 Things Every WordPress Developer Should Know | Tips - June 4, 2013

    [...] Source: WordPress: Add featured image to RSS feed/ [...]

  2. 8 Universal Tips & Snippets for Wordpress Developers | Design Web Kit - July 1, 2013

    [...] Source: Hugh Lashbrooke [...]

  3. 8 Wordpress Tricks A Developer Must Know | Create Website in Minutes - July 11, 2013

    [...] Source: WordPress: Add featured image to RSS feed/ [...]

  4. Must Know Before becoming a WordPress Developer (8 things) | MKB4 posts - July 28, 2013

    [...] Source: WordPress: Add featured image to RSS feed/ [...]

  5. 8 Things Every WordPress Developer Should Know - February 27, 2014

    […] Source: WordPress: Add featured image to RSS feed/ […]

Leave a Reply

css.php
Post
Comments