Den Liquid-Code deines Shopify-Themes übersetzen: der komplette Guide
Deine Custom-Texte tauchen in Translate & Adapt nicht auf? Locale-Dateien, Übersetzungsschlüssel und der t-Filter: die Liquid-Mechanik erklärt, mit komplettem Beispiel.
Du hast deinem Shopify-Theme ein eigenes Feature hinzugefügt, ein Vertrauensbanner, einen Rechtshinweis, einen Custom-Block. Und beim Übersetzen taucht dessen Text nirgends in Translate & Adapt auf.
Das ist kein Bug: Ein im Liquid hartkodierter String ist keine übersetzbare Ressource. Hier ist die Mechanik, um das zu beheben, Locale-Dateien, Schlüssel und der « t »-Filter, mit einem kompletten Beispiel.
Warum deine Custom-Texte den Übersetzungs-Apps entgehen
Shopify übersetzt kein rohes HTML: Es übersetzt Ressourcen. Produkte, Kategorien, Seiten und die in den Locale-Dateien deklarierten Theme-Strings.
- Ein in einer .liquid-Datei hartkodierter Text ist für Translate & Adapt und jede andere Übersetzungs-App unsichtbar
- Ein Text, der über einen Übersetzungsschlüssel und den « t »-Filter läuft, wird zu einer übersetzbaren Ressource wie jede andere
- Die Korrektur erfolgt einmal pro String, direkt im Theme-Code
Shopify warnt dich schon beim Hinzufügen einer Sprache: « alle Inhalte müssen übersetzt werden, einschließlich Theme-Text ». Nur muss dieser Text am richtigen Ort deklariert sein.
Zuerst: die Sprache in Shopify hinzufügen
Falls noch nicht geschehen, wird die Zielsprache in den Shop-Einstellungen deklariert:
- Öffne « Einstellungen » und dann « Sprachen » in deinem Shopify-Admin.
- Klicke auf « Sprache hinzufügen » und wähle sie im Menü aus.
- Weise sie einem oder mehreren Shopify-Märkten zu und bestätige.
Translate & Adapt installiert sich dabei automatisch. Nützliche Erinnerung: Die Auto-Übersetzung, geliefert von der Google Cloud Translation API, ist auf zwei Sprachen begrenzt; darüber hinaus ist alles Handarbeit.
Die Locale-Dateien des Themes öffnen
Zwei Begriffe reichen, um alles zu verstehen: die Locale-Dateien, die die Übersetzungen jeder Sprache speichern, und die an den « t »-Filter übergebenen Schlüssel, die zum richtigen Zeitpunkt den richtigen Wert holen.
- Öffne im Admin « Onlineshop » und dann das « ⋯ »-Menü neben deinem Theme.
- Wähle « Code bearbeiten ».
- Der Ordner « locales » liegt unten in der Seitenleiste des Editors.
Die Dateinamen folgen der IETF-Nomenklatur: « de.json » für Deutsch, « en-US.json » für amerikanisches Englisch. Und unterscheide die zwei Typen: .json-Dateien steuern, was Besucher sehen, .schema.json-Dateien betreffen nur den Theme-Editor.
Den Schlüssel deklarieren und mit dem t-Filter aufrufen
Übersetzungen sind in Kategorie, Gruppe und Wert organisiert. Nehmen wir ein von Hand ins Theme eingebautes Vertrauensbanner: Zuerst wird sein String in der Locale-Datei der Standardsprache deklariert.
"layout": {
"shipping_note": "Kostenloser Versand ab 80 €",
"secure_checkout": "100 % sichere Bezahlung"
}Dann ersetzt man in der betreffenden .liquid-Datei den hartkodierten Text durch den an den « t »-Filter übergebenen Schlüssel:
<p class="reassurance">
{{ 'layout.shipping_note' | t }} ·
{{ 'layout.secure_checkout' | t }}
</p>Das war's: Der String wird zur übersetzbaren Ressource, sichtbar in Translate & Adapt und jeder Übersetzungs-App. Zwei Grenzen, die man kennen sollte: maximal 3.400 Übersetzungen pro Locale-Datei und 1.000 Zeichen pro Wert.
Die Übersetzung dieser Strings mit Reversia automatisieren
Sind deine Strings in den Locales deklariert, müssen sie noch übersetzt werden. In Translate & Adapt heißt das Handarbeit, Sprache für Sprache, Feld für Feld. Reversia übernimmt automatisch:
- Theme-Strings werden mit dem Rest des Shops erkannt und übersetzt, in allen deinen Sprachen
- Das Glossar schützt deine Fachbegriffe und Markennamen, wertvoll bei Inhalten im Code
- Jede Übersetzung bleibt im zweispaltigen Editor prüfbar und bearbeitbar, mit Sperrung
- Später hinzugefügte Schlüssel werden erkannt: das Theme läuft nicht aus dem Takt
Die Liquid-Arbeit fällt also nur einmal an: Danach kostet jede neue Sprache ein paar Minuten, keine komplette Tipprunde.
Was du dir merken solltest
Der Reflex, den du behalten solltest: Jeder Inhaltstyp hat seinen eigenen Übersetzungsweg.
| Inhaltstyp | So wird er mehrsprachig |
|---|---|
| Standard-Theme-Texte (Buttons, 404, Warenkorb) | Bereits in den Locales deklariert, von deiner Übersetzungs-App übersetzt |
| Hartkodierter Custom-Text im Liquid | Schlüssel in der Locale deklarieren, mit dem « t »-Filter aufrufen, dann übersetzen |
| Produkte, Kategorien, Seiten, Metafelder | Native Ressourcen, direkt von der App übersetzt |
| Nur im Theme-Editor sichtbare Einstellungen | .schema.json-Dateien, ohne Auswirkung auf Besucher |
Ein sauberes Theme ist eines, in dem jeder Text durch die Locales läuft. Das ist die Voraussetzung dafür, dass eine automatisierte Übersetzung wirklich 100 % des Shops abdeckt.
FAQ: Liquid und Theme-Übersetzung
Warum taucht mein Custom-Text nicht in Translate & Adapt auf?
Weil er in einer .liquid-Datei hartkodiert ist. Nur Strings, die in Locale-Dateien deklariert und über den « t »-Filter aufgerufen werden, sind übersetzbare Ressourcen.
Was unterscheidet eine .json- von einer .schema.json-Datei?
Die .json-Dateien enthalten die Storefront-Übersetzungen, das, was deine Besucher sehen. Die .schema.json-Dateien übersetzen nur die Labels des Theme-Editors, rein adminseitig.
Gibt es Grenzen bei den Locale-Dateien?
Ja: maximal 3.400 Übersetzungen pro Datei und 1.000 Zeichen pro Wert. Für ein Theme mehr als genug, aber gut zu wissen, bevor man dort lange Inhalte ablegt.
Übersetzt Reversia die Theme-Strings?
Ja. Jeder korrekt in den Locales deklarierte String wird erkannt und automatisch in alle deine Sprachen übersetzt, mit angewendetem Glossar und Marken-Prompt.
Shopify
