Responsive featured images in RSS?

Hi Tevya,

You’d have to add the proper CSS to Mailchimp to size them using max-width: 100% or add padding, etc.

Here’s code that sets the width to be 100% that you could try:

<style type="text/css">..rss-content img {width:100% !important; margin-top: 10px !important; margin-bottom: 10px !important;
}</style>

I’ve used this code in the past to left align and add padding to thumbnail sized images in the Mailchimp template itself:

<style type="text/css">.rss-content img {
padding: 0px 10px 0px 0px; float: left;
}
</style>
<span style="font-size:12px">*|RSSITEMS:|*</span>
<h2 class="mc-toc-title">*|RSSITEM:TITLE|*</h2>
Posted on *|RSSITEM:DATE|*

<div class="rss-content">*|RSSITEM:CONTENT|*</div>

See if adding CSS to the Mailchimp template helps.

I’m going to try this, but it would sure be nice if there was a plugin that just inserted the image without dimensions or with responsive dimensions.

This is what worked for me:

<style type="text/css">.mcnTextContent img { max-width: 100% !important; }
</style>

Ah nice. It depends on the template being used on the Mailchimp side, glad you got it working.

Yeah, that’s what I figured. That one is for the new drag-n-drop, responsive, 1-column layout. May work on others, not sure.

Howdy Tevya,
If you are still following this thread, can you tell me which responsive mailchimp template you are using? I have looked and I cant tell which templates are responsive and which ones are not because mailchimp doesn’t seem to have them labeled.

I have a wordpress rss mailchimp email campaign that right now is not using a responsive email template.
Thanks, Mike

I’m just using the Basic 1-column layout. All the basic ones are responsive.

Tevya, this is really good info. I am having a similar problem with the basic 1 column mailchimp image. I would like to try your code. Where exactly do you put in the style type code in mailchimp?

@thomasmatty, just click the text area where your RSS info is (including the image). Then click the code button (looks like “<>”). Just insert that right at the top of the code for that section.

Beautiful solution thank you. And thank you for this plug in. Going to go rate it right now A+!

Gedday – the code suggested above worked beautifully in the designer, but it seems some email clients can’t handle it (gmail being one of them). Any suggestions??

Code:

<style type=”text/css”>.mcnTextContent img { max-width: 100% !important; }
</style>

(FYI – I’m actually using an older WP Images plugin as I don’t have authority to change site settings. Might this be my problem?)