Try Zest freeContact support

Countdown timer

Set up a Countdown timer section to trigger the FOMO effect to boost conversions and sales.

An example of countdown timer in Zest theme

A countdown timer is a virtual clock that displays the amount of time (days/ hours/ minutes/ seconds) currently remaining on an offer.

A countdown timer is a powerful way to drive conversions and help boost sales.

In this article, we will show you how to add a Countdown timer section.

How to add a Countdown timer section to your Shopify store

Steps

  1. In the theme editor (Customize) > click Add section.

  2. Select Countdown timer.

  3. Make necessary changes.

  4. Save the settings.

How to edit a Countdown timer section

Section settings

General

See how to adjust the Container settings

See how to adjust the Color scheme settings

Settings

You can choose the content container by enabling the Use content container checkbox.

Change the Countdown position (Left/Center/Right) and then align the text inside - Text alignment (Left/Center/Right).

Moreover, you can also pick a Background image for the timer and set the opacity for it in the Image overlay opacity range.

Background video

This setting allows users to set the background of the countdown timer as a video.

You can enable the background video by checking the Show background video checkbox.

There are 2 Video types: Shopify-hosted/ External

If you use a Shopify-hosted video, select a video from your Files.

If you don't use an external video (YouTube or Vimeo), insert the External video URL.

For the External video URL: Accepts YouTube or Vimeo links only.

Blocks settings

You can add 5 types of blocks to the Countdown timer section:

  • Heading

  • Subheading

  • Text

  • Countdown timer

  • Button

Heading

Add the Heading of the event to attract customers' attention.

  • Leave it blank if you do not want to display it.

See: How to apply Highlight text to the section heading and block headings?

You can also change the Heading size to:

  • Heading - Medium

  • Heading - Large

  • Heading - Extra large

  • Heading - Extra extra large

  • Mega title - Base

Subheading

Add the Subheading of the event.

  • Leave it blank if you do not want to display it.

Text

Add the Description to describe the event. Use the formatting buttons to add text styles, links, or lists. To learn more, see Shopify's Rich text editor manual ↗.

  • Leave it blank if you do not want to display it.

Countdown timer

Add a countdown timer and adjust the end time of the event.

The Countdown type offers two modes:

  • Evergreen: A repeating countdown that resets after a specified duration (e.g., every month).

    • This is useful for recurring sales, daily deals, or subscription cycles.

The Evergreen setting is only available in Zest version 9.0.0 and above. ✨

See Changelog.

  • Fixed time: A one-time countdown that ends at a specific date and time.

    • Ideal for limited-time promotions, event registrations, or product launches.

The countdown timer can be displayed in different Styles: Minimal/ Highlight

The Number size and Number spacing can be adjusted to improve readability and aesthetics:

  • Small

  • Medium

  • Large

If you choose the Evergreen countdown, you must specify the Duration for when the timer should reset.

Duration determines how often the countdown restarts.

If you choose the Fixed time countdown, you need to specify when the countdown should end.

Enter the exact date and time in the Ends time field when the countdown should stop.

Date formats accepted:

Name
Format
Example

24 hour format

YYYY/MM/DD HH:MM

2023/10/04 23:30

12 hour format

YYYY/MM/DD HH:MM AA

2023/10/04 11:30 PM

Button

You can also display a call-to-action button to redirect customers to your desired pages.

Last updated

Was this helpful?