Email Newsletter Adventure

I was recently tasked with building out an email newsletter. Honestly, I was dreading the task. Luckily, I did a bit of research before I started out on this adventure and found Foundation for Emails. It’s well documented and even has a CLI.

Getting started is as simple as npm install -g foundation-cli and then foundation new —framework emails. Once complete, you are ready to start coding an email using Inky, Foundation’s email templating language. Inky allows you to write <column> and <row> instead of writing out your emails in a table.

So basically, Inky turns this:

<container>
  <row>
    <columns>This is a column.</columns>
  </row>
</container>

Into this:

<table class="container">
  <tbody>
    <tr>
      <td>
        <table class="row">
          <tbody>
            <tr>
              <th class="small-12 large-12 columns first last">
                <table>
                  <tr>
                    <th>This is a column.</th>
                    <th class="expander"></th>
                  </tr>
                </table>
              </th>
            </tr>
          </tbody>
        </table>
      </td>
    </tr>
  </tbody>
</table>

As you can see, this makes things so much easier.

While in development, you run npm start to run the gulp tasks that watch and automatically update the browser. Once complete, use npm run build to inline all of your CSS into your HTML. Then npm run zip to zip the file to get it ready to submit to your email service provider of choice.

This saved me a lot of time and effort and for that I’d like to thank the guys over at Zurb! You should check it out when you get a chance!