Skip to main content

Countdown Timer

Heather
  • Updated

Please note: 

** To unlock this capability, you will need to have added DynamicMail to your Optimove package. If you can’t see this feature in your Optimove instance, contact your CSM to find out more. **

The Countdown Timer is a component in DynamicMail which allows you to embed real-time countdown clocks towards a predetermined time in your emails. This allows you to create a sense of urgency around a deadline, an event, or a promotion increasing email engagement.  

 
 
If the email is opened, closed, and then re-opened, the timer will automatically update, showing the current time remaining until the timer's end.  To set up the Countdown Timer component please read the settings configuration below: 
 
Settings Configuration
  • Go to Create Component
  • Choose “Countdown Timer”.
  • Give your newly created component a unique name.
  • Fill out the rest of the details, including:
    • Responsiveness type:
      Choose "fluid" to stretch the component to fit the width of the screen, or "fixed" to maintain the specified width of the component in all devices.
    • The background source:
      The timer background can be an image or a color. 
      When using a background image, it is best to use only a cropped portion of a larger image to avoid creating a large gif file that may cause emails to render more slowly for your users. 
      We recommend using a background image (including text) no larger than 300x150 pixels to minimize the image file's size. 
    • The date format: (if you'd rather use a format that's not our default, click "Advanced")
      When the date format is set to "Advanced," the "Change text placement on image" button can be used to enable each time unit to be dragged into the preferred placement on the background image. Unit type, font size, and color can be changed by clicking on the relevant unit. 
    • Font color, font type, and font size:
    • The timer's expiry date and time, as well as time zone offset
      By default, the timer's time zone offset is based on your computer's time zone settings.
      The time zone offset should be changed if the time zone in which the component is created is different from the expiration time zone —for example if the component is created at an office in Chicago (Central Time), but the timer expires in New York (Eastern Time).
    • The click-through URL (optional):
    • The expiration image and link (optional):
      The expiration image is displayed once the timer expires.
      For example, you can create a banner letting the users know that they've missed the deal, either leading users to a new deal or to your website. If an expiration image is chosen, an expiration click-through link may then be defined.
    • Click on the "Update Preview" button to update the content in the preview section.
    • Click “Generate Code” to generate the embed code.
    • Input your email address under “Email Test” to send yourself an email with the component.

 

Static vs Dynamic Countdown Timer

You can choose between two types of countdown timers: a Static End, where all recipients see the same countdown, or a Dynamic End, where each recipient receives a personalized countdown based on who they are or when they open the email. Learn how to set up both options in the sections below.

Static Countdown Timer

Static End date 

With a Static End countdown a preconfigured end date and time is defined in the component configuration.

When a customer receives a countdown timer of this type, no matter who they are or when they are seeing the countdown timer, all customers will see it counting down to the time and date set in the component configuration.

This version of the countdown timer while static does give you the ability to include an image as the background of the timer and supports a timer that can be set to up to 30 days in advance. Though our recommendation is to keep countdown timers between 24hrs and 7 days  maintain a sense of urgency.

Static Web Version Countdown Timer

When a Static End date is selected for your countdown timer you will have the option to create a web version of your countdown timer.

Using this option, after generating the code for your component you will receive a short JavaScript code that can be taken and embedded into a landing page or web site.

In this version of the countdown timer you have all the same options are a static email countdown timer.

Dynamic Countdown Timer

Dynamic End with Personalization Tags

In this version of the countdown timer, the end date and time for the timer can be controlled using personalization tags.

This means that a customer attribute or time from the email is sent can be used to dynamically set the end date and time for the component. Allowing you to have a personalized countdown timer for each and every customer who receives the email. 

For example you could use [%CURRENT_DATE:ADD_DAYS(7):yyyy-MM-dd%]T[%CURRENT_TIME:hhmm%]-00:00Z to create a countdown timer that counts down to exactly 7 days from when the email is sent (in this example the time zone is in UTC).

Or you could use [%SUBSCRIPTION_RENEWAL%]T[%CURRENT_TIME:hhmm%]-00:00Z to countdown to an upcoming subscription renewal date.

Note that this version has some important guidelines to follow to ensure that is works properly.

Guidelines
  • Time zone offset must be present for the countdown to work. Without the time zone offset we are unable to accurately determine the end time for the countdown timer.
    • In the examples above the -00:00Z indicate the time zone is UTC if you wanted EST you could use -0500Z  
  • The date and time that is returned from the personalization tags should be aligned with the format that is written in the “Personalization Tag Format” field. This field may be adjusted to align with the tags you already have created and details for what are supported format options can be found in the “Date Format Options” menu.
  • The maximum allowed time is to countdown to up to 30 days in the future. Our recommendation for best results with the countdown timer is to keep the days into the future under 7 to increase the level or excitement.
  • This version of the countdown includes a fallback option incase there is an issue with the personalization tag dates or if the date is outside the allowed end date range. The options that are available are for the component to collapse and show nothing in the email or to display a static image that you will select in the creator.
    • If a larger size is required or an image background is desired, please reach out to your Customer Success Manager to explore options

 

Dynamic End Based on Open Time

This version of the countdown timer takes personalization to a new level by allowing you to set up a countdown timer that will countdown to a set amount of time in the future from when the email is first opened.

In this set up you can support use cases such as a 48 hour offer that is only valid from when the email is opened. So for each customer who receives the campaign, when they open the email their unique countdown timer will start.

Note that this version has some important guidelines to follow to ensure that is works properly.

Guidelines
  • A Time From Open value must be set, this can either be an exact value like 24 (to indicate 24 hours) or it could be based on a personalization tag.
  • Valid values for the “Time From Open” include whole numbers like 3, 7, or 24 which are treated as number of hours to add or time values such as 3:30 to create a countdown timer that would include number of minutes to add to the timer (in this case counting down to 3 hours and 30 minutes from open time).
  • In order to show a unique countdown for each recipient this version of the countdown timer requires a user identifier personalization tag and a deployment identifier personalization tag or value.
    • We recommend using a user identifier such as a customer id to keep the data anonymous.
    • We recommend using a unique deployment or send identifier to support the ability for re-using the countdown timer. For example if you were to use customer ID and a hard coded deployment identifier like “Optimail” then if a customer were to receive the same countdown timer in multiple campaigns or sends, then the end date for the countdown timer would be set by the first timer they saw and it would not update again. Using something like Campaign ID would mean that the same user would be able to receive the same timer multiple times and each time would be an updated countdown timer.
  • The maximum allowed time is to countdown to up to 30 days in the future. Our recommendation for best results with the countdown timer is to keep the days into the future under 7 to increase the level or excitement.
  • This version also includes a fallback option incase there is an issue with the personalization tags or if the date is outside the allowed end date range. The options that are available are for the component to collapse and show nothing in the email or to display a static image that you will select in the creator.
  • To restrict the file sizes of the countdown timers and improve load times, this timer version only supports a static color background and is limited to 600x200px.
    • If a larger size is required or an image background is desired, please reach out to your Customer Success Manager to explore options.
 

Recommendations 

  • It is recommended to add a CTA to the background image.  
  • We recommend keeping the component as small as possible, to keep the image's file size low. 
  • We recommend setting the countdown to no more than 7 days, to avoid diminishing the sense of urgency. Although the timer can be set up to 30 days in advance, keeping expiration to 7 days or less increases urgency and raises the click-through rate. 
  • We recommend keeping additional content to a minimum. The timer runs for 60 frames (or seconds) and then restarts. If the recipient leaves the email open for more than 60 seconds, they will see the counter refresh. 

Related articles