Documentation
Feedback
Guides

Basic components
Locale Switcher

The Locale Switcher app provides a component capable of changing the current language of your store.

{"base64":"  ","img":{"width":73,"height":152,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":3496,"url":"https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/images/vtex-locale-switcher-0.png"}}

Configuration

  1. Add the Locale Switcher app to your theme's dependencies in the manifest.json file:
"dependencies": { + "vtex.locale-switcher": "0.x" }
  1. Add the locale-switcher block to your header. For example:
"header-row#desktop": { "children": [ // (...) "locale-switcher", "login", "minicart.v2" ] },
  1. Open a ticket to our support team in order to adjust your store's binding with the desired languages.

Caution: The third step is mandatory. If no ticket is opened requiring the desired languages, the selection list may not appear on the Locale Switcher component.

Customization

In order to apply CSS customizations in this and other blocks, follow the instructions given in the recipe on Using CSS Handles for store customization.

CSS Handles
button
buttonText
container
list
listElement
localeIdText
relativeContainer
Contributors
2
Photo of the contributor
Photo of the contributor
+ 2 contributors
Was this helpful?
Yes
No
Suggest edits (Github)
« HeaderLogin »
Contributors
2
Photo of the contributor
Photo of the contributor
+ 2 contributors
On this page