How can I change the language of publication dates in Webflow CMS collection from English to Portuguese?
TL;DR
- Use Webflow’s date field with a custom attribute (e.g., data-date) to store the raw CMS date.
- Add JavaScript using Intl.DateTimeFormat('pt-PT') to convert and display the date in Portuguese on publish.
To change the language of publication dates in a Webflow CMS collection from English to Portuguese, you need to manually control the date formatting using Webflow's date settings or custom code.
1. Use Webflow CMS Date Formatting Options
- When inserting a Date field from your CMS collection, click the settings/gear icon on the element.
- Under the Format dropdown, Webflow provides options like January 1, 2024 or 1 Jan 2024.
- These formats are in English only, and Webflow does not currently support localized date formats directly in the Designer.
2. Use a Custom JavaScript Localization Method
To properly display dates in Portuguese, you'll need to convert the CMS date using custom JavaScript.
- Add a custom attribute to your date element in Webflow (e.g.,
data-datewith the raw ISO date from the CMS like2024-01-01). - Use JavaScript's
Intl.DateTimeFormatwith thept-PTlocale to reformat it.
Example method:
- In your Webflow page settings, under Before </body> tag, add a script that:
- Selects all date elements with the
data-dateattribute - Parses the date
- Converts and replaces its content using
Intl.DateTimeFormat('pt-PT')
3. Important Considerations
- This method requires publishing the site to a custom domain or Webflow.io to see the JavaScript in action.
- Webflow's native controls do not support multilingual date rendering, so this custom script is the most accurate solution.
Summary
Webflow does not natively support displaying CMS collection dates in Portuguese. To localize dates, you must use custom JavaScript with Intl.DateTimeFormat('pt-PT') and apply it to elements with assigned data-date attributes containing the raw date from your CMS.
