The Countdown element allows you to display a countdown tool that you can use for events such as an opening, marriage etc. This element basically counts down from a given date and time to the current time.
- Opening Countdowns
- Coming Soon Page
- Marriage Countdowns
- Any Event Countdown Timer
In this article
Displaying the Countdown Element
To add a Countdown element to a page:
|Due Date||Sets the countdown due time. The entered date must be in year/month/day hour:minute:second format. The result will be displayed in Days – Hours – Minutes – Seconds format.
|View||Choose to display the element as Block or Inline.
|Days||Enable or disable days view in the countdown.
|Hour||Enable or disable hours view in the countdown.
|Minute||Enable or disable minute view in the countdown.
|Second||Enable or disable the second view in the countdown.
|Width||Sets the width of the Countdown element.
|Background Type||Sets a classic or gradient background color for the Countdown element.
|Space Between||Sets the space between hour, minute and seconds.
|Padding||Sets a padding for each unit.|
|Alignment||Aligns the Countdown element on a page.|
|Border Type||Sets a type of border for the Countdown element.|
|Border Radius||Sets a custom radius for the border.|
|Box Shadow||Sets the shadow around the element.
|Color||Lets you change of the numbers shown inside the Countdown element.|
|Typography||Lets you change and style everything related to numbers in the Countdown element.
|Color||Lets you change of the labels like days hours etc shown inside the Countdown element.|
|Typography||Lets you change and style everything related to labels in the Countdown element.|
|Space||Sets the space between numbers and labels in the Countdown element.|
You can choose to have different settings on different screen sizes for some of the Countdown element options. Whenever you see this icon, it means that you can choose different screen size and freely change that options for your specific resolution.
At first you’ll see the icon for desktop layout only
But when you click that icon, you’ll get two more layouts: for tablet and phone.
To learn more about it, please check this article.