How to Add a Sales Countdown Timer to a WooCommerce Product Page in Elementor?

Do you want to add a sales countdown timer on a WooCommerce product page in Elementor? A countdown on the product page creates urgency at the moment a shopper is deciding, which encourages them to buy before the offer runs out.

With the Countdown widget from The Plus Addons for Elementor, you build one product template and give every product its own countdown value, so a single layout drives a different timer on each product.

To check the complete feature overview documentation of The Plus Addons for Elementor Countdown widget, click here.

Requirement  – This widget is a part of The Plus Addons for Elementor, make sure its installed & activated to enjoy all its powers.

What It Does

The WooCommerce Countdown option adds a countdown panel to every WooCommerce product edit screen. The Countdown widget placed in your single product template then reads that per product value, so one template shows a different timer on each product.

Why It Matters

A countdown placed in a template alone shows the same deadline on every product that uses that template. Building a separate template for each offer stops being practical once you have more than a handful of products. Connecting the template to per product data lets a flash sale on one product and an evergreen offer on another run at the same time, with no extra layouts to maintain.

What You Get

• A WooCommerce Countdown panel on every product edit screen
• Three countdown types: Normal Countdown, Scarcity Countdown (Evergreen) and Fake Numbers Counter
• Four actions when the timer reaches zero: none, a message, an Elementor template, or a page redirect
• Countdown values stored per product, all driven by one shared template

Benefits

• One template covers your whole catalogue, so styling changes apply everywhere at once
• Each product keeps its own deadline, set by whoever edits that product
• The template can be built with the free Nexter Builder or with Elementor Pro
• Timers resolve against your WordPress site timezone, so every visitor sees the same deadline

Capabilities

Normal Countdown

Counts down to a fixed calendar date that you set on each product. The product field is a date picker, so you choose a day rather than a specific clock time.

Scarcity Countdown (Evergreen)

A per visitor timer that restarts on its own. You set the reset window in Minutes, so each visitor sees their own countdown rather than a shared deadline.

Fake Numbers Counter

A stock style counter that ticks down instead of showing time. It takes four values.

• Initial Number – the number the counter starts from.
• Final Number – the number the counter stops at.
• Number Range – the counter drops by a random amount between 1 and this number each time, which makes the movement look less mechanical. Set it to 5 and the counter falls by any number from 1 to 5 on each step.
• Change Interval (In Seconds) – how often the counter steps down.

After the Countdown Ends

From the Special Option tab of the widget, the Select Action dropdown controls what happens at zero.

• None – the default, nothing happens after the countdown ends.
• Message – show a message in place of the timer.
• Template – show any content through an Elementor template.
• Page Redirect – send the visitor to another page.

How It Works

Two separate switches have to line up before the widget reads product data.

1. The global WooCommerce Countdown setting under The Plus Addons > Extra Options > Settings.
2. The WooCommerce Single Connect toggle inside the Countdown widget itself.

The widget only pulls the value saved on the product when both are enabled. If either one is off, it quietly uses the date set inside the widget instead, and every product ends up showing the same timer. That single behaviour explains most reports of a countdown that will not change per product.

Countdown values are calculated against the site timezone from Settings > General, not against each visitor’s local clock, so the deadline lands at the same moment for everyone.

How to Use It

Enable WooCommerce Countdown

First, enable The Plus Addons for Elementor WooCommerce countdown option. To do this –

1. From the Dashboard, go to The Plus Addons > Extra Options > Settings.

2. Scroll down to the WooCommerce Countdown section and enable it.

Add the Countdown Widget to the Product Template

Then, add the Countdown widget to the single product template, and follow the steps –

Note: To create the single product template, you can use the free Nexter Builder or you can use Elementor Pro if you are already using it.

1. Go to the WooCommerce tab and enable the WooCommerce Single Connect toggle.

2. Then come back to the Countdown Date tab and select the appropriate countdown type from the Countdown Setup dropdown. The three types are described under Capabilities above.

Also read, 6 best WordPress countdown timer plugins.

Select the option as per your requirements, let’s select Normal Countdown here.

3. Select the appropriate style from the Countdown Style section. You can adjust the timer itself from the Content Source tab, and set what happens at zero from the Special Option tab.

Set the Countdown Value on Each Product

Now add the countdown value to the product itself. Edit the product you want the timer on and scroll down to the WooCommerce Countdown section, where you will find three groups of fields.

Did you know? You can add WooCommerce product stock scarcity timer in Elementor.

Normal Countdown – set the Date the countdown ends on.

Scarcity Countdown (Evergreen) – set Minutes, the timer reset window.

Fake Numbers Counter – set Initial Number, Final Number, Number Range and Change Interval (In Seconds).

Fill in the group that matches the countdown type you selected in the template. In this example that is Normal Countdown.

Note: Fill in the group that matches the countdown type set in the widget, and do not leave it empty. When no value is saved on the product, the widget does not hide the timer, it falls back to a generated date roughly one month ahead.

Now you will see the countdown timer on that specific product page only.

Use Cases

• Flash sale on selected products – use Normal Countdown and set the sale end date only on the products that are discounted.
• Evergreen offer for new visitors – use Scarcity Countdown so each visitor gets their own window, which suits products that are always on offer.
• Stock pressure on a bestseller – use Fake Numbers Counter to show a falling units figure alongside the price.
• Seasonal campaign across a category – one template stays in place while you set dates product by product as each promotion starts.

Limitations

• Normal Countdown accepts a date only. There is no time of day field, so the countdown ends at midnight site time on the date you choose. To end a sale at a specific hour, use the widget’s own date field rather than the per product one.
• The WooCommerce Countdown panel is added to WooCommerce products only. Other post types do not get this field.
• Both the global setting and the widget’s Single Connect toggle must be on. With either off, the per product value is ignored.
• Leaving the product field empty does not hide the timer, it falls back to a date about one month ahead. Always set the value explicitly.
• On a brand new product that has not been saved yet, the panel can appear unstyled, because its admin styles load on the product edit screen rather than the add new screen. Save the product once and reload it.

Troubleshooting

The countdown settings disappear after I publish the product

The date and settings save, then vanish from the product screen once the product is published. This was a confirmed bug in the WooCommerce countdown file and was fixed in a later release of The Plus Addons for Elementor. Update the plugin to the latest version, then re enter the value and save the product again.

Every product shows the same countdown

The widget is falling back to its own date because one of the two switches is off. Check that WooCommerce Countdown is enabled under The Plus Addons > Extra Options > Settings, and that WooCommerce Single Connect is enabled in the widget’s WooCommerce tab. Both are required.

The timer ends at the wrong time

Two things to check. Countdowns resolve against the site timezone in Settings > General, so a site left on UTC will end the sale at UTC midnight rather than your local one. And because the per product field stores a date with no time, the countdown always ends at the start of that day, not at the end of it.

A countdown appears on a product where I never set one

The product’s countdown field is empty, so the widget generated a fallback date about a month out. Set a real value on that product, or remove the Countdown widget from the template for products that should not show a timer.

The countdown type I filled in is being ignored

The product panel holds all three groups of fields at once, but the widget only reads the group matching the Countdown Setup type chosen in the template. Filling in Minutes while the widget is set to Normal Countdown has no effect. Match the two.

Also read, how to add a scarcity countdown timer in WooCommerce checkout, cart & product pages.

This is how you can add a sales countdown timer to a WooCommerce product page in Elementor.