Recently, we made several improvements to our email notifications, adding additional details, improving rendering, and more. Blake has mentioned it in a few of his weekly update videos, but today we wanted to walk you through it and add a few more details, with examples. Check it out!

Exceptionless Email Notification Implementation #

We decided to use Zurb's Foundation for Emails to help us create emails that look great on all email clients. The reason we went with Zurb is because it has clean markup that translates to good old (ugly) HTML that just works. It also works great with Handlebars.Net which we use to render the email content.

An example of one of our event notification emails can be found here.

Then, we run a Node.js build task to transform the templates into some pretty crazy html markup that works everywhere. The markup at that link contains the Handlebars.Net syntax.

These templates are stored as embedded resources so we can use them from any environment and render them out with ease! Here is a code example of how we perform that task.

We added JSON-LD support, to the emails to give us rich contextual actions, by starting with this Google Developer tutorial and ended up with the below implementation. It's worth noting that we had to go through their verification process for the actions to be enabled.

<script type="application/ld+json">
{
 "@context": "http://schema.org",
 "@type": "EmailMessage",
 "description": "\",
 "potentialAction": {
 "@type": "ViewAction",
 "target": "\/event/\",
 "url": "\/event/\",
 "name": "View Event Details"
 },
 "publisher": {
 "@type": "Organization",
 "name": "Exceptionless",
 "url": "https://exceptionless.com",
 "logo": "https://be.exceptionless.io/img/exceptionless-48.png"
 }
}
</script>

We tested the emails in Outlook for Windows and Mac, Paper Cut, Gmail on Safari, and Apple Mail. Then, we used Litmus to test a wide range of clients before publishing and pushing everything live.

Questions? Comments? #

We hope our build out here can help other developers, and we would love to hear your feedback, questions, or comments either here on the blog or over on GitHub!

Code on.