Sales Countdown Timer


Created: 08/2018

Latest update: 6/2024 – Updated to Sales Countdown Timer version 1.1.3

By: VillaTheme

Thank you for purchasing our plugin. If you have any questions that are beyond the scope of this documentation, please feel free to request support at our Support Forum. Thanks so much!

WooCommerce countdown timer helps to motivate customers to purchase. Many shop owners use WooCommerce countdown timer in sale events, and promotions to boost sales, and improve traffic and revenue.  Let’s find out the WooCommerce countdown timer plugin from VillaTheme.

Sales Countdown Timer is a plugin that allows shop owners to increase sales in Sale Campaigns. Using shortcodes, the plugin can display a WooCommerce countdown timer on any page. It is a must-have plugin for encouraging customers to buy by instilling a sense of urgency in them.

 

Plugin main’s feature.

WooCommerce Countdown timer

The plugin displays sales countdown timers on single product pages and the shop page of WooCommerce. The clocks will notify customers when the sales end or how many sale product quantities are left. In WooCommerce single product, you can select Sales Countdown Timer settings and schedule sale campaigns.

  • Select Sales Countdown Timer profile in WooCommerce single product page, variation products, and select Sales Countdown Timer for bulk products.
  • Display countdown clock based on WooCommerce sale scheduled time.
  • Select specific sale time. WooCommerce allows you to schedule sale time by date. With Sale Countdown Timer you can select specific sale times by hours and minutes.
  • Position on single product pages: select where the countdown clock will be displayed on single product pages. There are many options for you to select: before product price, after product price, before the sale flash badges, after the sale flash badges, before the “Add to cart” button, after the “Add to cart” button, in the product picture.
  • Position in archive pages: select where will the countdown click appears in archive pages like the shop page, and categories pages. There are many options for you to select: before product price, after product price, before sale flash badges, after the sale flash badges, before the “add to cart” button, after the “add to cart” button, in the product picture.
  • Display in shop page, categories page, related products: you have options to choose display or hide the countdown clock on these pages.
  • Upcoming sale message: When you schedule a sale campaign in the future, you can choose to display an upcoming sale message on the single product page. The messages can be customized with a shortcode display of how much time is left until the sale time.
  • Sale ends message: display when will the sale finish the message with the shortcode {countdown_timer}.
  • Shortcode: the shortcode {countdown_timer} will display the countdown clock.

Sale Progress bar – Stock quantity bar

The plugin integrates a progress bar that displays how many products are available for the sale campaign, how many products are sold, and how many are left.

  • Progress bar message: Configure the sale progress bar message as you want with shortcodes.
  • Shortcodes:
    {quantity_left} – Number of products left
    {quantity_sold} – Number of products sold
    {percentage_left} – Percentage of products left
    {percentage_sold} – Percentage of products sold
    {goal} – The goal that you set on the single product page
  • Progress bar type: select to display the sale progress as increase or decrease.
  • Order status: select what order status will be counted in the progress bar.
  • Position: there are 2 positions for the sale progress bar above the countdown clock and below the countdown clock.
  • Design: configure the front end of the progress bar with options for width, height, background color, text color, and border radius.

Shortcode Countdown Timer

The plugin does not require WooCommerce to work. You can display countdown clocks anywhere by using shortcodes. Settings for Countdown Timer shortcode are similar to the WooCommerce Countdown Timer, the difference is that WooCommerce Countdown Timer displays WooCommerce sale time, and the Countdown Timer shortcode displays your chosen time. You can learn how to use shortcode to create a sale countdown timer here

  • Display countdown timer by shortcodes.
  • Select countdown time in the plugin backend.

Multiple setting profiles

The plugin allows you to set up as many Countdown Timer profiles as you want. Each profile is completely a standalone Sales Countdown Timer. With each profile, you can set up full settings including General settings, Design settings.

Checkout countdown timer

  • Set the checkout countdown timer for a minimum cart total to get a special offer.
  • The reset mode will be applied only to Administrators for testing purposes.
  • Reset checkout countdown for a cart after this time if the customer does not place the order during the checkout countdown.
  • Give offers before the checkout countdown timer hits zero: Free shipping and/or discount amount (percentage/fixed amount).
  • Integrates options that allow you to change offers when the countdown timer hits specific values.
  • Assign pages where the checkout countdown timer shows up.
  • Design the checkout countdown timer on the checkout page and other assigned pages.

