Dont Tell Comedy – Dynamic Email Campaign

June 2021 - August 2021
Goals
  • Create HTML emails that work on popular email clients
  • Account for dynamic data that is fed through Django

Project Overview

Don’t Tell Comedy needed multiple custom emails for their customers. My job was to code and test them, mainly for Gmail and IOS mail client. I haven’t touched HTML emails in a while, but I thought I’d take on the job since I had good experience with Foundation for Emails/Inky. Using that, I was able to deliver the emails in a decent time frame.

Process

The Inky framework uses a build process that converts special markup to the table layouts that are needed for most email clients. This lets me build layouts that would normally take hours and hours of tedious formatting in much less time. As far as the styles go, those are very straightforward, though my styling choices were limited.

Once the emails were built out, the outputted HTML was made into a Django template where data was looped through. Overall, the process was simple it just required tweaks and testing throughout the process.

Technologies Used

HTML emails don’t support much, so basic CSS and HTML was all that was needed. Inky allows for SCSS, so I did utilize it.

Want to check out some code demos?

Check out code samples written in JavaScript, React, Node, and more

Demo 1
Converting jQuery Blog Post Component To Vanilla JS

I have a simple blog component that is written in jQuery. I would like to convert it to plain JavaScript as part of my effort to completely remove jQuery from my portfolio website. Here’s what the code does in order. init() on .header-info click, call the toggle method. Get the initial textbox height and store […]

Demo 2
Converting jQuery Navbar Code to Vanilla JavaScript

I am on a journey to completely replace jQuery on my portfolio site. The first step is updating the 10 or so JavaScript files that still rely on it. Why not start with one of the easier ones, the navbar? As you can see, the code is pretty straightforward. On init, add event listeners to […]

Demo 3
Defining Reusable Column Extends with SCSS

Quick Note: The atSmall type mixins are just basic media queries. Since these kinds of layouts are common, they also need to be overwritable if I want to change the spacing. Generally, the ‘default’ spacing is defined in the extend/mixins. Example Use Cases To get the layout working, you only need a container class and […]

View all 5 code samples