How to Add Polylang Language Switcher in Gutenberg?

The Language Switcher for Polylang addon adds a dedicated Language Switcher block to the Gutenberg editor.

You can use this block to let visitors switch between the languages available on your Polylang website and customize how the switcher appears directly from the Block Editor.

Follow the steps below to add the language switcher in Gutenberg:

Add the Language Switcher Block

• Open the page or post where you want to display the language switcher.
• Click the + icon to add a new block.
• Search for Language Switcher and add it to your page.

Configure Language Switcher

The settings are divided into two tabs: Default and Styles.

Default Settings

• Displays language names: Enable this option to show language names in the switcher, such as English, French, or Spanish.
• Displays flags: Enable this option to display a flag next to each language.
• Show Language Codes: Enable this option to display language codes, such as EN, FR, or ES.
• Hides the current language: Enable this option to hide the active language.
• Hides languages with no translation: Enable this option to hide languages that do not have a translated version of the page or post.
• Open dropdown on click: Enable this option to open the language dropdown when a visitor clicks it, rather than relying on the default dropdown interaction.
• Layout: Choose how the language switcher should be displayed: vertical, horizontal, or dropdown.

Styles Settings

• Typography: Adjust the text appearance, including available font and text styling options.
• Spacing: Customize the spacing around the language switcher block and its elements using the available controls.
• Border: Configure the border appearance of the language switcher.
• Flag: Customize the appearance of language flags using the available options.
• Advanced: Add custom CSS and use additional block styling options.

Once you finish configuring the block, save or update the page to apply your changes.