More and more brands are using countdown timers in their email design. Countdown timers are dynamic, attention-grabbing, and fun to use. Brands are integrating these timers to encourage subscribers to snag a last-minute deal, register for a workshop, watch an event, and more.In today’s workshop, we’ll be showing you how easy it is to add a countdown timer in your email messages. Our tools for this workshop will be the BEE editor, along with a simple, free-to-use online tool that will generate the HTML for our countdown email timer.Here’s our video recap:
Tools You’ll Need
Today, we’re going to use two tools to build our email with a dynamic countdown timer:
- We’ll be using the BEE email editor. If you’re not already using BEE, sign up for a free two-week trial of BEE Pro to gain access to additional templates and design features.
- Second, we’re going to use a tool called Sendtric that can create and generate the HTML for a countdown timer. Sendtric creates the countdown as an animated GIF so it will render in email.
Let's get started making our countdown email!
Step 1: Design the email in BEE
We’re going to recreate a countdown timer email that The Company Store recently sent its subscribers to announce the last chance for holiday shipping:
In BEE, we opened up a basic template andnow it’s time to start customizing the email design.To add content, we’ll:
- Drop in The Company Store logo
- Add text to the navigation menu
We’re also going to create an additional image block underneath to add the first part of the email. We’re in good shape so far! This is our progress:
Let’s make the timer and see how it looks in our header.
Step 2: Make the countdown timer with Sendtric
Over at Sendtric.com, creating our timer is pretty straightforward.First, we’ll enter our end date. Sendtric allows you to set the date up to a month out.Then, we’ll update the colors — here, all we need is a beige background and black numbers, and we're going to plug in the HTML color code from the background of the email (#f3f3f3) for an exact match.
After we press the Generate button, Sendtric gives us the HTML code and the timer is ready to use!
Step 3: Add the timer to your email
In Sendtric, copy only the link that's in the middle of the code.Back in the BEE editor, we added a new image block in the email and we're going to paste the code for our timer in the URL box for the image. Just like that, our timer is active in the email.
In Preview Mode, we can see how the width of the timer adjusts to fit a smaller screen. It looks great!
Additional tools for creating countdown timers
Anumber of online platforms offer easy-to-use countdown timers you can add to your email campaigns. Here's a quick list of additional options:
Using a countdown timer in email? Go Pro!
We hope you enjoy using BEE to jazz up your emails with some countdown timers. If you’re not already using BEE, sign up for a BEE Pro free trial to have access to even more email templates and design features!
