Convert Linked CSS File into Inline CSS for your HTML Email

When I about to create an email template for my friend’s email marketing campaign, I came up with free responsive email templates http://mashable.com/2013/11/08/email-responsive-design/. The problem with a linked to a file css like this code line, in its HTML file is that – it will not copy what’s inside in email.css, and it wrecked the aesthetics of your template.

So that fastest thing to do are follows:
Step 1. Open Google Chrome (I don’t use mozilla to avoid extra inaccurate codes)
Step 2. Copy all website content using ctrl+c (Windows_ or ctrl+a (Mac) inline css
On my case, I just minimize the browser’s width or viewport at 600px to compatibility reason or email client

Step 3. Paste it using gmail web email, outlook, or mail app.
Step 4. Send it to dummy email for a test
Step 5. Edit your email template if anything goes wrong and if you’re sure on how does it look,
send it to your recipient.

Inline CSS Tricks for Email Template

Email clients doesn’t recognize external CSS or JS links. By doing it manually will eat your time, by just a simple copy and paste like word document will work. Enjoy!

Elvin is one of the contributors of mylabplus.com. He has been creating Wordpress Plugins, Magento Extensions, & Mobile Applications. If you find this article useful, please Follow him on .
About Elvin D.