Q-TranslateX Language Select konfigurieren

Heute habe ich mal wieder ein bisschen WordPress Support geleistet und mich mit dem qTranslate X Plugin herumgeschlagen. Gerne möchte ich euch an dem Ergebnis teilhaben lassen, wie ihr Q-TranslateX Language Select konfigurieren könnt.

Um eine WordPress Seite flexibel in mehren Sprachen darstellen zu lassen und dabei bequem zwischen den Sprachen umschalten zu können, bietet sich das Plugin qTranslateX an. Es ersetzt das ältere qTranslate, welches leider nicht mehr weiter entwickelt wird. Das Plugin lässt euch mit einem Klick die Sprache umstellen. Ihr könnt also ganz einfach einen Blog auf deutsch und englisch oder gar chinesisch realisieren. Die Texte müsste ihr natürlich selbst übersetzen aber den Rest nimmt euch das Plugin ab.

Ich persönlich finde die FAQ oder Einsteiger Seite des qTranslate X Plugins nicht wirklich aussagekräftig. Deshalb hier kurz was ich herausgefunden habe.

Um die Sprache zu wechseln möchte ich im Header der Seite einfach zwei kleine Fahnen angezeigt bekommen und darüber die Sprache wechseln. Soweit so einfach.

Man muss dazu einfach den folgenden Code Schnippsel an der gewünschten Stelle, in seinen Quelltext, kopieren. Bei mir war es die header.php – da ich die Flaggen gerne oben auf jeder Seite sehen möchte.

<?php echo qtranxf_generateLanguageSelectCode(‘image’); ?>

Das resultiert (zumindest bei mir) darin, dass die beiden Fahnen versetzt angezeigt werden und zusätzlich noch störende Aufzählungszeichen angezeigt werden.

Also muss der Eintrag noch formatiert werden. Am einfachsten geht dies via CSS und zwar in der style.css Datei. Hier fügen wir einfach den folgenden Code ein und schon werden die Fahnen nebeneinander und mit einem schönen Abstand von 10 Pixeln angezeigt.

.qtranxs_language_chooser { list-style-type:none; float:right }
.qtranxs_language_chooser li { float : left; margin-right: 10px; }

Fertig!

Für mich war das ganze leicht tricky, da in der Ursprungsversion von qTranslate der Code minimal anders und nicht so 100%ig nachvollziehbar war für mich. In der ALTEN VERSION sehen die Code Snippets nämlich so aus:

<?php echo qtrans_generateLanguageSelectCode(‘image’); ?>

.qtrans_language_chooser { list-style-type:none; float:right }
.qtrans_language_chooser li { float : left; margin-right: 10px; }

Aus einem qtrans_ wurde also einmal ein qtransxf_ bzw. ein qtransxs_ … nicht wirklich logisch. Ich hatte es zuerst mit qtransx_ in beiden Code Snippets versucht… Aber ohne Erfolg. Solltet ihr einmal von dem gleichen Problem stehen – die Lösung findet ihr weiter oben 🙂

PS: Ich wisst natürlich, dass ihr solche Änderungen am Code in einem sogenannten Child-Theme durchführen solltet. Dann bleiben alle Änderungen auch bestehen, wenn das Theme einmal aktualisiert wird. Aber um mal schnell zu testen ob es geht, reicht es auch im ursprünglichen Theme.

PPS: Ich habe das qTranslate X Plugin übrigens zusammen mit WooCommerce am laufen. Funktioniert einwandfrei und erspart einem teure Übersetzungsplugins zu kaufen 🙂