Design

Feel free to design the sales countdown timer to fit with your front end.

  • Time display: select the time separator style and time format style.
  • Countdown timer clock design: configure front-end style with text color, background color, border color, padding, and border-radius.
  • Countdown timer item design: design the items inside the countdown timer, such as the date item, and hour item.
  • Design the time value: time value includes the time number and unit. Customizing it with font size, text color, and background color.

System Requires:

Make sure that those limits to a minimum as follows in order for free-trouble while installing:

  • WordPress 5.0+
  • PHP 7.0+
  • WooCommerce 7.0+

Download Plugin:

Go to Plugin/Add New/Upload Plugin/Choose file/ select plugin zip file sale-countdown-timer /click “Install Now“/click “Active plugin“.

Done! Let’s start using the plugin.

Guiding video on how to install and set up:

WooCommerce Sales Countdown Timer

To use the WooCommerce Sales Countdown Timer feature, you need to configure a Sale Countdown Timer profile in Dashboard/ Countdown Timer then assign that profile to a product.

Set up a Sales Countdown Timer with General Settings, Design and WooCommerce Product settings. We will discuss more details about these settings in How does it work chapter.

After configuring settings, go to any product edit page to assign the Sales Countdown Timer to that product.

In a single product edit page,you need to assign a Sales Countdown Timer profile to that product.

  1. Regular price: Enter the regular price of the product
  2. Sale price: Enter the sale price of the product
  3. Sale price dates and times: Enter the sale dates and times for above the sale price. With these time installed, Sales countdown timer plugin runs the sales countdown timer on the product.
  4. Countdown evergreen: Enable this option to make the countdown loops when it ends
  5. Restart countdown after: If “Countdown evergreen” enabled, how long the countdown timer restarts after it ends
  6. Countdown Timer profile: Allows you to choose a countdown timer profile which was created and designed at the above step. Select the profile you want to assign to this product there.
  7. Enable the progress bar: Check on it to display how many products are left in your sale campaign.
  8. When achieving the goal: When the sale countdown is over, turn to respective status: None; Back to regular price; Private product; Out of stock.
  9. Goal: Enter the total sale products you want to sell in this campaign.
  10. Initial quantity: Enter the initial quantity when the sale campaign starts.

To set bulk sales countdown timer for variable products:

Set the sale time for variable products: Go to any variation product page/Product data/ Variation and set sale time for the variations you want.

1. Enter sale price for each variation of variable product.

2. Schedule time for sales countdown timer: sale start date and sale time date.

3. Check on for enabling Countdown evergreen.

4. Choose the countdown timer profile.

To change the sales countdown timer profile, price… for many variations,  go to Products/ All products/ filter Variable products, then select the variable products that you want to bulk set sales countdown timer.

In the Bulk Actions field select Edit/ Apply, then you can set bulk sales countdown timer for the variable products.

Sales Countdown Timer Shortcode

This plugin supports 2 shortcodes which:

A. Display a countdown timer

B. Display a list of products with active sale countdown timers

A. Shortcodes to display a sale countdown timer on any page

If the start date/time for the timer linked to the shortcode is set in the future, the timer will not be visible on the frontend. To display a countdown for an upcoming sale (i.e., a countdown to the sale start time), add this parameter to the shortcode: countdown_upcoming_enable

E.g. [sales_countdown_timer id="salescountdowntimer" countdown_upcoming_enable="1"]

Steps to get the countdown timer shortcode:

  1. Go to Dashboard >> Countdown Timer >> Select the countdown timer you want to dipslay
  2. Hover your mouse over the above corner on the right and copy the countdown timer shortcode by the button “Copy shortcode”
  3. Paste the shortcode to any pages
  4. Then the countdown timer will appear on the front-end.

B. The shortcode to display a list of products with active sale countdown timers

Besides, we support a shortcode to display all products which have sale countdown timers: [sales_countdown_timer_list]

 

COUNTDOWN TIMER

General Settings

