Update Campaign Monitor now moves styles inline for you automatically – you no longer need to run your HTML email campaigns through an inliner like Premailer prior to send. That’s good news!

Creating HTML emails that render well across multiple email clients is complicated by programs like Gmail that strip out CSS styles from the head, and only support inline styles (like <p style=’font-weight:bold;’>A bold paragraph<p>).

Our base templates don’t use inline styles because that makes them too inconvenient to easily modify – much simpler to change the design first then apply inline styles at the end.

Campaign Monitor customer Alex Dunae has done us all a big favor by writing a sweet Ruby script that accepts a URL, and automatically generates and applies inline styles from the CSS in the head of that page.

The script is called premailer and is available for use right now. It won’t always work (with complex CSS cascades), but for most cases it saves you a ton of time. So now you can just build the page in your normal way, then have all the inline style drudgery done for you automatically.

As an additional benefit, premailer also checks your CSS against our own guide to CSS support and warns you of possible issues. It’s a great piece of work, and well worth a look. Alex is even planning to release the source code soon.

 

  • Geoff

    Very cool — thanks! I’ve had to go inline for our mailings as well, and this should be a big help.

  • Darren Turpin

    Superb piece of work. Tested it on a couple of (very simply CSS’ed) client emails and it worked perfectly. Thank you, Alex!

  • Anonymous

    I tried, it doesn’t work with the 2col layout provided by mailbuild.

  • Diana Potter

    Very very cool! This will save me a good amount of time creating html emails. Thanks!

  • Mathew Patterson

    Regarding the MailBuild templates, it works in our testing with the 2 column with-content.html file, but the template file with tags inserted causes errors. The script can’t handle every situation, but should cut out a lot of time when you build your base template, and then add your tags at the end.

  • Russ Michaels

    I tested it on a couple of very simple html email signatures, didn’t work at all.

  • Kelly Rusk

    Fantastic idea, and looks like it will prove to be a life saver over here. Thanks!

  • Alex

    @Russ – the flurry of activity after this Campaign Monitor post has brought to light quite a few little bugs, most of which have been squashed. I tested this with my simple newsletter designs and it worked quite well. After checking through the error logs I’ve added some more logic (to deal with HTML comments within CSS files, MS Smart Tags, 301 redirects, etc…) and things are a bit better now.

    Thanks for trying it out.

    Alex

  • Chad Cross

    That is awesome. Thanks for the hard work Alex.

  • Colin

    Fantastic!! Been looking for this for a long time, thank you Alex!!

    PS: Please sell this script to Adobe/Dreamweaver so they can integrate it into the next version. (Or fingers crossed mail clients will get their act together and create some email standards before then.. lol right right)

  • Rules

    It works in our testing with the 2 column with-content.html file, but the template file with tags inserted causes errors. I tested this with my simple newsletter designs and it worked quite well.

Want to improve your email marketing? Subscribe to get tips on improving your email marketing delivered to your inbox.
X

Join 200,000 companies around the world that use Campaign Monitor to run email marketing campaigns that deliver results for their business.

Get started for free