Ravi Kiran Katha

WordPress has a site-level timezone setting configured from the admin back-end. All dates and times displayed on the front-end are typically displayed in this timezone.
This plugin enables the display of dates/times in the front-end using the browser’s timezone. This is done by overriding the WordPress’s ‘timezone_string’ and ‘gmt_offset’ options to match the user’s timezone for the duration of a particular request 
ONLY on the front-end interface.
<h4>Browser Timezone Detection</h4>
The browser’s timezone is detected using one of the following two methods
<ol>
<li><a href="http://pellepim.bitbucket.org/jstz/" rel="nofollow ugc">jsTimezoneDetect</a> (default)</li>
<li><a href="http://caniuse.com/geolocation" rel="nofollow ugc">HTML5 Geolocation API</a> and <a href="https://developers.google.com/maps/documentation/timezone" rel="nofollow ugc">Google Timezone API</a></li>
</ol>
jsTimezoneDetect (default) 
 This is the default timezone detection mechanism. Please refer to the script <a href="http://pellepim.bitbucket.org/jstz/" rel="nofollow ugc">home page</a> 
for the compatibility and other notes
HTML5 Geolocation API 
 Detects the current geo-location using <a href="http://caniuse.com/geolocation" rel="nofollow ugc">navigator.geolocation.getCurrentPosition</a>. The location thus detected will be sent to the <a href="https://developers.google.com/maps/documentation/timezone" rel="nofollow ugc">Google Timezone API</a> 
which returns the timezone id – similar to “Asia/Kolkata”.
This method requires you to
<ul>
<li>Enable the “Google Timezone API” option on the plugin options page</li>
<li>Specify a valid <a href="https://developers.google.com/maps/documentation/timezone/get-api-key" rel="nofollow ugc">Google API Key</a>
<ul>
<li>The key should be a browser key</li>
<li>The “Accepted HTTP Referrers” should include the domain name used by the hosting wordpress site or left blank to allow all referrers</li>
</ul>
</li>
</ul>
If the required options for the usage of Google Timezone API are not met, the detection mechanism falls back to the default one.
<h4>Post Timezone Detection</h4>
<ul>
<li>If the browser’s timezone id is not detected successfully, everything else behaves as if this plugin is not installed.</li>
<li>If the browser’s timezone id is detected, the following actions take place
<ul>
<li>A cookie will be set in the browser, based on the cookie options specified on the plugin options page</li>
<li>If a cookie already exists previously with the same id, no action is taken</li>
<li>If a cookie doesn’t already exist previously or exists with a different timezone id, then a window.reload is triggered to refresh the page so that the dates/times on the page are updated</li>
</ul>
</li>
</ul>
<h4>EventON Hook</h4>
This plugin provides a feature to hook into the EventON plugin. When enabled, all EventON dates/times are updated to reflect the browser’s timezone.
<h4>Shortcodes</h4>
This plugin defines the below shortcodes
<ol>
<li>[wp_user_timezone_id] => Returns the timezone id of the browser or null if not available.</li>
<li>[wp_user_timezone_offset] => Returns the timezone’s gmt offset in hours of the browser or null if not available.</li>
</ol>
<h4>Options</h4>
This plugin defines the below options to retrieve the original timezone_string and gmt_offset defined at the site level
<ol>
<li>get_option( ‘site_timezone_string’ ) => Returns the original timezone_string option for the site</li>
<li>get_option( ‘site_gmt_offset’ ) => Returns the original gmt_offset option for the site</li>
</ol>
<h4>Actions/Hooks</h4>
This plugin defines the below filters/hooks
<ol>
<li>apply_filters( ‘wp_user_timezone_id’, $tz_id ) => Allows you to override the timezone string determined by the plugin. This filter can be used to apply user’s timezone preference. If any plugin or wordpress core implements a feature to accept and store user’s preferred timezone, the ‘wp_user_timezone_id’ can be used to apply that timezone value to the front-end. Reference: <a href="https://core.trac.wordpress.org/ticket/18146" rel="nofollow ugc">Add user-level timezone setting</a>).</li>
</ol>
<h4>Admin Backend Dates/Times</h4>
Important: The admin back-end is not modified by this plugin. All dates/times displayed in the back-end are still in the original timezone specified by the WordPress General Settings.

WP User Timezone

Magnificent

WP User Timezone displays the front-end dates & times in the browser's local timezone without actually modifying your database.

JB Christy

This WordPress plugin adds the <code>[localize_time]</code> shortcode. The shortcode allows an author 
to enter a date and time in any timezone. The shortcode displays the original time with 
timezone, followed by the same time in the user’s timezone, formatted correctly for the 
user’s locale. This is useful for announcing live events, e.g. a live online streaming 
event, to widely dispersed audiences.
The date and time to be displayed are entered as the shortcode’s content, i.e. between the 
<code>[localize_time]</code> and <code>[/localize_time]</code> tags. The time can be specified in almost 
any format that’s recognizable as a date and time.
The shortcode takes the following options:
<ul>
<li><code>tz</code> – the timezone the shortcode’s content is in. If this option is omitted, it defaults 
to the site’s timezone. Timezones are specified in any format recognized by 
<a href="http://www.php.net/manual/en/timezones.php" rel="nofollow ugc">PHP’s DateTimeZone</a>.</li>
<li><code>fmt</code> – a format string specifying how the original time should be displayed. If omitted, 
it defaults to the site’s date format followed by the site’s time format followed by the 
timezone. To output the original time exactly as entered (with the timezone), specify 
<code>fmt="orig"</code>. Or you can enter a format string using the same codes that are used on 
WordPress’s General Settings tab. See 
<a href="https://codex.wordpress.org/Formatting_Date_and_Time" rel="nofollow ugc">full documentation on date / time format strings here</a>.</li>
<li><code>before_local</code> – the string to precede the local time. Defaults to ‘ (‘</li>
<li><code>after_local</code> – the string to follow the local time. Defaults to ‘)’</li>
</ul>
<h3>Examples</h3>
Below are examples of using the shortcode. For these examples, the site’s timezone is set to America/New_York (EST-5EDT) and the user is in the America/Los_Angeles (PST-8PDT) timezone.
<ul>
<li>
Local time is in a different year and month from original time: 
 [localize_time]1/1/2014 1:00 am[/localize_time] 
outputs: 
January 1, 2014 1:00 am EST (12/31/2013, 10:00:00 PM PST)
</li>
<li>
Specify a time in timezone different from the site’s: 
 [localize_time tz=”Europe/Paris” ]July 14, 2014 19:00[/localize_time] 
outputs: 
July 14, 2014 7:00 pm CEST (7/14/2014, 10:00:00 AM PDT)
</li>
<li>
Specify a format for the original time: 
 [localize_time fmt=”m/d/Y g:i A T”]June 14, 2014 6:30 AM[/localize_time] 
outputs: 
06/14/2014 6:30 AM EDT (6/14/2014, 3:30:00 AM PDT)
</li>
<li>
Specify a time in the same timezone as the user: 
 [localize_time tz=”PST”]3pm Nov. 1, 2014[/localize_time] 
outputs: 
November 1, 2014 3:00 pm PDT
</li>
</ul>
Note that the display of the local time varies by timezone and browser.

Localize Time

Provides a [localize_time] shortcode, which displays times in the user's local timezone.

WP User Timezone vs Localize Time