WordPress: Use shortcodes to display the time in any city

Tutorial, Wordpress October 24, 2015 by

Recently on the new version of our agency website, we wanted to showcase the time in the footer of both of our offices, at different ends of the planet and completely different timezones; Brisbane, Australia and Warsaw, Poland.

Our site is built on WordPress and as we know, WordPress has a date function inbuilt that let’s you specify both the date format and time format, which then can be added to template files via the “get_date” function. The only problem with that is we can only specify one time; which is essentially the time our hosting server is using. We wanted to then show a second time for another city.

Wordpress time and date format

WordPress doesn’t have an option to do this but using shortcodes and some PHP, here’s the solution we are currently using on our site’s footer.

Brisbane Digital Footer

To achieve this, we’ve added 2 shortcodes to our functions.php file in our theme template. The first shortcode displays the time of our site using Warsaw local (GMT+2). The second, the time of our Brisbane office (GMT+10). To set the correct time we’ve used the PHP timezone function which you can input your own details to display any timezone worldwide.

To get the correct date output, we use “g:i a” which gives us a time like 10:52pm. To find a date format setting to suit your project use the WordPress codex on the formatting of date and time.

Now, you can add the shortcode right in to any WordPress page, post or widget and get the time output. The shortcodes to use are:

  • [date1]
  • [date2]

With a little bit of CSS styling using a class around the shortcodes you can format the output to any style you like. Or, if you’d like to just simply add it straight to a WordPress template file rather than use a shortcode, here’s an example of a snippet to use in your footer replacing a default widget input:

WAW

Let us know how you’re implementing the WordPress time or PHP time on your site.

You May Also Like