Header: Countdown
Countdown
The Countdown block shows a live timer counting down to a date and time you set. Use it to build urgency around a sale, a product launch, or a shipping cutoff ("Order within 2h 14m for next-day delivery"). It updates in the visitor's browser in real time and can show a progress bar.
What it shows
A timer with text before it ("Sale ends in") and the time remaining counting down — days, hours, minutes, seconds. When the timer reaches zero, it can either disappear or swap to a message you've written ("Sale has ended"). An optional progress bar fills up as the deadline approaches.
Setting the timer
Setting | What it controls |
|---|---|
Start date | When the countdown period begins (used for the progress bar) |
End date | The deadline the timer counts down to |
Text before end | Text shown in front of the timer while it's running |
Show text after end | Whether to display a message once the timer hits zero |
Text after end | The message shown after the deadline passes |
Both dates use a date-and-time picker. The progress bar measures how far along you are between the start and end dates.
Display options
Setting | What it controls |
|---|---|
Simple mode | A shorter display — when more than a day remains, it shows just the number of days instead of the full hours/minutes/seconds breakdown |
Show progress bar | Display a bar that fills as the deadline nears |
Progress color | The color of the filled part of the progress bar |
Background color | The countdown's background |
Text color | The timer text color |
Font size | Size of the timer text |
How it behaves
- The timer runs live in the visitor's browser, counting down second by second (or day by day in simple mode when there's more than a day left).
- When the deadline passes, the block either hides itself or shows your "after end" text, depending on the toggle.
- The progress bar reflects the span between your start and end dates — at the start it's empty, at the deadline it's full.
Tips
- Set a real deadline. A countdown that resets or never ends trains customers to ignore it.
- Use simple mode for long campaigns (days away) and the full timer for the final push (hours away) — the ticking seconds create more urgency when the deadline is close.
- Write "after end" text rather than letting the block vanish, so a visitor who arrives late understands the offer is over instead of wondering what was there.
- Times are based on the visitor's own clock, so the countdown stays accurate wherever they are.