Skip to content

Adding a Countdown Timer

You get a live clock that counts down to your event, deadline or offer end. Use it when a date matters and you want visitors to act before it passes.

Countdown timer in 3D flip style showing days, hours, minutes and seconds until an open day

Add a countdown timer

Open your page while logged in: the builder controls appear when you hover the content area. Your first page shows the basics.

  1. Hover the column and click + in its control bar, or click Add Elements on an empty page. Open the Content tab and click Countdown timer. It lands at the top of the column and its settings dialog opens.
  2. Choose a Countdown style, for example 3D flip.
  3. Keep Date / Time Limitations on its default, Specify date only, and set the Date the countdown ends.
  4. Display options has all five units ticked. Clear the ones you don't need; here we clear Show remaining years.
  5. Click Save in the dialog. Then click Save in the toolbar at the top of the content area to store the page.

What you see

The clock counts down to the date you picked, in the style and units you chose. In the video, a 3D flip clock shows days, hours, minutes and seconds to a date three months ahead. Visitors see it once you save the page and it is published.

Set up your countdown timer

Hover the element and open More > Settings in its control bar. Options:

  • Countdown style: the look of the clock: Plain, Grid, 3D flip, Disc, Airport style or Transparent.
  • Date / Time Limitations: what the clock counts to. Pick Specify date only (the default), Specify date and time, Specify time only (repeating every day) or Resetting counter (set interval up to 24 hours).
  • Date: the day the countdown ends. It ends at midnight as that day starts, in each visitor's own time zone. The other modes show Date / Time or Time instead.
  • Reset in hours: with Reset in minutes and Reset in seconds, the interval of a resetting counter.
  • Page referrer: a page that opens when the time runs out. It shows for the repeating and resetting modes.
  • Automatic restart: starts a resetting counter again when it reaches zero.
  • Display options: the units the clock shows, from Show remaining years to Show remaining seconds. All five are ticked by default.

If you don't see it

  • Countdown timer is not in the Content tab. Your user profile hides it. Ask an administrator to tick Countdown under Elements in User Profiles.
  • It is gone after you reload. The page was not saved. Add it again and click Save in the toolbar at the top of the content area.
  • All digits show zero. The target date is in the past. Hover the element and open More > Settings, then set a future Date.
  • There is no Date field. Date / Time Limitations is set to another mode. Pick Specify date only, or fill in the Date / Time or Time field that mode shows.
  • The clock starts over every day. Date / Time Limitations is set to Specify time only (repeating every day). Pick Specify date only for a one-off event.

What's next?

Style tab to change spacing and background for your countdown timer.

Something wrong or missing on this page? Report it or edit the page.