How to use the Switcher Editor

In this article, you'll learn how to change the position of the language switcher on your website through the Switcher Editor feature.

1. How to access the Switcher Editor

2. How to change the position of the switcher

3. How to reset the switcher to its default position

4. How to add a mobile switcher

5. How to change the design of the switcher

The Switcher Editor allows you to reposition the language switcher on your website. It offers a preview of your website, where you can experiment with different designs by dragging and dropping the language switcher button until you are satisfied with its position.

1. How to access the Switcher Editor

First, go to your Weglot Dashboard > Settings > Language Switcher, and click on the "Switcher Editor" button:

⚠️ Note that your website must be live and accessible to use the Switcher Editor. Your website's URL must also be set, which you can do through the Weglot Dashboard > Settings > General.

2. How to change the position of the switcher

To change the position of your language switcher (located in the bottom right corner of the browser window by default), click on it, then drag and drop the switcher to your desired location. You can repeat this process until you're satisfied with the switcher's placement.

Finally, click on "Save" to register your changes.

3. How to reset the switcher to its default position

You can reset the switcher to its default position by clicking on the "Switcher position" dropdown located on the menu on the left. Then, click on "Reset to default position".

4. How to add a mobile switcher

You can add as many language switchers as you want, even for the different versions of your website (mobile and desktop, for example).

First, select the appropriate version in the bottom left corner:

Then, click on the plus icon in the top left corner:

This will add a new language switcher that you can drag and drop at the desired location, then click "Save" to apply your changes.

5. How to change the design of the switcher

• The language name (abbreviated if the "Display the full language name" option is turned off, such as "en" for English, for example)
• The full language name
• The type of switcher (when off, the language options will be displayed as a list)
• The language flags and the type of flags (shiny rectangle, matte rectangle, square, circle)

You can also choose a pre-made template in the "Choose a switcher template" dropdown and customize it:

Finally, you can edit some other settings in the "Other switcher settings" section:

In this section, you can edit these options:

• If the switcher can be opened by hovering it
• If the switcher automatically closes by clicking outside on the page (if, for example, it's a dropdown switcher)
• If the switcher is only shown on specific screen sizes

Once you configure your desired settings, click on "Save", and it's done.

If you'd like to make further design adjustments to your language switcher, feel free to look at our dedicated article: How to change the design of the language switcher?