The Countdown widget does more than count to a date. It can run a separate timer for every visitor, fake a stock counter, swap sections in and out of a page, and hand over to a message, a template or another URL when it finishes.
This page is the map: every control, what it does, what it starts at, and which parts need Pro.
Requirement – This widget is a part of The Plus Addons for Elementor, make sure it’s installed & activated to enjoy all its powers.
Before You Start
- Edition: the Countdown widget itself is in the free plugin, but this page uses a Pro setting (see the next line).
- Free: a countdown to a fixed Launch Date, the three Countdown Style presets, and Inline Style.
- Pro: Scarcity Countdown (Evergreen), Fake Numbers Counter, the Days / Hours / Minutes / Seconds switches, everything under Select Action, Reset Time, Track User Data, Class Based Section Visibility and WooCommerce Single Connect.
- Prerequisite: Elementor (free) installed and active.
- Widget to enable: go to The Plus Addons > Widgets, search for Countdown and turn its toggle on.
Content > Layout
| Setting | What it does | Default |
|---|---|---|
| Countdown Setup | Normal Countdown ends at one fixed moment for everyone. Scarcity Countdown (Evergreen) starts a separate timer for each visitor. Fake Numbers Counter is not a clock at all — it is a number that drifts towards a target. | Normal Countdown |
| Countdown Style | Style 1 is a number over a label. Style 2 is a flip-clock face. Style 3 is a set of progress rings. Hidden for Fake Numbers Counter. | Style 1 |
| Launch Date | The date and time a Normal Countdown ends, read in your WordPress timezone. Hidden when WooCommerce Single Connect is on. | One month ahead |
| Inline Style | Puts the four units on one line. Only shown with Style 1. | Off |
Content > Content Source
| Setting | What it does | Default |
|---|---|---|
| Days, Hours, Minutes, Seconds | Show or hide each unit. The switch reads Show / Hide. | All on |
| Show Labels | The words under the numbers. Off leaves just the digits — measured, that takes the widget from 124 px tall to 96 px. | On |
| Tag | The HTML tag used for each label. | h6 |
| Days Section Text and the other three | The label wording. Changing them works: setting them to Dias / Horas / Min / Seg rendered 02 DIAS 01 HORAS 57 MIN 04 SEG. | Days, Hours, Minutes, Seconds |
Content > Special Option
This is where you decide what happens when the clock runs out. Note the section name is Special Option, singular.
| Setting | What it does | Default |
|---|---|---|
| After Expiry Action | Master switch for the end-of-countdown behaviour. | On |
| Select Action | None, Message, Template or Page Redirect. | None |
| Expiry Message | The plain text shown instead of the timer. | Countdown Has Ended |
| Template | A saved Elementor template to render instead of the timer. | None selected |
| Page Redirect Url | Where to send the visitor. | Empty |
Content > Extra Option
The name is Extra Option, singular. What you see here depends on Countdown Setup.
| Setting | Applies to | What it does | Default |
|---|---|---|---|
| Theme Color | Style 2 | Dark, Light or Mix for the flip-clock face. | Dark |
| Theme Change Time | Style 2, Mix | How often the theme alternates, in seconds. | 3 |
| Reset Time | Scarcity (Evergreen) | How many minutes each visitor’s timer runs. | 99 |
| Track User Data | Scarcity, Fake Numbers | No or Yes(Local Storage Based). Only the second one remembers the visitor across page loads. | No |
| Enable Loop | Scarcity, Fake Numbers | Start over once the timer or the counter has finished. | On |
| Delay Minute | Scarcity | Wait this many minutes before looping. | 0 |
| Initial Number | Fake Numbers | Where the counter starts. | 500 |
| Final Number | Fake Numbers | Where it stops. | 99 |
| Number Range | Fake Numbers | The largest random step it takes each time. | 10 |
| Change Interval (In Seconds) | Fake Numbers | How often it steps. | 1 |
| Fake Message | Fake Numbers | The sentence around the number. Use {visible_counter} where the number should go. | Showing {visible_counter} |
| Class Based Section Visibility | Normal, Scarcity | Show one tagged section while the timer runs and another after it ends. | Off |
| During Countdown Class / After Expiry Class | Normal, Scarcity | The two CSS class names. Both must be filled in. | Empty |
Content > WooCommerce
| Setting | What it does | Default |
|---|---|---|
| WooCommerce Single Connect | Takes the deadline from the product instead of from Launch Date. Needs the WooCommerce Countdown extension switched on under The Plus Addons > Extensions, which adds a WooCommerce Countdown box to the product edit screen. | Off |
The Style tab
The style sections that appear are Counter, Label, Dark Theme, Light Theme, Dot, Style 3, Expiry Message, Fake Message, Fake Number, Background and On Scroll View Animation. Which ones you see depends on the setup and style you picked.
Watch it being set up
The Content Source section, where the four units and their labels live:
And Special Option, which decides what happens at the deadline:
How It Behaves
- The timer updates once a second. Measured on a published page: 50 hours out it read 02 DAYS 01 HOURS 58 MINUTES 14 SECONDS and four seconds later …58 MINUTES 10 SECONDS.
- Inline Style changes the widget from 124 px tall to 37 px, with the four units on one row.
- A Scarcity Countdown (Evergreen) starts at the full Reset Time for each new browser and, with Track User Data set to Yes(Local Storage Based), carries on across reloads.
- All four after-expiry behaviours — message, template, redirect and the class swap — were confirmed working, but see the first limitation below for when.
Limitations
- With Style 1 nothing happens at the moment the clock hits zero. This was watched on published pages: with Style 1 the timer reaches 00 00 00 00 and stays there for as long as the visitor leaves the page open — the message, the template, the page redirect and the class swap all wait for the next page load. With Style 2 and Style 3 the same settings do act the instant the timer runs out. Since Style 1 is the default, assume the change happens on reload unless you have deliberately chosen another style, and never write copy promising visitors that the page will change in front of them.
- Style 2 and Style 3 read the deadline in the visitor’s timezone; Style 1 reads it in your site’s. This was isolated with a controlled test. One Launch Date, nothing else changed: from a browser five and a half hours ahead of the site, Style 1 showed 02 DAYS 01 HOURS 56 MINUTES left while Style 2 and Style 3 showed 1 Day 20 Hours 25 Minutes — short by exactly that offset. Repeating it with the browser set to the site’s own timezone made all three agree. So on a live site a Style 2 or Style 3 sale ends at a different real-world moment for every visitor, and for visitors far enough ahead of your site it can be over before it starts. If the exact end time matters, use Style 1.
- Launch Date is only accurate to the minute. The date picker stores hours and minutes; seconds are dropped. A deadline set for 10:30 fires at 10:30:00, so do not build anything that depends on a particular second.
- Class Based Section Visibility does nothing with Style 3. The feature is skipped for the Style 3 preset, and it is skipped for the Fake Numbers Counter setup. Use Style 1 or Style 2 with Normal Countdown or Scarcity Countdown (Evergreen).
- The evergreen timer is per browser, not per person. The deadline is kept in the browser’s local storage, so a private window or another device starts over.
- Turn Elementor’s element cache off for this widget. Elementor’s Element Cache is on by default and stores rendered markup for a day, which can serve a stale deadline. Set Advanced > Layout > Cache Settings to Inactive on the Countdown widget, or disable it site-wide under Elementor > Settings > Performance.
Troubleshooting
I cannot find the Countdown widget in Elementor
Turn it on under The Plus Addons > Widgets. A widget whose toggle is off is not offered in the panel.
A control I read about is not in my panel
Two possible reasons. It may belong to a different Countdown Setup — the Extra Option section changes completely between the three. Or it may be a Pro control; in the free plugin those are replaced by an upgrade notice.
The timer shows a time I did not set
Check Settings > General > Timezone, and check which Countdown Style you are using — Style 2 and Style 3 do not read the deadline the same way Style 1 does.
Not verified
So you know exactly what has and has not been checked:
- The Style tab control by control. Only the rendered presets were measured; no colour, typography or spacing control was exercised individually.
- Tablet and mobile breakpoints. Everything was measured at a 1200 px viewport.
- Enable Loop and Delay Minute running through a full cycle.
- Behaviour behind a page cache or CDN.
