Makes designing emails easier.
CSS JavaScript Shell
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
sass Initial commit Aug 19, 2014
.gitignore
LICENSE
README.md Update README Aug 22, 2014
billing.haml Rename index.haml to billing.haml to prevent overriding Aug 20, 2014
gulpfile.js
index.html Initial commit Aug 19, 2014
install
package.json

README.md

email-boilerplate

Makes email design and development easier. Compile your SCSS, HAML, inline CSS, and easily test your email with Litmus.

Requirements

  • node
  • ruby

How to use it

First clone the repository or download as a ZIP archive.

git clone https://github.com/drewtempelmeyer/email-boilerplate.git

Then install all package dependencies

./install

Included are two example files based on the billing template from Mailgun Transactional Email Templates

  • index.html for your email layout
  • sass/main.scss for your SCSS stylesheet
  • billing.haml HAML example for creating HAML-based templates

If you only wish to compile SCSS, run gulp sass.

To only inline your CSS (and compile SCSS), you may run gulp inline.

If you wish to update your SCSS and inline the CSS into your HTML as you update your code: gulp watch.

Your generated CSS will be output to css/ and build/css/. The HTML file with inline styles will be output to build/filename.html.

Running your test with Litmus

Modify the litmusConfig variable in the gulpfile.js file with your credentials and desired testing clients. To get your testing clients, use the application code from https://account.litmus.com/clients.xml.

var litmusConfig = {
  username: 'you@example.com',
  password: 'password',
  url: 'https://account.litmus.com',
  applications: [
    'applemail6',
    'gmailnew',
    'ffgmailnew',
    'chromegmailnew',
    'iphone5',
  ]
};

NOTE: account should be replaced with your account subdomain.

After modifying the configuration, run gulp test. A test will be generated for each HTML file and sent to Litmus.