Localizing Numbers & Currencies

As of 23-Dec-2023 Webflow Localization doesn't localize CMS numeric fields, or currencies.

Numeric fields

How Locales Vary

Number formats can vary significantly across different locales, impacting how numbers are displayed, interpreted, and used. Here are some key aspects in which number formats differ:

1. Decimal Separator: In many countries, a period (.) is used as the decimal separator (e.g., 1234.56), but in many other countries, a comma (,) is used instead (e.g., 1234,56). This difference is particularly notable between English-speaking countries and many European and Latin American countries.
2. Thousands Separator: Similarly, the separator used for thousands varies. In English-speaking countries, a comma is common (e.g., 1,234), whereas in many European countries, a period or a space is used (e.g., 1.234 or 1 234).
3. Negative Numbers: The placement of the negative sign can differ. Most commonly, it's placed before the number (e.g., -123), but in some formats, it might be placed after the number or enclosed in parentheses (e.g., 123- or (123)).
4. Digit Grouping: The grouping of digits in large numbers can vary. While grouping by thousands is common (e.g., 1,000,000), some countries group digits in different patterns.
5. Fractional Numbers: The representation of fractional numbers can differ. For example, in the U.S., it's common to use fractions (e.g., ½), while in many other places, decimals are more commonly used.
6. Currency Formatting: When displaying currency, the position of the currency symbol varies (e.g., $100 in the US vs 100€ in many European countries). Additionally, the formatting of the number itself follows the local numeric conventions.
7. Date and Time Formats: While not strictly numbers, the representation of dates and times often intertwines with numeric formats and varies significantly across cultures.
8. Percentage Format: The placement of the percentage sign can vary, either before or after the number, and spacing rules can also differ.

This article explores approaches you might be able to take to resolve this if it's a significant issue on your site.

Javascript Approach

Requires programming knowledge.

If you can retrieve the numbers you need from the page, you can localize them using Javascript's built-in _{Intl.NumberFormat} functions.

_{const number = 1234567.89;}

_{// Format as a German number}

_{console.log(new Intl.NumberFormat('de-DE').format(number)); // "1.234.567,89"}

Currencies

Currency conversion is even more problematic, because you can't just change the formatting of the currency to localize it.

Even if an exchange-rate feature were built directly into Webflow, it would never solve all the needs that site owners will have.

Most likely, this is why Webflow's ECommerce does not yet support localization... it's too complex to auto-convert prices as the rules are too varied.

Javascript Approach

However, if you're intending to build a conversion solution, look into;

• Money.js: A simple JavaScript library that can convert a money value from any currency to any other currency[1].
• CurrencyLayer: A real-time JSON API for 168 world currencies that provides accurate conversions through reliable and stable FX data[2].
• Open Exchange Rates: A simple and easy-to-use API that provides real-time and historical exchange rates for 170+ currencies[4].
• Xignite: A cloud-based financial market data API that provides real-time and historical foreign exchange rates for over 170 currencies[4].
• ExchangeRate-API: A simple and lightweight API that provides real-time exchange rates for 170+ currencies[4].

These tools and libraries can help developers and businesses convert currencies and exchange them easily and quickly. They provide accurate and reliable data, making it easier for businesses to stay updated with current rates and convert or compare currencies.

Citations:
[1] http://openexchangerates.github.io/money.js/
‍[2] https://geekflare.com/best-currency-exchange-apis/
‍[3] https://nordicapis.com/10-apis-for-currency-exchange-rates/
‍[4] https://www.abstractapi.com/guides/best-exchange-rates-apis
‍[5] https://guides.lib.uchicago.edu/exchange_rates