Appearance
Countdown Timer
A countdown clock that ticks down to a specific date and time. Use it for product launches, flash sales, or event registrations.
What it looks like
Here's the countdown timer section alongside its settings in the theme editor. The left panel shows the settings you'll see in Customize, and the right shows the result on your storefront.
Storefront preview
Settings
| Setting | What it does |
|---|---|
| Color scheme | Picks which set of colors to use for this section |
| Heading | The text above the countdown clock |
Block Settings
Countdown scheduling and display are configured via the Countdown block. Add the Countdown block to access all timing and expiry options.
| Setting | What it does |
|---|---|
| Start year | Optional year the timer becomes visible from (2026–2040). Pick Always show to show the timer immediately. When a year is picked, month/day/time selects appear below. |
| Start month | Month the timer becomes visible from (January–December). Only shown when Start year is picked. |
| Start day | Day of the month the timer becomes visible from (1–31). Only shown when Start year is picked. |
| Start time | Time of day the timer starts (24-hour HH:MM dropdown, 30-min increments). Defaults 00:00. Only shown when Start year is picked. |
| End year | Required. The target year the timer counts down to. While it reads Not set the countdown has no end date, so nothing renders on your storefront at all. |
| End month | The target month (January–December). Only shown when End year is picked. |
| End day | The target day of the month (1–31). Only shown when End year is picked. |
| End time | The target time of day in 24-hour HH:MM (30-min dropdown). Defaults 23:30. Only shown when End year is picked. |
| Variant | Whether the digits show as Full (labelled units) or Compact (an inline row) |
| Show seconds | Shows or hides the seconds counter |
| On expiry | What happens when the countdown reaches zero — hide the timer, show an expired message, or redirect to a URL |
| Expired message | Text to show after the countdown ends (if After expiry is set to show message) |
| Redirect URL | Page to redirect to when countdown expires (if After expiry is set to redirect) |
| Color scheme | Color scheme for the countdown block |
The section must contain a Countdown block for any scheduling to take effect.
Scheduling (Phase 06.17-B v2)
Date and time are split into four select dropdowns each side: Year, Month, Day, Time. The year is the gate — picking it reveals the month/day/time selects below.
The two sides behave differently when they are left alone. Start year is optional: Always show means "no start schedule", and the timer is visible straight away. End year is required: while it reads Not set the block renders nothing on the storefront, and the theme editor shows you a short setup note in its place. A countdown never invents an end date for itself — Shopify's Theme Store requirements prohibit fictitious countdown timers, so a timer with no real deadline behind it simply does not appear.
Year/month/day/time are select dropdowns rather than text inputs, so the schedule is "tap, tap, tap, tap" with no typing required and no possible typos. Time is a 24-hour HH:MM dropdown with 48 half-hour increments.
There is no stand-in date behind the scenes. If the combination you save isn't a real date — February 30, April 31 — the timer never starts, and the digits stay at the zeros they render with. Reload the editor, pick a real day, and save again.
If your store previously used the single-field Start at / End at text inputs OR the v1 Start date / Start time text-input pair, those values still resolve correctly: Liquid walks a three-tier ladder — legacy *_at first, then v1 *_date + *_time, then v2 *_year + *_month + *_day + *_time. The legacy and v1 fields are hidden from the editor; removal is planned for a Phase 7+ cleanup.
Tips
- Always set a realistic end date. A countdown that resets every day trains visitors to ignore the urgency.
- Use the "After expiry" setting to automatically hide the clock when the sale ends, so you don't accidentally leave an expired countdown on your homepage. The section and its heading stay on the page until you remove them.