The Countdown Timer module allows you to show a countdown timer on your WooCommerce product pages, which creates a sense of urgency in your visitors and, as a result, may increase your conversion rate.
You can choose between two countdown modes:
- an evergreen mode that creates a unique expiration date for each visitor
- a fixed period mode where you can set the same start and end date for all visitors
The countdown timer is fully customizable, including the countdown rules, layout, content, and style. You can also decide whether you want to show the timer on all product pages or only for discounted products.
In the screenshot below, you can see what a countdown timer looks like on a WooCommerce product page:
The screencast video below shows how the countdown timer works in action:
Below, we’ll see how to set up and activate Merchant Pro’s Countdown Timer module.
1. Open the Countdown Timer Module
Open your Merchant dashboard by clicking the Merchant menu in the left sidebar of your WordPress admin area.
Find the Convert More section, then click the Countdown Timer module to open its settings page:
2. Review the Module’s Settings
On the admin page of the Countdown Timer module, you’ll find three groups of settings:
- Settings – Here, you can choose between the two countdown modes (fixed period and evergreen) and set up the countdown rules.
- Display Settings – These options let you configure the layout and content of the countdown timer.
- Look and Feel – Here, you can customize the colors and typography of the module.
There’s also a Preview pane on the module’s admin page that shows a live view of the countdown timer, which changes in real time as you configure the settings:
3. Choose a Countdown Mode and Define the Rules
In the Settings section, first, select a countdown mode using the Countdown timer end date dropdown. You can choose from the following two options:
- Evergreen – In this mode, Merchant Pro generates a unique expiration date for each visitor within set minimum and maximum deadlines.
- Sale price dates – In this mode, the timer counts down to a specified end date and time.
Both modes have their dedicated options; we’ll see them one by one below.
i. Options of the Evergreen Mode
If you chose the Evergreen mode, you need to configure the following options (or you can go with the default values):
- Cool off period (minutes) – This is the time period after which the countdown will restart, and the timer will re-appear for the respective customer (default value: 15 minutes).
- Minimum expiration deadline: Days, Hours, Minutes – Here, you can define the number of hours before the end date (set by the Maximum expiration deadline option) when the timer will disappear from the product pages (default value: 0 days, 2 hours, 0 minutes).
- Maximum expiration deadline: Days, Hours, Minutes – This is the end date when the countdown will reach 00:00:00 (default value: 0 days, 26 hours, 0 minutes).
An Example of the Evergreen Countdown Workflow
Let’s see what the countdown looks like using the default values:
- The visitor lands on your website.
- Merchant Pro adds a cookie to their browser, and the countdown timer immediately appears on your product pages.
- As the Maximum expiration deadline is set to 26 hours, the countdown will start at 1 day 02:00:00.
- As the Minimum expiration deadline is set to 2 hours, the timer will disappear 24 hours after the visitor lands on the website, when the countdown is at 0 day 02:00:00. (If you want to show the timer until the countdown ends, you need to set Minimum expiration deadline to 0 hours.)
- As the Cool off period is set to 15 minutes, the timer will re-appear on your product pages 1 day 2 hours and 15 minutes after the visitor first lands on your site. The countdown will start again at 1 day 02:00:00. (The goal of this setup is to create a sense of scarcity.)
ii. Options of the Sale Price Dates Mode
If you chose the Sale price dates mode, you need to configure the following options:
- Countdown starts at – Here, you can define the start date and time of the countdown using a visual date picker.
- Countdown ends at – Here, you can define the end date and time of the countdown using a visual date picker.
Once the countdown settings are configured, click the Save button in the top-right corner of the page.
4. Configure the Display Settings
In the Display Settings section, review and configure the following options:
- Display on discounted products only – Here, you can choose whether you want to show the countdown timer on all of your product pages or only for your discounted products. (You can discount a product on its WooCommerce product page — available from the Products > All Products menu — in the Product data section.)
- Select layout – Here, you can choose between seven countdown timer layouts.
- Sale ending message – This is the message that Merchant Pro displays next to the timer (default value: ‘Sale ends in’).
- Align – This option lets you set the alignment of your countdown timer on the WooCommerce product pages. The available options are Left, Center, and Right.
If you’ve changed any of the default values, click the Save button in the top-right corner of the page.
5. Customize the Style of the Timer
In the Look and Feel section, you get access to the following style options:
- Digits’ font size – Here, you can change the font size of the countdown timer’s digits using a range slider (default value: 16 px).
- Sale ending message text color – This is the text color of the sale ending message that shows up before the timer (default value: #626262).
- Digits’ color – This is the text color of the digits (default value: #444444).
If you’ve changed any of the default values, click the Save button in the top-right corner of the page.
6. Enable the Countdown Timer Module
As all the settings have been configured, it’s time to activate the module. To do so, click the Enable button at the top of the module’s page: