WooCommerce显示计划优惠倒计时

在WooCommerce中，可以设置计划优惠，从开始到结束日期享受一定优惠，但是默认的却不显示优惠时间倒计时，于是我决定研究一下。写出了下面的代码：

add_filter("woocommerce_get_price_html",function($price_html){
    $sale_end_date = (int)get_post_meta(get_the_ID(), '_sale_price_dates_to', true);
    if($sale_end_date > time()){//在计划促销中
    $formatted_sale_end_date = date('Y-m-d H:i:s', $sale_end_date);
    return $price_html.'
    <span id="kekccountdown" style="float: right">
        <span class="D"></span>
        <span class="H"></span>
        <span class="M"></span>
        <span class="S"></span>
    </span>
    ';
    }else{
        return $price_html;
    }
});

add_action("wp_footer",function(){
    $sale_end_date = (int)get_post_meta(get_the_ID(), '_sale_price_dates_to', true);
    if($sale_end_date > time()){//在计划促销中
    $formatted_sale_end_date = date('Y-m-d H:i:s', $sale_end_date);
   echo '<script>
  var endTime = new Date("'.$formatted_sale_end_date.'").getTime();

  function updatekekcCountdown() {
    var now = new Date().getTime();
    var timeRemaining = endTime - now;

    var days = Math.floor(timeRemaining / (1000 * 60 * 60 * 24)) + "Days ";
    var hours = Math.floor((timeRemaining % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)) + "Hours ";
    var minutes = Math.floor((timeRemaining % (1000 * 60 * 60)) / (1000 * 60)) + "Min ";
    var seconds = Math.floor((timeRemaining % (1000 * 60)) / 1000) + "Sec";

    document.querySelector("#kekccountdown > .D").innerText = days;
    document.querySelector("#kekccountdown > .H").innerText = hours;
    document.querySelector("#kekccountdown > .M").innerText = minutes;
    document.querySelector("#kekccountdown > .S").innerText = seconds;
  }

  setInterval(updatekekcCountdown, 1000);
  updatekekcCountdown();
</script>';
}
});

woocommerce_get_price_html钩子可以改到简短描述里面，感觉兼容性更好。另外倒计时写的很简单，可以使用其他库或者写好的更加美观，也可以使用主题、插件自带的短代码。

可能你要对kekccountdown元素进行一些显示限制以及样式修改，我说几个重要的，只在单个产品的价格下显示

.kekccountdown{
display:none
}
.product-image-summary-wrap .kekccountdown{
display:block !important
}

最终我结合公司的业务进行了深改，写下来的样式是这样的，一个电脑端，一个手机端：