• Skip to primary navigation
  • Skip to main content
  • Skip to footer
Amethyst Website Design logo

Amethyst Website Design

Affordable WordPress Website Design for Small Business

  • Home
  • About
  • Services
  • Praise
  • Portfolio
  • Blog
  • Contact »

WordPress Tutorials Images & Galleries, Themes

Blog Post Images in Email Sent With RSS Campaigns

May 13, 2014 Updated on December 2, 2020 Marcy Diaz

Share this post:

TwitterFacebookPinterestLinkedInEmail

Occasionally my blog post emails have a broken layout. It happened recently (April 22, 2014). You’ll notice in the screenshot below from Gmail that the email content extends past the header, the image is squashed, and there is a scroll bar because the content extends outside the window. This is not what we want.

blog post image in email from rss campaign

At first I thought that it was because I had changed templates in MailChimp, but the next week’s (April 29, 2014) blog post email stayed inside the Gmail window, even on mobile; mobile screenshot below.

blog image from rss campaign fits in email window

So what’s happening?

Well, in the first email above, the image was linked to the full size image, and it looks like I wasn’t careful selecting the post image size, so it was also full-size, over 900px wide. My posts usually use a custom post-image size of 680px width.

Because the CSS for images in my WordPress theme makes the image fit within the width of the blog post, I didn’t notice that I used the larger size.

img {
	height: auto;
	max-width: 100%;
	width: auto; /* IE8 */
}

This CSS to make images fit isn’t used in the email templates, because it just doesn’t work well in many email applications.

So what can you do?

When you create your own email campaign, you can resize all images to make sure they fit within the email. But it’s more difficult when you email your blog posts with an RSS feed or campaign because the RSS has whatever content you put in your blog posts, including large images.

The easiest fix is to use smaller blog post images, so that they fit in email, usually with widths less than 700px.

More Information and Another Solution

Chris Coyier of CSS-Tricks wrote a recent blog post about this issue. Chris says:

It’s not a problem isolated to FeedBurner. I switched to MailChimp for this service more recently. It’s not their “fault”, but huge images break their email layouts as well.

Chris also offers more information and a solution that involves creating a new RSS feed just for your email campaign.

Share this post:

TwitterFacebookPinterestLinkedInEmail

You can have a beautiful, hardworking website for your small business.

Tell me about your website project for a personalized solution!

Contact Marcy »

___

Do you need website tips?

Sign up to get easy-to-use WordPress tutorials, Genesis theme customizations, and other helpful tips for your small business website.

Your email address will be used to send you blog posts. Privacy Policy

___

About Marcy

Marcy Diaz

I'm Marcy Díaz, the owner of Amethyst Website Design, a small business located in Phoenix, Arizona (in Ahwatukee Foothills). I help people, like you, grow your business with an affordable WordPress website design. Sign up for my blog and website tips that help you manage your own website.

Reader Interactions

Leave a Reply Cancel reply

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

 

Footer

Meet Marcy

Marcy Diaz, Amethyst Website DesignAmethyst Website Design is a small business owned by Marcy Díaz. I help people, like you, with your website by creating an affordable WordPress website using Genesis themes to fit your business and budget. I especially love working with new and small business owners, and can help you with the online part of your business.
Read More »

Let’s Connect!

  • Facebook
  • Twitter
  • Pinterest
  • Linked In
  • GitHub

Contact Info

Amethyst Website Design
PO Box 94782
Phoenix AZ 85070

Phone: 602.759.0501
Email:

Contact Form
Located in Ahwatukee Foothills

member of local first az
  • Sitemap
  • Cookie Policy
  • Terms and Conditions
  • Privacy Policy

© 2021   Amethyst Website Design   ◆   Log in

Using WordPress and the Genesis Framework

This site uses cookies for the best browsing experience. By continuing to use this site, you accept our Cookie Policy »OK, got it!