1. Home
  2. Docs
  3. Creative Elements
  4. Countdown

Countdown

Countdown is a very handy element. You can create both functional and visually appealing timers with this element. Place a timer with a product to let individuals know how much time is remaining before the discount offer expires. You can also put a timer on an event registration page. The timer will serve the same purpose as it did in the first example- engage more people.

Customization Options

The Customization Options are not meant to be adjusted sequentially as shown below. The starting point for the customization process can be as random as you want it to be. Go back and forth and build your own routine.

Content

You only need to select a Due Date. Afterwards the Countdown element will automatically estimate the time remaining before the due time runs out. It will then divide the time duration into Days, Hours, Minutes and Seconds. You don’t need to type in the due date manually.

Then open the Content Settings option. From there pick any of the three available styles for your Countdown.

As default the Countdown will display Days, Hours, Minutes and Seconds. But you can choose not to show any of the above. You can separately turn on/off which time units you want to show. You can further customize the labels of the time units.

To finish it off, turn on the Display Separator.

Style

First, go and pick a background color for your element. If you want to keep a gap between your Countdown and the next element, then adjust the Space Below Container option. Then adjust the padding.

You can separately edit the Countdown Digits and Countdown Labels. To open the typography options click on the pencil icon.

Then you have the Individual Box Styling. From here you will be able to separately edit Background, Digit, Label and Border color for all the boxes.

See how beautiful Countdowns you can build with Essential Addons.

Essential-Addons-Elementor-Countdown-Demo

Click to See Live Demo.

How can we help?