{"id":5147,"date":"2025-09-27T21:00:06","date_gmt":"2025-09-27T20:00:06","guid":{"rendered":"https:\/\/ibex.tech\/cloud\/?p=5147"},"modified":"2026-03-05T20:18:12","modified_gmt":"2026-03-05T20:18:12","slug":"displaying-in-browser-local-time-zone","status":"publish","type":"post","link":"https:\/\/ibex.tech\/cloud\/php\/date-and-time\/displaying-in-browser-local-time-zone","title":{"rendered":"Local time zone display using browser time"},"content":{"rendered":"\n<p>The browser timezone isn&#8217;t passed to the server, so you have to do it in javascript.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Local Date and Time from UTF<\/h4>\n\n\n\n<pre class=\"wp-block-code\"><code>  \/\/----- CONVERT UTF DATETIME TO BROWSER LOCAL TIMEZONE DATE AND TIME -----\n  \/\/E.g. &lt;span class=\"ShowInLocalDatetime\"&gt;2028-12-14 23:50:00&lt;\/span&gt;\n  $HtmlOutput .= &lt;&lt;&lt;_END\n    &lt;script&gt;\n      function RenderLocalDatetimes()\n      {\n        const elements = document.querySelectorAll(\".ShowInLocalDatetime\");    \/*Get all with class=\"ShowInLocalDatetime\" *\/\n        elements.forEach(el =&gt; {\n          let utcString = el.textContent.trim();\n          if (utcString === '')\n            return;\n          utcString = el.textContent.trim().replace(\" \", \"T\") + \"Z\";\n          const dt = new Date(utcString);\n\n          \/\/Force format: 12 December 2025 23:14\n          const formatted = dt.toLocaleString(\"en-GB\", {\n            day: \"2-digit\",\n            month: \"long\",\n            year: \"numeric\",\n            hour: \"2-digit\",\n            minute: \"2-digit\",\n            hour12: false\n          }).replace(\",\", \"\").replace(\"at\", \"\"); \/\/ remove ',' and 'at' if locale inserts one\n          el.textContent = formatted;\n        });\n      }\n      \/\/ Call it once DOM is ready\n      document.addEventListener(\"DOMContentLoaded\", RenderLocalDatetimes);\n    &lt;\/script&gt;\n_END;<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">Local Date only from UTF<\/h4>\n\n\n\n<pre class=\"wp-block-code\"><code>  \/\/----- CONVERT UTF DATETIME TO BROWSER LOCAL TIMEZONE DATE ONLY -----\n  \/\/E.g. &lt;span class=\"ShowInLocalDate\">2028-12-14 23:50:00&lt;\/span>\n  $HtmlOutput .= &lt;&lt;&lt;_END\n    &lt;script>\n      function RenderLocalDate()\n      {\n        const elements = document.querySelectorAll(\".ShowInLocalDate\");    \/*Get all with class=\"ShowInLocalDate\" *\/\n        elements.forEach(el => {\n          let utcString = el.textContent.trim();\n          if (utcString === '')\n            return;\n          utcString = el.textContent.trim().replace(\" \", \"T\") + \"Z\";\n          const dt = new Date(utcString);\n\n          \/\/Force format: 12 December 2025\n          const formatted = dt.toLocaleDateString(\"en-GB\", {\n            day: \"2-digit\",\n            month: \"long\",\n            year: \"numeric\"\n          });\n\n          el.textContent = formatted;\n        });\n      }\n      \/\/Call it once DOM is ready\n      document.addEventListener(\"DOMContentLoaded\", RenderLocalDate);\n    &lt;\/script>\n_END;<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>The browser timezone isn&#8217;t passed to the server, so you have to do it in javascript. Local Date and Time from UTF Local Date only from UTF<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[21],"tags":[],"class_list":["post-5147","post","type-post","status-publish","format-standard","hentry","category-date-and-time"],"_links":{"self":[{"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/posts\/5147","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/comments?post=5147"}],"version-history":[{"count":8,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/posts\/5147\/revisions"}],"predecessor-version":[{"id":5312,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/posts\/5147\/revisions\/5312"}],"wp:attachment":[{"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/media?parent=5147"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/categories?post=5147"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/tags?post=5147"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}