In the General settings tab of the Countdown timer, you can add new or remove the Sales Countdown Timer profile.

  1. These buttons will appear when you hover your mouse over the header of the Sale Countdown Timer plugin.
    Copy shortcode: Copy the shortcode to display the countdown timer on the pages you want.
    Duplicate: Duplicate this Sale Countdown Timer profile.
    Remove: Delete this Sale Countdown Timer profile.
  2. The Sale Countdown Timer profile name. Enter a name for new countdown timer profile then you can find the sales countdown profile when selecting on the single product page.
  3. Schedule time: Set the time countdown schedule for your sales campaign.
  4.  Countdown evergreen: Enable this option to make the countdown loops when it ends.
  5. Restart countdown after: If “Countdown evergreen” enabled, how long the countdown timer restarts after it ends.
  6. Choose the time unit for restarting  the countdown.

Design

In Design settings, you can configure how the sales countdown timer looks like in front-end.

  1. Message: the text message appears on Sales countdown timer
  2. Reduce the size of the countdown timer on: Customize the size of countdown timer on the product list, mobile or sticky.
  3. Reduce the size of the countdown timer on: Customize the size of countdown timer on the product list, mobile or sticky.
  4. Message position: Choose the position for the message: Default or the same line as the countdown timer.
  5. Time units: Choose the time units displayed:  Day, hour, minute, second.
  6. Time separator: Choose the separator between time units: Bank, colon(:), comma(,),  dot(.).
  7. Datetime format style: Choose the format style for time.
  8. Animation style: Choose the animation style for Countdown timer: Default, slide, 3D Flip.
  9. Countdown timer preview: Allow to preview the Countdown timer as designing.
  10. Layout: Design Color, Fontsize, Border, Padding for layout of countdown timer.
  11. Layout  on sticky: Design Color, Width, Content for layout of countdown timer sticky.
  12. Datetime value: Design Color, Width, Height, Border, Fontsize… for Date time value
  13. Date time unit: Design Position, Color, Fontsize, Distance for date time units.

WooCommerce Product Settings

In this Settings, you can configure to display the Sales Countdown Timer on WooCommerce pages.

1. Display countdown timer on the single product page

– Position: Choose the position for countdown timer on the single product page: above sale flash; below sale flash; above cart; below cart; above product image.

– Sticky when scrolling: Choose the type of sticky when scrolling: None, sticky top, sticky bottom.

– Show or not show “Add to cart” button on the sticky countdown.

2. Display countdown timer on Shop page

Important note:

To handle WP’s Conditional Tags, this plugin uses eval() which is very dangerous because it allows the execution of arbitrary PHP code. Therefore, please only fill this field with proper conditional tags which are validated and/or provided by trusted developers.

– Enable: To activate this option.

– Show on: to assign which pages to show countdown timer. You can use Page’s ID, Title or Slug. Example:

is_page(‘Home’)

is_page(50)

is_page(array(‘Home’,50,75))

– Position: Choose the position of countdown timer on shop page: above sale flash; below sale flash; above cart; below cart; above product image.

Settings for Progress bar

3. Progress bar message: What the text message will be displayed.

4. Progress bar type:  Choose the way the progress bar will be displayed: Increase; Decrease

5. Order status: Choose the order status will be counted in the progress bar: Completed; On-hold; Pending; Processing; Failed; Refunded; Cancelled.

6. Progress bar position: Chooose the position of the progress bar:  Above countdown; Below countdown.

7. Progress bar message position: Choose the position of Progress bar message: Above the progress bar; Below the progress bar; in the progress bar.

8. Design: Design the progress bar with background color, text color, and border-radius

9. Upcoming sale: Enable to activate.

CHECKOUT COUNTDOWN

General settings

