Webflow Localization

Hiding & Showing Elements, by Locale

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
Hiding & Showing Elements, by Locale
108
Hiding & Showing CMS Items, by Locale
108
Localizing Images
109
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

With the introduction of locale-specific styling to sub-Enterprise plans, it's now easy to hide and show elements on a per-locale basis.

Here I walk through two approaches;

  1. Localized styling using display: block and display: none.
  2. Components and the visibility-bound property

Both are very workable depending on your design approach.

However one of the advantage of the Components approach is that when the elements are hidden they do not exist in the page.

This is generally considered better for SEO.

FAQs

Answers to frequently asked questions.

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.