WooCommerce Product Page Countdown Timer

Pre-Requisites

There are no pre-requisites in order for you to be able to implement this solution.

How To Implement This Solution?

Simply copy the pre-coded solution to your active theme’s functions.php or preferably the Code Snippets Plugin.

Need support with the snippet? We’re Here to Help You, Contact Us!

About This Solution

This quick guide shows you how to add a countdown timer to your product page template under the products terms (categories and tags). This guide uses a product ID to target a particular product page so that you don’t have a countdown timer on every page.

/*
* Snippet Name:
* Snippet Author: ecommercehints.com with props to www.w3schools.com for the JS countdown
*/

function action_woocommerce_share() {
	global $product;
    if ( 15 === $product->get_id() ) { // The product ID to show the countdown timer
    echo
        '<style>
#timer {
  font-size: 20px;
  padding-top: 10px;
  color:red;
}
</style><p id="timer"></p><script>
// Set the date we are counting down to
var countDownDate = new Date("Jan 5, 2022 15:37:25").getTime();

// Update the count down every 1 second
var x = setInterval(function() {

  // Get date and time for today
  var now = new Date().getTime();

  // Find the distance between now and the count down date
  var distance = countDownDate - now;

  // Time calculations for days, hours, minutes and seconds
  var days = Math.floor(distance / (1000 * 60 * 60 * 24));
  var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
  var seconds = Math.floor((distance % (1000 * 60)) / 1000);

  // Output the result in an element with id="timer"
  document.getElementById("timer").innerHTML = "Available for:<br>"+ days + " days  " + hours + " hours  "
  + minutes + " minutes  " + seconds + " seconds ";

  // If the count down is over, write some text
  if (distance < 0) {
    clearInterval(x);
    document.getElementById("timer").innerHTML = "PRODUCT NO LONGER AVAILABLE";
  }
}, 1000);
</script>';
}};

// add the action
add_action( 'woocommerce_share', 'action_woocommerce_share', 10, 0 );