The Locale List Element

With Localization comes a new element named the Locale List.

The Locale List provides a Collection List-like element which can be used to present a list of all published locales, and which has some unique data-binding options to the elements within.

But it has a few limitations;

• All locale names appear to be in English, and cannot be overridden or localized within Webflow
• The order of items in the locales list apparently cannot be changed
• The switcher is text-based and it doesn't stand out, there's nothing visually appealing about it to draw attention. You can style it, but there's no native way for it to include art or country flags.

We weren't happy with those limitations, so we decided to fix them.

In the following lessons, we'll walk through our preferred build-out, which includes these features;

• A dropdown-style nav bar element
• Country flags to represent the locales we're supporting
• Localized locale names
• Solid mobile responsiveness

We have not yet tacked the ordering issue, but for most sites, that's relatively minor.

Known Bugs

Current Locale Confusion

Designers are often confused by the Current Locale state under the style panel, which doesn't seem to work as expected. We're not using that here.

My best guess is that this is targeted at Enterprise customers, who have the ability to do Locale-specific styling, and that this state indicates a style applied only to the current locale ( whatever you have currently selected in the top left locale toggle ).

‍