In the general setting of the checkout countdown, you can set the checkout countdown timer for a minimum cart total to get a special offer.

 

  1. Enable: Enable to activate the option.
  2. Reset countdown: Enter the number of days and after this time the countdown checkout timer will be reseted if customers does not place order during checkout countdown.
  3. Countdown time: The maximum valid time that this offer bellow is applied. When the timer hits zero, the offer will be gone.
  4. Starting condition: The action at which starting a checkout countdown if a cart is eligible to get an offer. It can be when adding to cart;  To checkout page; To cart page.
  5. Min cart total: minimum in cart total to get an offer.
  6. Checkout countdown offer: Customers will get free shipping before the checkout countdown timer hits zero.
  7. Discount amount: Customers will get discount amount (percentage/fixed amount) before the checkout countdown timer hits zero.
  8. Level discount: choose Auto change mode when you want the discount amount will autochange if the countdown timer hits specific values.
  9. Change discount every: Enter a duration for changing discount.
  10. Decrease discount amount: Enter the percentages you want to decrease after the countdown timer hits specific values.
  11. Test mode: The checkout countdown will be applied only to Administrators for testing purposes.
  12. Reset checkout countdown: Reset current checkout discount applied to your account when the Test mode is enabled.

 

  • Customize the offer: Create your own levels that you want to change the offer, the message can be customized for each level

 

  1. Choose the Custom mode for using Level discount.
  2. Custom checkout countdown for each level as you want: time for each level, message on checkout page, message on other pages, offer free shipping or not, discount amount.

* You can duplicate the custom checkout countdown level to add other countdown levels.

Display checkout countdown

This setting allows you to design the checkout countdown and assign pages the checkout countdown will show up.

  1. Display countdown timer on: Select pages to show checkout countdown. Leave blank to show checkout countdown on all pages. Other than specific pages supported:
    • Checkout page
    • Cart page
    • Shop page
    • My Account page
    • Home page
    • Single product page
    • Category page
    • You can display checkout countdown on a specific page using “Other Page” option with conditional tags or URL
  2. Design checkout button on checkout countdown timer: Title, Font size, text color, background.
  3. Design shop button on checkout countdown timer: Title, Font size, text color, background.
  4. Test mode: Enable it to make the checkout countdown to apply to only Adminstrators for testing purpose.
  5. Reset checkout countdown: Reset current checkout discount applied to your account when test mode is enabled.

Design on Checkout page

This setting allows you to design the checkout countdown timer on the checkout page. 

  1. Checkout countdown message: Customize the message that appears on the countdown timer on the checkout page.
  2. Message if missing offer: Customize the message appearing on the countdown timer on the checkout page if the offer is going to be over.
  3. Shortcode available: Customize the text message in the countdown timer on the checkout page.
  4. Position: Put the position of the countdown timer on the checkout page.
  5. Select countdown timer: Select the countdown timer profile that you created to show up on the checkout page.
  6. Action after finish countdown: When it’s done counting down on Checkout page, make the whole Checkout page refresh or only refresh the order review, to update product price without discount.
  7. Test mode: Enable it to make the checkout countdown to be applied only to Administrator for testing purpose.
  8. Reset checkout countdown: Reset current checkout discount applied to your account when Test mode is enabled.

Design on other page

This setting allows you to design the checkout countdown timer on the other page.

1. Checkout countdown message: Customize the message that appears on the countdown timer on an assigned page.

2. Message if missing offer: Customize the message appearing on the countdown timer on the assigned page if the offer is going to be over.

3. Shortcode available: Customize the text message in the countdown timer on the assigned page.

4. Position: Put the position of the countdown timer on the assigned page.

5. Select countdown timer: Select the countdown timer profile that you created to show up on the assigned page.

6. Test mode: The checkout countdown will be applied only to Administrators for testing purpose

7. Reset check out countdown: Reset current checkout discount applied to your account when Test mode is enabled

Report

Go to Dashboard/Countdown Timer/ Checkout Countdown/ Report 

  1. Save Logs: If you enable save Logs, then Logs will be saved. Save logs helps system stores information when visitors click on the checkout countdown timer. Then admin site could have
    statistics of number clicks and analysis fluctuation sales. Report system allows to view statistic number clicks by clicking checkout button, orders on sale countdown and orders.
  2. History time: the time that history will be kept.
  3. Test mode: Enable it for only testing purpose.
  4. Reset checkout countdown: Click to reset checkout discount applied to your account when Test mode is enabled.

 

Plugin Author Compatible
WooCommerce Subscription v3.0.7  WooCommerce
Elementor for shortcode Elementor Fully
WPML OnTheGoSystems Fully
Polylang WP SYNTEX Fully

 

Watch this tutorial to set up Sales Countdown Timer for WooCommerce and WordPress with multilingual plugin

 

 

Extra Information


Thank you for your attention!

If you have any question, please create a topic at our FORUM, we will support within 24 hours.