How can I change the language of publication dates in Webflow CMS collection from English to Portuguese?

To change the language of publication dates (e.g., "January 15, 2024") from English to Portuguese in a Webflow CMS Collection, you need to manually localize the date format.

1. Use Custom Code to Localize Dates

Webflow currently does not natively support multi-language date formatting, so you must use a small custom script to format CMS dates.

• Add a custom code embed (an Embed element or in the Page Settings footer) with JavaScript that uses the toLocaleDateString() method.
• This lets you change dates into Portuguese using pt-PT or pt-BR locale codes.

Example inline usage with JavaScript:

const dateElements = document.querySelectorAll('[data-date]');dateElements.forEach(el => {  const date = new Date(el.getAttribute('data-date'));  el.textContent = date.toLocaleDateString('pt-PT', {    year: 'numeric',    month: 'long',    day: 'numeric'  });});

Then in your Webflow CMS collection page, do this:

• Add a Plain Text block and connect it to the CMS date (e.g., Publish Date)
• Set a custom attribute: data-date
• In the inner text, use the raw ISO format (e.g., {{ Published Date }} without formatting)

This will let your custom script read the ISO date and convert it to Portuguese.

2. Option: Manually Format the Date (Static Content)

If you're not comfortable using code:

• In your CMS Collection, create a plain text field (e.g., “Formatted Date PT”) where you manually input the date in Portuguese.
• On the site, bind this text field instead of the system-generated Published Date.

This is not scalable, but works for a few items.

3. Third-Party Localization Tools (Advanced)

If your site has broader multilingual needs:

• Consider integrating tools like Weglot or Polyflow by Finsweet, which allow for full language switching, including date and number localization.
• Note: With these tools, you'll still need to format date elements in a way they can translate correctly.

Summary

Webflow CMS doesn't automatically localize dates, so you must use a custom JavaScript script with toLocaleDateString('pt-PT') for proper formatting. Alternatively, manually enter formatted dates or use third-party translation tools for full localization.