Feature
Post

Category
General

Simple Image Styling With Feed Styler

Feed Styler Logo - Created by Brett Terpstra from Circle Six Design
Feed Styler logo courtesy of Brett Terpstra from Circle Six Design.

In this short tutorial, I will show you how easy it is to float an image in your feed. Here are the steps necessary to style images using Feed Styler. It should also be noted that Feed Styler is only for WordPress users. The following example assumes the user is not using the visual editor.

Let's write a post

The following post contains some sample paragraph text and is what the post would look like in a feed reader.

Sample Feed With Only Text

Let's add in an image

The following image is the same post with an image added. Again, this is how the post would look like in a feed reader unstyled.

Sample Feed With Text and an Image

Here is the code to add in the image. Please note that I gave the image a class name of right.

HTML:
  1. <p><img class="right" src='http://www.domain.com/wp-content/uploads/2007/02/baloons.jpg' alt='Balloons - iStockPhoto' /></p>

Let's add in the style to Feed Styler

Shown below is the code to enter into Feed Styler. A screenshot is also shown of the same code entered into the plugin.

CSS:
  1. img.right { float: right; margin-bottom: 5px; margin-left: 5px; border: 2px solid #000; }

Feed Styler Plugin with Code Entered

Re-save the post

Because WordPress caches its feed, it is necessary to force WordPress to re-cache the feed in order for the styles to be reflected. This step isn't necessary, but it allows you to have your feed styled right away. If this step is skipped, the feed will be styled after you publish your next post.

View the result

Feed With Text and Right-Aligned Image

Conclusion

I hope this post demonstrated how easy it is to style images in Feed Styler. Thanks for reading.

  1. TrackbackWeb2Life » Blog Archive » Feed StylerInternet Vibes » Blog Archive » WordPress Feed StylerFeed Styler Plugin | WordPress Plugins Database - WordPressPluginsDatabase.com

    Your words are your own, so be nice and helpful if you can. If this is the first time you're posting a comment, it might go into moderation. Don't worry, it's not lost, so there's no need to repost it! We accept clean XHTML in comments, but don't overdo it please.

"));