Polylang language switcher shortcode, manual language switcher, and per-block language visibility via CSS.
- Dark and Light themed
[tcp-lang-switcher]shortcode. - Show language code or full name.
- Dropdown of languages.
- Per‐block visibility via
show-for-xxCSS classes. - Manual language switcher (in case you want to build your own using Gutenberg blocks)
- Copy to
wp-content/plugins/minimal-polylang-extensions. - Activate plugin.
- Add
[tcp-lang-switcher]to shortcode block. - Add
[tcp-lang-switcher theme="light"]to use black over light backgrounds. The default theme is for dark backgrounds.
-
In the WordPress Block Editor (Site Editor or Navigation block), create a Navigation block with a submenu.
-
The parent menu item should display a placeholder: "LAN".
-
Add child menu items for each language (e.g., "EN", "ES").
-
Set the URL of each child to
#. -
Add the following CSS classes to each menu item:
- Parent:
.lang-switcher - Child for English:
.lang-btn lang-en - Child for Spanish:
.lang-btn lang-es - Repeat for other languages.
- Parent:
The JavaScript will automatically update the # links to point to the correct translated URLs.
This is intended to be used in headers, footers, or any template part that needs to be translated/replaced. Will
- Wrap blocks in a Group (or any container)
- Add CSS class
show-for-xx. Replace xx with the language code. (ie: en for English) - Duplicate and edit the xx part per language
Only matching content renders based on <html lang="">.
GPLv2 or later.
- Polylang plugin must be active.
- Works with FSE themes and block-based templates.
Will improve this plugin to add features as we need them
Shortcode based and extended from BW_Lang_Switcher_Plugin by blickwert Manual switcher based on our other plugin "Manual Polylang Switcher"