Home Blog Dynamic Day Countdown with WordPress Shortcode or PHP

Dynamic Day Countdown with WordPress Shortcode or PHP


It’s often necessary to provide some sort of countdown to an event in WordPress – particularly in the marketing world where we’re often scheduling webcasts, live tutorials, and other edutainment. While we plan to provide about a dozen different countdown options, the first is the second most basic (the simplest is another scheduled post titled “Static Day Countdown with WordPress Shortcode or PHP“). Subsequent articles integrate existing countdown libraries for a very fancy rendering.

The Result

To count down to Sydney’s 2025 New Years Eve, we’ll use the shortcode of [countdown date="31st December 2025 11.59:59pm"]. The result: . With a little bit of style we can make it look a little more appealing.

WordPress Shortcode

Copy and paste the WordPress function into your theme's functions.php file or, if you sensibly have one installed, your custom functions plugin. You may optionally download and install our plugin from the bottom of of the page.

If you require shortcode to work in a sidebar widget, you'll have to enable the functionality with a filter. If you're using our custom functions plugin, you'll have that feature enabled by default.

Shortcode Attributes


The text is the string that is rendered once the expiry time has passed.


If you want to apply style to the countdown text, the style is applied to the span.


The date is a strtotime() compatible string of your target time. We used date="31st December 2017 11.59:59pm" for our example, but something like date="20171231235959" would work as well. Date values separated by slash are assumed to be in American order: m/d/y, and those separated by dash are assumed to be in European order: d-m-y.


We calculate your end-time based on your server time. Once returned to the JavaScript function it’ll be updated based on your PC clock. It’s likely that your server will return a UTC (GMT time). To correct this, apply an offset. For example, Sydney is offset="10". For a negative offset, use a minus sign.


  • For a fixed event, a fixed UTC offset will obviously apply. For the same event in different timezones (such as New Years Eve), you might consider obtaining the offset via our API and applying that in your code.
  • For this simple countdown, the intent is that it’ll be used once on each page. Using multiple occurrences will produce erroneous results. Our future examples don’t suffer the same limitation.


Title: Dynamic Day Countdown with WordPress Shortcode or PHP
Description: Dynamic Day Countdown with WordPress Shortcode or PHP. Displays a simple JavaScript countdown with shortcode.
Download: Shortcode (V0.2) | WP Plugin (V0.2) | PHP Code (V0.2)

■ ■ ■

Interested in WordPress and Web Design? Subscribe to our list and we'll send you subscriber-only tools and plugins

Short URL for this post: http://shor.tt/19ou


Please enter your comment!
Please enter your name here