Countdown Timer Shortcode
Adds a [countdown] shortcode that shows a live days, hours, minutes and seconds countdown to a date, with a message once the time is up.
Opens WPIDE on
Code
add_shortcode( 'countdown', function ( $atts ) {
$atts = shortcode_atts( array( 'to' => '', 'expired' => 'Time is up!' ), $atts, 'countdown' );
$date = date_create( $atts['to'], wp_timezone() );
if ( ! $date ) {
return '';
}
$id = wp_unique_id( 'wpide-countdown-' );
$html = '<span id="' . esc_attr( $id ) . '" class="wpide-countdown" data-end="' . esc_attr( $date->getTimestamp() * 1000 ) . '" data-expired="' . esc_attr( $atts['expired'] ) . '"></span>';
$html .= '<script>(function(){var el=document.getElementById(' . wp_json_encode( $id ) . ');if(!el){return;}var end=parseInt(el.getAttribute("data-end"),10);function pad(n){return n<10?"0"+n:n;}function tick(){var left=end-Date.now();if(left<=0){el.textContent=el.getAttribute("data-expired");return;}var s=Math.floor(left/1000),d=Math.floor(s/86400),h=Math.floor(s%86400/3600),m=Math.floor(s%3600/60);el.textContent=d+"d "+pad(h)+"h "+pad(m)+"m "+pad(s%60)+"s";setTimeout(tick,1000);}tick();})();</script>';
return $html;
} );Notes
Example: [countdown to="2026-12-31 23:59" expired="The sale has ended."]. The date uses the site time zone.
How to add this snippet
- Install WPIDE on your WordPress site (it is free) and open Code Snippets.
- Use snippet above adds it from the library in one click. Or copy the code into a new snippet with the same code type.
- It is added inactive: review the code and settings, then switch it on.