Countdown timer
A countdown to an end date you set. A message appears once the time runs out.
Where it is used
This is a standalone block. It can be added inside the Popup link block (popup-link.liquid). No section in the package places it.
Settings
| Setting | Options | Description |
|---|---|---|
| End date | Enter a future date in YYYY-MM-DD format. The countdown ends at 00:00 UTC on that date. | |
| Expired message | This message will be displayed when the time has expired. | |
| Design | • Default | Default shows plain numbers. Modern puts each unit in a larger tile with a tinted, blurred background. |
| Countdown shape | • Default | Shape of the box around each unit (days, hours, minutes, seconds): the default shape, rounded corners or a circle. |
| Border style | • None | Solid draws a thin outline around each unit. None leaves the units without an outline. |
| Content alignment on mobile | • Left | Aligns the timer to the left, center or right of its row. |
| Item spacing | Space between the days, hours, minutes and seconds units. With the Modern design the space is removed on mobile. | |
| Countdown color | Color of the countdown numbers and unit labels. | |
| Background color | Background color of each unit tile. Only used with the Modern design. |
Spacing
| Setting | Options | Description |
|---|---|---|
| Top padding | Adds space above the timer. Values above 20px are reduced on small screens. | |
| Bottom padding | Adds space below the timer. Values above 20px are reduced on small screens. |
Background color appears only when Design is set to Modern.
No comments yet