As of 23-Dec-2023 Webflow Localization doesn't localize CMS date fields.
This article explores approaches you might be able to take to resolve this if it's a significant issue on your site.
Problems to Consider
Non-Specific Locales
Depending on how you've setup Localization, you may only have a language code like en, which won't always be specific enough.
For example, en-US and en-GB format dates differently, so if the en locale is selected, which should it show?
I've not tested this however the best practice is likely to always use a specific locale like en-GB, even if you simplify the locale path to e.g. /en.
Dates within Text
If you have dates within text, they may be at the mercy of the machine translator as to what happens to them. If they are not translated, then you could use a similar process as above, in combination with a regex replace.
However, your date formats would have to be extremely consistent which is a big ask in handwritten text.
In general I'd leave these as a lost cause and hopefully Webflow can remedy any limitations there.
Timezones
Depending on the information you're trying to convey, formatting a date may not be enough. You may need to adjust it to the viewer's timezone as well, which cannot always be determined by the locale alone.
A good example here is an online schedule of streaming video events.
At the very least, make certain to always display the timezone for the visitor's reference.
Using Javascript
Modern browsers have the ability to localize dates using the Intl.DateTimeFormat() function, and Webflow indicates the currently selected locale in the <html lang="x"> attribute.
The rest is gluing them together;
- Pull the current language from the html lang attribute
- Get your current date and parse it- Date.parse could work but you may want to use a library like date-fns
- Localize your date to the desired locale
- Write the contents back
Here's some partial code for reference;
Notes
FAQs
Answers to frequently asked questions.
