forked from leemunroe/responsive-html-email-template
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
1 changed file
with
12 additions
and
12 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,38 +1,38 @@ | ||
# Really Simple Responsive HTML Email Template | ||
|
||
Sometimes all you want is a really simple responsive HTML email template. Here it is. | ||
Sometimes all you want is a really simple responsive HTML email template. Here it is. | ||
|
||
[See live preview](http://leemunroe.github.io/responsive-html-email-template/email.html). | ||
|
||
<img src="https://cloud.githubusercontent.com/assets/15963/26765586/c6484a96-4933-11e7-80e0-2f7509d24280.png" alt="Simple HTML Email" width="500"> | ||
|
||
|
||
## Sending emails using a marketing service like Campaign Monitor or Mailchimp? | ||
## Sending emails directly from your codebase or using a developer service? | ||
|
||
Use the template `email.html` as is. They'll put the CSS inline for you when you put together your campaign. | ||
For an API service (like Mailgun) **you need to inline the CSS before sending**. See `email-inlined.html` for an example. | ||
|
||
You can use CSS inliner tools like [Responsive CSS Inliner](https://htmlemail.io/inline/) or [Juice](https://github.com/Automattic/juice) to do this automatically. | ||
|
||
## Sending emails directly from your app or using a developer service? | ||
* Copy all of email.html | ||
* Paste the HTML as the source into the inliner | ||
* Copy the HTML output and use this as the email template you send | ||
|
||
For an API like [Mailgun](http://www.mailgun.com) **you need to inline the CSS before sending**. See `email-inlined.html` for an example. | ||
|
||
You can use inliner tools like [Responsive CSS Inliner](https://htmlemail.io/inline/) or [Juice](https://github.com/Automattic/juice) to do this automatically. | ||
## Sending emails using a marketing service like Mailchimp? | ||
|
||
* Copy all of email.html | ||
* Paste the HTML as the source into Putsmail | ||
* Copy the HTML results and use them in your email template | ||
Use the template `email.html` as is. They'll put the CSS inline for you when you put together your campaign. | ||
|
||
## Tried and tested on all major email clients | ||
|
||
Tested on mobile, desktop and web. | ||
Tested on mobile, desktop and web. | ||
|
||
![Templates Tested on Email Clients](https://cloud.githubusercontent.com/assets/15963/17391543/bc289abe-59cb-11e6-9946-605a85f8c522.jpg) | ||
|
||
|
||
[See the Litmus test results](https://litmus.com/checklist/emails/public/d432046). | ||
[See the Litmus test results](https://litmus.com/checklist/emails/public/cc3e30f). | ||
|
||
## More HTML email resources | ||
|
||
* [More Responsive HTML Email Templates](http://htmlemail.io) | ||
* [Things I've Learned About Building HTML Emails](http://www.leemunroe.com/building-html-email/) | ||
* [An Introduction To Building And Sending HTML Email For Web Developers](https://www.smashingmagazine.com/2017/01/introduction-building-sending-html-email-for-web-developers/) | ||
* [Grunt Email Design Workflow](https://github.com/leemunroe/grunt-email-design) |