Aligning Images In RSS Feeds

When inserting an image into a post, WordPress lets you choose an alignment (left/right/center/none) and even add a caption. This usually works well when viewing the post on the blog itself, but will often look messed-up in the RSS feed. Basically, the image becomes unaligned and breaks the intended post layout. I’ve found an easy way to fix it.

As it turns out, the problem appeared when WP developers chose to remove the deprecated “align” attribute from the WordPress-generated <img> tags. Now, following web standards is all well and good, but what if you still want to align an image in a way that works in the feed, too? The typical answer is to add a style="float:left;" (or “float:right;”) attribute to each aligned image. However, that would become very bothersome if you had to manually edit the HTML code every time.

So I created a plugin that will do it automatically.

Plugin Description

“Align RSS Images” is a simple plugin that scans your RSS feed and ensures that every image has the correct alignment and margin settings. Technically speaking, it finds HTML elements styled with any of the WordPress-generated classes and appends an appropriate style attribute to each element. This is done dynamically when the feed is generated, so your actual posts won’t be modified.

Left-aligned picture in a RSS feed

Sidenote : Yes, I know that using styles in a RSS feed isn’t exactly standards-compliant either. Nevertheless, it works fine with Google Reader and the W3C Feed Validator says the feed is OK. So most likely the sky won’t fall on your head if you use this plugin 😉

Download

align-rss-images.zip (2 KB)

Requirements : WordPress 2.6 or later
Installation : Just upload and activate. The plugin is completely automated, but due to caching you may need to wait a few hours for the changes to appear in your RSS reader.

Related posts :

102 Responses to “Aligning Images In RSS Feeds”

  1. Dank says:

    Brilliant. Just what I’ve been looking for!

  2. Thanks so much for this. I’ve been thinking about writing something myself to do this, but never got around to it 😛

  3. Ben M says:

    This works great! Thanks!

    You might consider adding span to the preg_replace_callback part of the ws_align_rss_images function. I spent some time banging my head against the wall wondering why div, img, and p tags would be filtered by the plugin, but not spans. Of course, I only have myself to blame for that because I didn’t scroll all the way to the bottom of the plugin file to realize that spans weren’t even being screened for filtering. I use a span tag for captions instead of a p tag, which was why I wanted span to be included.

  4. White Shadow says:

    Done (didn’t test it myself, but should work).

  5. […] C’è una soluzione rapida, semplice ed indolore che come potrete immaginare consiste nell’installazione di un semplice plugin: A lign images in RSS Feeds. […]

  6. It has no effect on my feed. I use: img class=”alignleftb”. Do I have to change anything inside the plugin code to make it work?

    Thomas

  7. White Shadow says:

    Are you sure it’s “alignleftb“? I didn’t see that class in any of the docs (only “alignleft”), so the plugin doesn’t recognize it.

    You could add this class to the $explicit_alignment_styles array to make it work. Take a look at the other CSS rules already listed in the code for an example of how to format the new entry, it’s pretty easy.

  8. Sergejpinka says:

    Well,

    this plugin WordPress 2.7 OK?

  9. White Shadow says:

    Yep, seems to work fine on this site (which is WP 2.7).

  10. […] images of your blog posts in RSS Feeds in the same way it appears on your blog. Then here is a plugin that would help you align images even in feed […]

  11. […] ø Aligning Images In RSS Feeds | W-Shadow.com ø Aligning Images In RSS Feeds with WordPress plugin […]

  12. This looks like a useful plugin. Is it not in the WordPress plugin browser? I looked for it there for easy installation, but I couldn’t find it.

    Also, is there a way to make aligned images take the action of just causing a break return after the image in a feed? So rather than align the image in the feed, just keep them with no alignment, but move the text that would mistakenly start adjacent to the right of the image start below it?

    Thanks.

  13. White Shadow says:

    Yes, it’s not in the official directory (I’m lazy 😉 ). I’ll add it eventually.

    You could edit the CSS rules that the plugin uses to achieve the result you want. I think adding “clear: both;” to each style defined in rss-image-align.php should work.

  14. baron says:

    hi. Thanks for plugin

    perfect.

    Regards

Leave a Reply