Webflow Localization

Locale-Specific Styles & Code

Overview
Known Localization Limitations & Bugs
001
Supported Languages
010
Tips & Techniques
Choosing the Right Locales
100
Localizing an Already-Localized Site
101
Localizing Dates
102
Localizing CMS Option Fields
103
Localizing Numbers & Currencies
104
Locale-Specific Styles & Code
105
Maintaining a Localized Site
106
Locale-Specific Pages & Sections
107
Localizing Form Success & Error Messages
107
Locale Switcher
The Locale List Element
401
Build a Dropdown Locale Switcher
402
Add Flags to the Locale Switcher
403
Add Localized Locale Names to the Locale Switcher
404
Make the Locale Switcher Responsive & Visible in your Nav
405
Advanced Localization
Splitting Locales by ccTLD
801
No items found.
Published
December 23, 2023
Updated
December 23, 2023
in lightbox

Webflow Enterprise has the ability to localize styles within the designer and create a unique experience for each locale.

But what about non-Enterprise users who just need simple styling, a new visible/hidden element, or a locale-specific script?

Styles

Use an embed with custom style code and the :lang() pseudoselector, e.g.;

Locale-Specific Fonts

This approach can be used to specify locale-specific fonts as well.

Build your site using the font you want for your default locale, for simplicity. Then use an HTML embed in your Nav or Footer symbol that specifies a font override for your alternate locales, e.g.;

Remember to ensure that all fonts are already installed on your site so that they're available. You will likely need to look at the generated CSS to determine how to specify the font, style and weight properly.

Scripts

Scripts cannot be suppressed from pages, but you can decide what logic to run based on the page locale.

Videos
No items found.
Table of Contents
Comments
Did we just make your life better?
Passion drives our long hours and late nights supporting the Webflow community. Click the button to show your love.