Language Switcher, Flag Selector – Dokumentation

Ersetzen Sie das standardmäßige Text-Dropdown für Sprachen durch einen kompakten, flaggenbasierten Sprachumschalter, mit dem internationale Besucher die verfügbaren Shop-Sprachen schneller erkennen. Das Modul liest Ihre aktiven PrestaShop-Sprachen aus, erstellt den Selektor aus diesen Sprachen und verlinkt jede Flagge mit der passenden übersetzten Seiten-URL, sofern PrestaShop eine bereitstellt.

Flag Selector

Flag Selector ersetzt das Sprach-Dropdown im Header durch ein Flaggen-Dropdown. Besucher sehen im Header die Flagge der aktuellen Sprache, öffnen das Dropdown und wählen eine andere aktive Sprache aus der Liste.

Das Modul ist für mehrsprachige Shops gedacht, die im Header eine schlankere Lösung als einen vollständigen Text-Selektor wünschen. Die Sprachverwaltung bleibt vollständig in PrestaShop, sodass Sie Ihre Sprachen weiterhin im Standardbereich International → Localization → Languages verwalten.

Kompatibilität: PrestaShop 1.6 bis 9.0 (latest), PHP 7.1+. Wir unterstützen auch kommende PrestaShop-Versionen weiterhin.

Flag Selector, Nav flag language picker Flag Selector, Flag selector admin settings

Funktionsweise

Nach der Installation registriert das Modul seinen Front-Office-Sprachselektor in den Hooks für den Header und den mobilen Sprachselektor. Es liest nur aktive Sprachen für den aktuellen Shop:

$languages = Language::getLanguages(true, $this->context->shop->id);

Wenn Ihr Shop nur eine aktive Sprache hat, gibt das Modul keinen Selektor aus, da es für Kunden nichts zum Wechseln gibt.

Der Header-Selektor wird über folgende Vorlage gerendert:

module:mprflagselector/views/templates/hook/flag-selector.tpl

Das Modul registriert diese Hooks:

displayNav2
actionFrontControllerSetMedia
displayMobileLanguageSelector

displayNav2 rendert das Desktop-Dropdown. displayMobileLanguageSelector rendert ein mobiles <select> mit denselben Sprach-URLs.

Flag Selector, Mobile flag language picker Flag Selector, Flag selector desktop dropdown 1000w

Sprach-URLs

Für jede Sprache verwendet das Modul die beste URL, die PrestaShop für die aktuelle Seite bereitstellen kann. Wenn der aktuelle Controller übersetzte alternative URLs liefert, nutzt das Modul diese:

getAlternativeLangsUrl()

Wenn keine übersetzte alternative URL verfügbar ist, greift es auf den PrestaShop-Sprachlink zurück:

$this->context->link->getLanguageLink($lang['id_lang'])

Das Modul entfernt außerdem übrig gebliebene id_lang-Parameter aus generierten URLs, damit die finalen Links sauberer bleiben:

$langUrl = preg_replace('/([?&])id_lang=\d+&?/', '$1', $langUrl);
$langUrl = rtrim($langUrl, '?&');

Für Shops mit MPR Filter Revolution kann der Selektor beim Sprachwechsel den aktiven Filterpfad übersetzen:

MPRFilterRevolution::translateFilterPath(
    $activeFilterPath,
    $filterShopId,
    $filterSourceLangId,
    (int) $lang['id_lang']
);

Außerdem bleibt die Paginierung von Listen erhalten, wenn der zugehörige MPR-Helfer für Listen-URLs verfügbar ist.

Flag Selector, Language country flags Flag Selector, Flag selector desktop dropdown

Flaggenbilder

Das Modul verwendet SVG-Flaggendateien, die hier gespeichert sind:

/modules/mprflagselector/views/img/flags/

Sprach-ISO-Codes werden bei Bedarf den passenden Länder-Flaggencodes zugeordnet. Beispiele aus dem Modul:

'en' => 'gb'
'cs' => 'cz'
'sv' => 'se'
'da' => 'dk'
'el' => 'gr'
'ja' => 'jp'
'zh' => 'cn'
'ko' => 'kr'
'uk' => 'ua'

Zu den unterstützten Flaggendateien im Modul gehören:

bg.svg
cn.svg
cz.svg
de.svg
dk.svg
ee.svg
es.svg
fi.svg
fr.svg
gb.svg
gr.svg
hr.svg
hu.svg
it.svg
jp.svg
kr.svg
lt.svg
lv.svg
nl.svg
no.svg
pl.svg
pt.svg
ro.svg
ru.svg
sa.svg
se.svg
si.svg
sk.svg
tr.svg
ua.svg

Wenn ein Sprach-ISO-Code keiner Flaggendatei entspricht, erstellt das Modul die Sprachoption trotzdem, jedoch ohne Flaggenbild.

Flag Selector, Language switch keeps page

Installation

  1. Gehen Sie in Ihrem Back Office zu Modules → Module Manager
  2. Klicken Sie auf Upload a module und wählen Sie die ZIP-Datei aus
  3. Installieren Sie das Modul
  4. Klicken Sie auf Configure
  5. Bestätigen Sie die beiden Anzeigeeinstellungen
Flag Selector, Admin label display options

Konfiguration

Das Modul hat zwei Anzeigeeinstellungen für Händler.

Show ISO label in toggle, Zeigt den ISO-Sprachcode neben der aktuellen Flagge im geschlossenen Header-Button an, zum Beispiel EN oder DE.

Standardwert:

SHOW_LABEL = 0

Show language names in dropdown, Zeigt den vollständigen Sprachnamen neben jeder Flagge im Dropdown an.

Standardwert:

SHOW_NAMES = 1

Die aktuellen Formularfelder sind:

MPRFLAG_SHOW_LABEL
MPRFLAG_SHOW_NAMES

Die gespeicherten Konfigurationsschlüssel des Moduls sind:

SHOW_LABEL
SHOW_NAMES

Ältere Installationen, die die früheren PrestaShop-Konfigurationsnamen verwenden, werden automatisch migriert:

'MPRFLAG_SHOW_LABEL' => 'SHOW_LABEL'
'MPRFLAG_SHOW_NAMES' => 'SHOW_NAMES'
Flag Selector, Admin config bottom

Front-Office-Ausgabe

Das Desktop-Dropdown verwendet diese wichtigsten CSS-Klassen. Sie sind hilfreich, wenn Ihr Theme kleine visuelle Anpassungen benötigt:

.mprflag-dropdown
.mprflag-dropdown__toggle
.mprflag-dropdown__flag
.mprflag-dropdown__label
.mprflag-dropdown__arrow
.mprflag-dropdown__menu
.mprflag-dropdown__option
.mprflag-dropdown__option--active

Die Flagge der aktuellen Sprache wird mit 24 × 16 Pixeln gerendert:


Flaggen im Dropdown werden mit 22 × 15 Pixeln gerendert:


Das Modul blendet den nativen Desktop-Sprachselektor von PrestaShop aus, solange das Flaggen-Dropdown aktiv ist:

#_desktop_ps_languageselector {
  display: none !important;
}

Die mobile Selektor-Ausgabe verwendet:

<select class="form-select mprflag-mobile-select" aria-label="Change language">

Bei einer Änderung leitet der mobile Selektor den Besucher zur ausgewählten Sprach-URL weiter.

Flag Selector, Admin config top

Tipps

  • Lassen Sie in PrestaShop nur die Sprachen aktiviert, die Sie tatsächlich nutzen. Das Modul liest aktive Sprachen direkt aus dem Shop.
  • Aktivieren Sie Show ISO label in toggle, wenn Flaggen allein für Ihre Besucher mehrdeutig sein könnten.
  • Lassen Sie Show language names in dropdown aktiviert, wenn Ihr Shop mehr als zwei Sprachen hat; dadurch wird das Dropdown klarer.
  • Prüfen Sie den Selektor auf Produkt-, Kategorie-, CMS- und gefilterten Listing-Seiten, um sicherzustellen, dass jede Flagge auf die erwartete übersetzte URL zeigt.
  • Wenn Ihr Theme den Sprachblock im Header bereits anpasst, prüfen Sie nach der Installation den Bereich displayNav2.
  • Für kleinere Theme-Anpassungen sollten Sie die Modulklassen ansprechen, statt die Modulvorlage zu bearbeiten.
Flag Selector, Admin integrity

Häufig gestellte Fragen

Muss ich Sprachen in diesem Modul separat konfigurieren?
Nein. Das Modul liest die aktiven Sprachen für den aktuellen Shop direkt aus PrestaShop.

Kann ich den ISO-Code neben der Flagge anzeigen?
Ja. Aktivieren Sie Show ISO label in toggle. Der geschlossene Selektor zeigt dann Werte wie EN, DE oder FR.

Kann ich Sprachnamen im Dropdown anzeigen?
Ja. Aktivieren Sie Show language names in dropdown. Diese Option ist standardmäßig aktiviert.

Lädt das Modul eigene Flaggenbilder hoch?
Nein. Diese Version verwendet die im Modul enthaltenen SVG-Flaggendateien. Wenn für einen Sprach-ISO-Code keine passende Flaggendatei verfügbar ist, kann die Sprachoption trotzdem ohne Bild angezeigt werden.

Was passiert, wenn nur eine Sprache aktiv ist?
Das Modul gibt keinen Selektor aus, wenn nur eine aktive Sprache vorhanden ist.

Wirkt sich ein Sprachwechsel auf den Warenkorb des Kunden aus?
Der Selektor ändert die Sprach-URL des Shops. Die Warenkorbbehandlung bleibt das normale Sprachwechsel-Verhalten von PrestaShop.

Funktioniert das mit Seiten von MPR Filter Revolution?
Ja. Wenn MPR Filter Revolution vorhanden ist und übersetzte Filterpfade bereitstellt, verwendet der Selektor diese übersetzten Pfade für den Sprachwechsel.

Welche Hooks verwendet das Modul?

displayNav2
displayMobileLanguageSelector
actionFrontControllerSetMedia
Flag Selector, Flag selector admin settings 1000w
Lade ...
Nach oben