Streaming live at 10am (PST)

How to display time in visitor time zone?

Hello everyone and thank you for reading me :smiley:

I use CMS to publish my event calendar. I have fields for event start date/time and end date/time. How can I display these in my visitors local time?

I have updated my time zone in the General Settings.


Here is my public share link.

Thank you for your help :hugs:

1 Like

I have the same question. Following

2 Likes

By default time objects are set to the OS settings. To show dates/times from a UTC or another timezone to a users timezone you will probably want to leverage Moment and Moment Timezone javascript libraries.

I coded a dynamic display with incrementing countdown timers for a similar requirement of another Webflow user using these so I know it can be done.

1 Like

Sorry but do you mean that by default time is displayed in the user timezone?

I was speaking of a JavaScript date object which by default is in UTC. The basic methods to fetch the date and time or its components all work in the local (i.e. host system) time zone and offset.

If you want to take a date that is UTC and then display it in the users local time you need to know what that timezone is and what its current offset from UTC is. This is complicated due to the number of timezones and possible observation of daylight savings time. Moment lets you work with date/time in a more elegant way and provides an optional Moment Time Zone plugin that makes it easy to work timezones and provides databases to work with timezones now and in the future (depending on how far out you are needing to go).

1 Like

If the basic methods of the date object work on host system level, can’t he just compare the UTC time from the cms to the date object? Due to always knowing the cms delivers UTC?
Just wondering

If you store the date/time value as UTC then you can use the getTimeOffset() method to determine the difference and use that in a calculation for display. However, if you need to know what the current status of Daylight Savings Time is for the user to display it, you need data. Moment.js also makes it trivial to present date/time values in a multitude of ways without writing lots of code. The docs are quite comprehensive.

1 Like

Thank’s for the clarification!
Moment.js has been welcomed into my bookmark folder of JS libraries :grin: