Language Switcher Style Pack

Language Switcher Style Pack adds a Language switcher (Style Pack) block with 10 ready-made designs. Place it like core's language switcher, choose a design, and get a polished switcher without writing templates or CSS.

Designs

• Menus: Globe dropdown, Compact menu
• Lists: Inline links, Pills, Segmented toggle, Code badges, Flag list, Footer list
• Panels: Floating button, Picker grid

Features

• No CSS framework, no JavaScript and no extra dependencies. Menus use the HTML details element and panels use the HTML popover attribute.
• Native language names (Français, Deutsch, العربية), the site language name, the code, or both names.
• Languages without a translation of the current page can be dimmed with a "Not translated" note, or hidden.
• Optional flags, current language highlighted or hidden, and an accent color per block.
• Full right-to-left support for languages such as Arabic and Hebrew.
• Accessible: keyboard support, lang and dir on every language name, and aria-current on the current language.
• Uses core's language switch links, so modules that alter them, such as Language Switcher Extended, keep working.

Getting started

1. Install with composer require drupal/language_switcher_style_pack and enable the module.
2. Go to Structure » Block layout and place the Language switcher (Style Pack) block.
3. Choose a design and options, then save.

Requirements

Drupal 11.2 or later with the core Language module.

Similar projects

Language Switcher Dropdown and Languages Dropdown each provide one dropdown style, the latter for Bootstrap themes. Language Switcher Style Pack provides 10 framework-free designs that work with any theme.