Mailchimp Custom CSS

Often Mailchimp strips out the plugin's raw feed CSS, and requires CSS of it's own to affect the images it's adding to the template.

Here is example CSS to add to the body of the template HTML:

.mc-rss-item-img {
	width: 600px;
 	max-width: 100%;
 	margin-bottom: 35px;

Change the CSS size, width, and margins as you like.

The template's CSS class or ID may need to be modified as needed based on the template element you're adding the CSS to.

There's also an email client CSS guide that might be helpful:

For precise control, often the solution is to use the Premium option of Media tags and then style the image separately from the description image that is prepended, so you can have images separated out from the content, but that requires custom CSS as well. With premium support we can help create the custom CSS needed once we see the HTML the service is generating.

Q: I want my newsletter emails to display each post with a featured image and "read more" below it. How can I set this up? 

A: In WordPress, be sure the Settings > Reading option for RSS is set to Summary. Your feed should then output just the summary with a Read More link. That's separate from what our plugin does. The Read More could also be added within the Mailchimp template itself, as a link back to the post's URL using *|FEEDITEM:URL|*. I think this is usually included in the default RSS templates.

Perhaps review this good Mailchimp RSS campaign tutorial post:

Our plugin should prepend the featured image to the RSS feed summary, and basically if it's doing that, you're all set.

To refine the image further, resize or align it, requires custom CSS within Mailchimp. If you have the premium version of the plugin, we do include support with Mailchimp CSS and can even custom code CSS for you so it works as you desire.

Still need help? Contact Us Contact Us