How to set a countdown timer in your template

Set a limited offer to motivate customers to make an earlier purchase or other activity by putting a countdown timer in your newsletter.

Marek Szwed avatar
Written by Marek Szwed
Updated over a week ago

You can add a countdown timer to your email template in our editor to let your contacts know how long is the promotion or special offer valid. There are many tools that allow this feature, such as www.sendtric.com.

How to create a countdown timer

Create a countdown timer at www.sendtric.com - fill in the required parameters such as email, time zone, When does your timer end (Date&Time) and design. Then generate the HTML code.

Copy the generated HTML code. It looks similar to this:

<img src="http://gen.sendtric.com/countdown/7mepw9i3zs" style="display: block;" />

Insert it either via the source code of the text field (Source on the toolbar) or via an HTML block.

How to insert a countdown timer into your template

Text field

Insert a new text field into your template. Then select the source code option in the top menu.

In the source code, you can see an HTML preview of your text field. Delete all the contents and insert the copied HTML code of your countdown timer. Then click on save.

Now the countdown timer has been correctly inserted into your template.

To edit the margin or positioning of your countdown, you can use CSS styles for the timer. We recommend setting the maximum-width attribute of the countdown timer to optimize its display for both mobile and desktop. Without this setting, it will display at its original size and it might not display correctly on a mobile phone.

You can also align the countdown timer to the centre.

Custom code can look like this:

<p><img src="http://gen.sendtric.com/countdown/exl8xiw2aj" style="max-width: 300px; width: 100%; display: block;  margin-left: auto; margin-right: auto;" /></p>

HTML Block

You can also insert the countdown timer by using HTML block. Just drag and drop the HTML block into your template:

Then in the left menu, insert your copied HTML code like this:

And the countdown timer should be at the very top of your HTML block:

Did this answer your question?