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:

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

You May Also Like

Join the discussion 7 Comments

  • Douglas says:

    Thanks for submitting and for encouraging others to do the same! Your blog looks great.

  • Hi Douglas, thanks for stopping by and making a comment. Glad you like my site ;)


  • Gennice says:

    Wow, this blog design is amazing! Very nicely done.
    Could you please tell me where you got this social bookmarking plugin with large icons? I was searching for something like this long time but never found. I really need it for my blog.
    Thanks in advance!

  • Hi Gennice,

    The plugin is “Sociable” ( http://yoast.com/wordpress/sociable/ ) however, it comes with tiny icons for all the social-sites, so I’ve replaced them with these big icons you like from another plugin called “Add To This” ( http://www.sajithmr.com/plugins/ ).

    Just download both, and then copy the big icon files from Add to This into the Sociable images folder and replace the ones you want. You shouldn’t need to change any CSS in socialise then, it just leaves the images the right size by default (I think?). If it doesn’t, go into the sociable plugin .php file and look around for a ’16’ number which is the size of the icon display and replace all instances of it with ’48’ (which is the size of my icons above).

    If you’re feeling lazy, feel free to just right-click and steal all my icons from above and copy them into your Sociable plugin folder :)

    Glad you like me site! Cheers.

  • really interested in a blog redesign just like follow the winds…we are an art and lit collective. check us out

  • @ NC Lowbrow Collective – cool site!

    If you’re interested in a redesign I can help you out on that front. Shoot me an email at seanobrien[at]aus120.com about it if you like.

    I’ve been working with Arthemia Premium theme quite a bit recently (which is what FollowTheWinds.com uses) and I’m now also an official Woo-Worker at WooThemes.com and can do some cool mods of their themes too … cheers.

  • Hey Sean,

    The site is looking really smooth – I’m jelous!

    Seriously inspirational thou, it’s great what can be done with wordpress.


    Xilarate Admin.

Leave a Reply