Einfaches Sprachmenü in TYPO3 via dataProcessor

Zuerst müssen wir sicherstellen, dass die Sprache konfiguriert ist.
In den meisten Fällen unter: config/sites/main/config.yaml
languages:
-
title: Deutsch
enabled: true
languageId: 0
base: /
typo3Language: de
locale: de_DE.UTF-8
iso-639-1: de
navigationTitle: Deutsch
flag: de
-
title: English
enabled: true
locale: en_US
base: /en/
navigationTitle: English
flag: en-us-gb
languageId: 1
Wenn wir das geschafft haben, müssen wir im Typoscript Setup die Navigation generieren:page = PAGE
page {
10 = FLUIDTEMPLATE
10 {
dataProcessing {
70 = TYPO3\CMS\Frontend\DataProcessing\LanguageMenuProcessor
70 {
languages = auto
as = languageMenu
}
}
}
}
Korrekt eingebunden ist das languageMenu jetzt im Fluid-Template verfügbar. Achtung: Die Seite sollte auch im Backend übersetzt sein, sonst ist {item.available} false und somit seht ihr nichts im dropdown (In diesem Beispiel ein Bootstrap5 Standard dropdown).
<div class="dropdown">
<a class="dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
<f:for each="{languageMenu}" as="item" iteration="i">
<f:if condition="{item.active}">
<f:then>{item.twoLetterIsoCode}</f:then>
</f:if>
</f:for>
</a>
<ul class="dropdown-menu">
<f:for each="{languageMenu}" as="item" iteration="i">
<f:if condition="{item.available} && !{item.active}">
<f:then>
<li>
<a class="dropdown-item {f:if(condition: item.active, then: 'current')} {f:if(condition: item.available, else: 'text-muted')}"
href="{item.link}"
hreflang="{item.hreflang}"
>
{item.twoLetterIsoCode}
</a>
</li>
</f:then>
</f:if>
</f:for>
</ul>
</div>
Stolz bin ich auf die zwei aufeinanderfolgenden foreach Schleifen nicht, aber anders kann man die aktuell aktive Sprache allein nicht so einfach rausholen. Je nach HTML-Struktur kann natürlich ein einfaches foreach auch genug sein.
getestet in Version 12 LTS