You are here:
Set Up a Countdown Timer
Add a Countdown Timer to any cell in the Point of Sale Layout Editor to visually track time until a future date. Customize the appearance and format to fit your design needs, ensuring users stay informed and engaged.
Create a Countdown Timer
In the Layout Editor, you can create a timer on top of a cell by launching the timer configuration window.
- In CMS, go to .
- Edit a selected app config.
- Select a cell.
- Expand Cell Overlays in the toolbar on the right.
-
Select Timer.
These settings can be customized:
- Expiry Time
- The end time of the countdown.
- iOS Font
- The font style for iOS devices.
- Font Size
- The font size.
- Color
- The color of the countdown.
- Background Color
- The background color of the countdown.
- Display Text Format
- The display text format (e.g., HH:MM:SS).
- Timer is Expired Text
- The text to be displayed when the countdown expires.
Configure the Display Text Format
The display format of the countdown timer is a string that can contain these substitutions:
| Variable Substitutions | |
|---|---|
| %D | = number of days |
| %H | = number of hours (0 - XX) |
| %HH | = number of hours (00 - XX) |
| %M | = number of minutes (0 - XX) |
| %MM | = number of minutes (00 - XX) |
| %S | = number of seconds (0 - XX) |
| %SS | = number of seconds (00 - XX) |
| %DL[plural,singular] | = day / days |
| %HL[plural,singular] | = hours / hour |
| %ML[plural,singular] | = minute / minutes |
| %SL[plural,singular] | = second / seconds |
| %XX | = only show the highest granularity label definition |
Display text format: %HH:%MM:%SS
The
countdown clock is the default behavior if no display text format is specified. The clock is
updated each second and shows the number of hours, minutes, and seconds remaining.
Example 2: Show Highest Timeframe Only
Display text format: Only %XX %DL[days,day]%HL[hours,hour]%ML[minutes,minute]%SL[seconds,second] left
In this use case,
the goal is to show the number of days remaining until there is less than one day. Then the
number of hours will show until there is less than one hour. Finally, the number of minutes and
seconds will be shown until the expiration date is reached.
Expired Timer Behavior
After the expiration date has passed, if a "Timer is Expired Text" has been configured, then this text string will be shown. Otherwise, the timer will be removed from the UI. Note that in the CMS, "Timer Expired" will be shown so that the user knows that the cell was configured as a timer.

