Language Switcher

A compact language dropdown for a built header: shows the current language and lists the others, using the primary-menu with-arrows markup. It is shown in the block inserter as Canvas Language Switcher and registered as canvas-core/language-switcher.

Select the block on a page and its own settings open in the sidebar, in the panels below:

The Language Switcher settings in the block editor sidebar

Settings

Each setting is named exactly as the block editor names it, followed by what it does and what it starts as. Where a setting carries a Shown when line, it stays hidden until that condition is met, which is the usual reason a setting looks missing from the sidebar:

Content

  • LanguagesDefaulta preset list of 4 rows

    The languages a visitor can switch to, in the order listed here. Each row needs the address of that language version of the site.

    Each row of Languages takes:

    • LabelDefaultEmpty

      How this language is named in the switcher, such as a short code or the language name in full.

    • URLDefault#

      Address of the site in this language.

    • Flag / IconDefaultEmpty

      Optional flag/icon font class shown before the label (e.g. a flag-icon-css class).

    • Current LanguageDefaultOff

      Shown as the visible top-level link; all other rows populate the dropdown.

Settings

  • Dropdown WidthDefault80px

    A fixed-width language dropdown works well for short 2-letter codes. Leave empty to let it size automatically.

Every Canvas block also carries the Animation, Scroll Effects and Advanced panels, which are described in Controls every Canvas block has.

Other blocks in Header: App Menu, Header Button, Header Cart, Header Container, Header Icon Link, Header Info.

Was this page helpful?