WordPress plugins are a great way to get what you need for your website without actually doing any coding. There are so many WordPress plugins that you don’t actually need to write code for anything. Having said that, I would also like to add that there are times when you do need to add some customization to make the plugin cater to your needs.
I needed to display award deadlines on a website and hence I simply searched for the timer plugins. And there were many. But none of them used client’s time. I would want that when I see a deadline, that is according to my time and not of some computer located God knows where.
The first thing that I needed was to select a timer that matched with my design, was lightweight and easy to customize. My choice was T(-) Countdown timer. Its simple, elegant and you can use shortcodes to display the timer anywhere you want. I made a few changes and the timer was up and running beautifully within minutes. But I noticed something fishy about the time that is displayed. It wasn’t showing my time. Since it showed time remaining in hours, minutes and seconds also, you can easily spot the difference.
So, my task was to Make T(-) Countdown timer display local time instead of the server time. On checking the plugin’s file I found out that it used PHP to fetch time Hence, it returned server time and not local time.
// Gets Server Time
$response = array( 'now' => date( 'n/j/Y H:i:s', strtotime(current_time('mysql'))));
echo "var tminusnow = '".json_encode($response)."';\n";
echo "</script>";All I needed to do was use Javascript to get time just convert it into the format that was required. So, to get local time instead of server time in T(-) Countdown timer, you just need to replace the above code with the code given below in function plugin_head_inject(). Please note that leave the rest of the code in the function as it is.
// Gets Client Time
echo "var x = new Date();\n";
echo "console.log('Date'+x);";
// Need to format the date so that it looks exactly like the one that was fetched from the server
echo "var current_date=x.getMonth()+1+\"/\"+x.getDate()+\"/\"+x.getFullYear()+\"\"+x.getHours()+\":\"
+x.getMinutes()+\":\"+x.getSeconds();\n";
echo "var tminusnow=\"{\\\"now\\\":\\\"\"+current_date+\"\\\"}\";\n";
echo "</script>";
So, this is all you need to do to make your timer fetch local date instead of the server date. If you have any doubts or suggestions, please write in the comment sections below and I will be happy to help.
