World Clock Widget for WordPress
A widget that can be easily set to display date and time of multiple timezones. The javascript function is taken from Proglogic and is written by Stijn Strickx. The code is then modified to fit widget format.
The Latest Version – 1.0.0 (for WordPress 3.2.1)
- Global settings for widget title, date and time format, and clock alignment.
- Add function.
- Edit function.
- XML based time zone data.
Download the Latest Version
Go to World Clock Widget download page at WordPress.org.
Installation
- Download
world-clock-widgetplugin and unzip it. - Upload the folder
world-clock-widgetto your WP plugin folder/wp-content/plugins/directory. - Go to Plugins > Installed, activate the plugin.
- Go to Appearance > Widgets, add the widget to a sidebar and save.
- Check the Frequently Asked Questions to learn how to add, edit and remove clocks.
Frequently Asked Questions
Screenshot?
What is Daylight Saving Time?
Daylight saving time is the convention of advancing clocks so that afternoons have more daylight and mornings have less. Click here for more information
Does world clock widget support Daylight Saving Time?
At the moment world clock widget supports only North America Region, i.e. Alaska, Atlantic time, Central time, Eastern time, Indiana (East), Mexico, Mountain time and Pacific time. More regions will be added in the future.
Does world clock widget cater the Daylight Saving Time for 2010?
Daylight Saving Time changes on yearly basis, at the moment world clock widget only supports year of 2009. Support for multiple years will be added in the future.
I go to the world clock widget control, how do I add a new clock?
Type your City name (for display purpose, name it whatever you want); Select yourTimezone; (Optional) Tick the Daylight Saving Time; Click Save.
How do I remove the existing clock(s)?
Under the Existing Clock, tick Remove (your_city_name); Click Save.
How do I edit the existing clock?
Under the Existing Clock, click on the clock that you want to edit; Click Save.
Craeser 
Anonymous
March 30, 2010
I really wanted to try this, but I can’t. When I tried to activate it at first I got a chaining error (my webhost uses PHP4). I fixed that in the PHP code and it activated, but now it won’t let me create a new clock. Unfortunately I have neither the time nor the PHP knowledge to fix this. I thought you’d want to be aware that this doesn’t seem to work with PHP4, or perhaps some other configuration problem at my webhost, but I’m betting on PHP4.
xandertan
March 31, 2010
Yes, the world clock widget is written using PHP5. It is kind of odd to know that your webhost provides only PHP4. Most of webhosts provide PHP5.
Anonymous
March 31, 2010
Hello again. This is the same guy as before. It turns out that while my webhost is PHP4 by default, it’s possible to use PHP5 instead, which I did. The clock still didn’t work, though, since my host has URL file-access disabled. Changing the line
$doc->load( $this->pluginurl . ‘/worldclock.xml’ );
to
$doc->load( WP_PLUGIN_DIR . ‘/world-clock-widget/worldclock.xml’ );
in worldclock.php fixed my problem though, and now it’s working great. Thanks for making it.
bertani
April 1, 2010
Hi Alex,
Sorry for the double post, but my first comment ignores the words with a special character.
I tried to test your world clock widget (version 0.7.0 and v0.7.1) , but the widget ignores the settings “dststart” and “dstend” in the worldclock.xml file.
Also on your site ” http://xandertan.selfip.org/dev/wp/2_8_0/ ” the dst function (->San Francisco) does not switch the displayed time, if i choose a date/time before or behind “dststart” / “dstend”. (Tested also with Pacific Time in my own blog with several years 2009 and 2010.)
For Example in the worldclock.xml file is … :
-> the dststart for Alaska (San Francisco) Mar 14, 2010 @ 3am (in v0.7.0 tested analogue with year 2009):
-> the PC time is Mar 12, 2010 5pm… (or 17:00) GMT
-> accordingly the displayed time for San Francisco is Mar 12, 2010 8am… (or 08:00)
…and now, if i switch the PC date/time to Mar 15, 2010 5pm… (or 17:00) GMT
-> the displayed time for SFO is Mar 15, 2010 8am… (or 08:00) again …instead of Mar 15, 2010 9am… (09:00), because the “dststart” should be from the 14th of march.
Do you have a solution for this effect? Why does the widget ignore all dst times from the worldclock.xml file?
Best regards
bertani
xandertan
April 3, 2010
Firstly, I would like to talk about my development site version 2.8.0, http://xandertan.selfip.org/dev/wp/2_8_0/
I found out that my San Fransisco clock showing the correct time. I captured a screenshot too (see the first picture in the attachment). So, I am not really sure why you said that my development site didn’t show the correct San Fransisco clock.
Secondly, I would try to address the problem with your world clock widget. The world clock widget DST setting only works if you check on the DST checkbox when you initialize the clock. If you did not check the “daylight saving time” checkbox (see the second picture in the attachment), any setting in the worldclock.xml will be ignored. So, could you please check whether you have it checked?
If you have checked it, then it is highly possible that my worldclock widget has another bug that I don’t see right now. Please update me with your finding.
Zh0nG
April 13, 2010
Here some of the DST for London and Paris for the 2010 year.
In fact, the rule for Paris is:
– Start DST the last sunday of march at 2am
– End DST the last sunday of october at 3am
It seems to be the same for London at 1am and 2am respectively…
Greenwich Mean Time : Dublin, Edinburgh, Lisbon, London
0
true
1,0,0,3,28,2010
2,0,0,10,31,2010
Brussels, Copenhagen, Madrid, Paris
1
+01:00
true
2,0,0,3,28,2010
3,0,0,10,31,2010
14ner
June 22, 2010
I was wondering how I can add a different clock to different post. Also is there a way to format the look of the clock?
Thanks,
14ner
dk
July 23, 2010
this is a great plugin! thanks! is there a way to make the clock run and display on a 12 hour clock, and indicate “AM” and “PM”?
xandertan
July 28, 2010
This is a good idea.
dk
July 24, 2010
also wondering, if there’s a function to add in the day of the week (ie Thursday, Friday)
xandertan
July 28, 2010
Another good idea.
xandertan
August 4, 2010
For those who wonders, my development server is currently down. Please be patient, as I am working on it, getting it back up again.
Lio
September 17, 2010
how to add this widget to my theme header?
Jesse
October 3, 2010
Hi, I love your simple but useful widget. I have a question. I want to align the text (or use padding, whatever) within the widget and possibly change the color of the “Date/Time” that is displayed. Do you have some code or directions you can give me on how to do this? Thank you for your effort.
Igor
February 26, 2011
Hey, I installed the widget, but it shows the wrong time.
its 11 am i Boston and it shows 19 PM of yesterday.
Igor
February 26, 2011
Ok, it looks like it takes the time from my own computer. i fixed this, but still the time shown in the widget is wrong.
Anybody help?
Igor
February 26, 2011
Ok Problem solved:
It requires for remove/add the plugin to get updated.
Also, it takes the time from your own computer, so if your own computer has the wrong time zone, the display will be bad.
All set!
naim
September 30, 2011
Good day,
We have your clock on our website (www.themanlygroup.com).
The analogue clock indicating the US Eastern Standard Time is not in sync with the digital clock below it and displays the incorrect time. Please correct this as soon as possible.
Regards
Naim Spocter
T +27-11- 258-8898
F +27-11- 258-8511
nspocter@TheManlyGroup.com
xandertan
October 1, 2011
Hi Naim Spocter,
Could you make sure that you chose “(GMT-05:00) Eastern Time (US and Canada)” and activated the “Daylight Saving Time”? I sent you an email with the screenshot.
Cheers
Xander Tan
wu0di1
December 17, 2011
HI XanderTan,
How can I appy it on my free wordpress.com site?
Thank you
Wu0Di1
xandertan
December 22, 2011
Hi WuoDi1, unfortunately, you can’t apply the widget on your free wordpress.com site. You should install it on your private wordpress server.
whatsnstore4u
December 24, 2011
I tried to install the World-Clock-Plugin to http://clickit-n-getit.com but did not activate it. This is what I got.
Warning: DOMDocument::load() [domdocument.load]: URL file-access is disabled in the server configuration in /home/content/80/8461780/html/wp-content/plugins/world-clock-widget/worldclock.php on line 131
Warning: DOMDocument::load(http://clickit-n-getit.com/wp-content/plugins/world-clock-widget/worldclock.xml) [domdocument.load]: failed to open stream: no suitable wrapper could be found in /home/content/80/8461780/html/wp-content/plugins/world-clock-widget/worldclock.php on line 131
Warning: DOMDocument::load() [domdocument.load]: I/O warning : failed to load external entity “http://clickit-n-getit.com/wp-content/plugins/world-clock-widget/worldclock.xml” in /home/content/80/8461780/html/wp-content/plugins/world-clock-widget/worldclock.php on line 131
Please can anyone help me fix or remove this problem with out starting my WordPress.org over. Thank you for your time. I can be reached at this e-mail whatsnstore4u[{at}]gmail.com
whatsnstore4u
December 25, 2011
Hello xandertan, I just wanted to let you know that I have fixed my problem with the World Clock Plugin. I had to wait for some time to pass before I went into my FTP and remove the file.
I hope you have a VERY NICE CHRISTMAS. I will stop by from time to time to see whats new.
Petra Fyde
April 23, 2012
Is there any way to update this for 2012? I can’t find an upto date world clock I like as well as this one.
Jenna
July 30, 2012
Hello XanderTan,
thank you for the plugin. Until now i’m using the version 0.7.1 and everything works fine.
Since yesterday i’m trying to use the new version 1.0.0 in order to have the option to use server time, instead of client time.
But unfortunately the Daylight Saving Times have no function (… for both: server and client time)
and there is always a time lag of 1 hour.
I tested the 1.0.0 version in the following environment:
– a fresh wordpress installation v3.2.1 and also v3.4.1
– only the world-clock-widget 1.0.0 installed and activated
– the data in the worldclock.xml are up to date …dststart’s and dstend’s are set to 2012
with the format:
<dststart>1,0,0,3,27,2012</dststart> <dstend>2,0,0,10,30,2012</dstend>– the “daylight saving time” checkbox in the widget is – naturally – checked
At first i had to modify the $doc->load section in the worldclock.php from
to
$doc->load('/webspace-path-to-plugins/world-clock-widget/worldclock.xml' );in order to get access to the .xml file.
This works fine (in both versions 0.7.1 and 1.0.0) – that followed i can see the timezone settings in the worldclock widget.
At the moment we have for London time ‘Daylight Saving Time’ but the widget ignores the DSt setting ‘true’ or even ‘false’ in the checkbox of the world-clock-widget.
In the html-sourcecode of the testblog i can see the following:
<aside id="world-clock-widget" class="widget WorldClock_displayWidget"> <h3 class="widget-title">World Clock</h3> <br> <div style="text-align:center;"> <strong>London</strong> <div id="city0"> Sun, Jul 29, 2012 <br> 16:46:06 </div> <br> </div> <script src="http://example.com/wp-content/plugins/world-clock-widget/date.js"> type="text/javascript"> </script> <script src="http://example.com/wp-content/plugins/world-clock-widget/worldclock.js"> type="text/javascript"> </script> </script type="text/javascript"> var dateformat="ddd, MMM dd, yyyy";var timeformat="HH:mm:ss";var serverclock=false;var gmttime=[2012,6,29,16,46,01];function worldClockWidget() {document.getElementById("city0").innerHTML=worldClock(0,false,dateformat,timeformat,serverclock);gmttime[5] += 1;setTimeout("worldClockWidget()",1000);}window.onload=worldClockWidget; </script> </aside> The London time should be '17:46:06 DST' (...it's the same effect with 16:46:06, both server time and client time, client time in my computer is naturally up to date 😉 ). The thing is: a) Why is the var gmttime=[2012,6,29,16,46,01] while it should be gmttime=[2012,7,29,16,46,01] ? and b) document.getElementById("city0").innerHTML =worldClock(0,false,dateformat,timeformat,serverclock) while it should be =worldClock(0,true,dateformat,timeformat,serverclock) whilst DST checkbox is activated in the widget ? I maked a test and set the document.getElementById("city0").innerHTML in the worldclock.php from: [code] echo 'document.getElementById("city'.$i.'").innerHTML=worldClock('.$this->timezones[$wc_clocks[$i]['tz']]['offset'].','.$dst.',dateformat,timeformat,serverclock);';to
echo 'document.getElementById("city'.$i.'").innerHTML=worldClock('.$this->timezones[$wc_clocks[$i]['tz']]['offset'].',true,dateformat,timeformat,serverclock);';So i set the point $dst definitely to true ...and afterwards this shows the right time 17:46:06 DST in my testblog!
So it seems that $dst doesn't get the right setting 'true' or 'false' from the checkbox in the worldclock widget. It's always 'false' equal if checkbox in the widget is checked or not.
As i said with v0.7.1 is everything ok, also $dst gets the right value from the DST checkbox in the widget but unfortunately in v1.0.0 it is not so.
Could you help please ?
Do you have an idea whats going wrong ?
Thank you in advance for your investigation.
Jenna
xandertan
August 2, 2012
gmttime=[2012,6,29,16,46,01]
Why is it ‘6’, not ‘7’? Because Javascript month is from 0-11. So, July is ‘6’.
Refer to: http://www.w3schools.com/jsref/jsref_getmonth.asp
xandertan
August 2, 2012
For the DST to be “true”, you need to set the XML file to be:
Greenwich Mean Time : Dublin, Edinburgh, Lisbon, London
0
true
1,0,0,3,25,2012
2,0,0,10,28,2012
Make sure that true
And… You need to enable the DST in your wordpress.
Drop me an email at xander_tan@users.sourceforge.net if you have any further questions.
Nabeel Tirmazi
August 1, 2012
Hi, since I updateed the plugin to 1.0 , the time on my site is not being displayed, any steps that I am missing?
xandertan
August 2, 2012
I sent an email to your gmail. If you don’t receive it, you can drop me an email at xander_tan@users.sourceforge.net. Cheers…
Jenna
August 26, 2012
Hello,
all of the data in the worldclock.xml file are set up – naturally – in the following format:
<worldclock> <display>City mind your own</display> <offset>0</offset> <offsetdisplay></offsetdisplay> <dst>true</dst> <dststart>2,0,0,3,25,2012</dststart> <dstend>2,0,0,10,28,2012</dstend> </worldclock>Also the “daylight saving time” checkbox in the widget is – naturally – checked.
The settings in the Widget and in the xml file are 100% correct.
In your version 1.0.0 is the value $dst on the following code-snippet always
‘false’ equal if DST checkbox in the widget is checked or not and even though
the setting in the xml-file is true:
echo 'document.getElementById("city'.$i.'").innerHTML=worldClock('.$this->timezones[$wc_clocks[$i]['tz']]['offset'].','.$dst.',dateformat,timeformat,serverclock);';Do you have a site where you can see the correct DST times with version 1.0.0 ?
Thank you for your investigation.
Jenna
Cole
December 7, 2012
Is there a way to remove the title all together?
I just want the city and time.
Thanks!