Emogrifier

Emogrifier

n. e•mog•ri•fi•er [\ē-'mä-grƏ-,fī-Ər\] - a utility for changing completely the nature or appearance of HTML email, esp. in a particularly fantastic or bizarre manner

This utility was developed as part of Intervals to deal with the problems posed by certain email clients (namely Outlook 2007 and Google Gmail) when it comes to the way they handle styling contained in HTML emails. As many web developers and designers already know, certain email clients are notorious for their lack of CSS support. While attempts are being made to develop common email standards, implementation is still a ways off.

The primary problem with uncooperative email clients is that most tend to only regard inline CSS, discarding all <style> elements and links to stylesheets in <link> elements. Emogrifier solves this problem by converting CSS into HTML inline style attributes in your code.

How it Works

Emogrifier automagically transmogrifies your HTML by parsing your CSS and inserting your CSS definitions into tags within your HTML based on your CSS selectors. You can either use the form below to paste your HTML or CSS, or if you're more technically inclined, you can download the PHP source code from GitHub and use it in your own applications.

Enter Your Code

Caveats

  • NEW: Emogrifier will grab existing inline style attributes and will grab <style> blocks from your HTML but it will not grab CSS files referenced in <link> elements (the problem email clients are going to ignore these tags anyway, so why leave them in your HTML?).
  • Even with CSS inline styles, certain CSS properties are ignored by certain email clients. For more information, review documentation here.
  • All CSS attributes that apply to a node will be applied, even if they are redundant. For example, if you define a font attribute and a font-size attribute, both attributes will be applied to that node (in other words, the more specific attribute will not be combined into the more general attribute).
  • There's a good chance you might encounter problems if your HTML is not well formed and valid (DOMDocument might complain). If you get problems like this, consider running your HTML through Tidy before you pass it to Emogrifier.
  • Finally, Emogrifier only supports CSS1 level selectors and a few CSS2 level selectors (but not all of them). It does not support pseudo selectors (Emogrifier works by converting CSS selectors to XPath selectors, and pseudo selectors cannot be converted accurately).

Download Emogrifier by Intervals from GitHub

Build Status Latest Stable Version Total Downloads License

» Emogrifier GitHub Repo
» Emogrifier Releases

(NOTE: A web server running PHP 5 is required to run this utility. Your PHP installation must support the DOM extension.)
Emogrifier source code is distributed under the MIT License.

Not working for you?

If Emogrifier doesn't work for you, you might want to also try Premailer.

Emogrifier is available for these popular PHP frameworks: