Ein großer Teil der Zeitungen, die ein E-Paper wollen, erscheint auf Bengali, Hindi, Urdu oder Arabisch. Ihre Leser sollen keine englische Werkzeugleiste über einer bengalischen Titelseite sehen. Für Inkfold 1.1 haben wir die gesamte Leserseite ins Bengalische, Hindi und Arabische übersetzt, einschließlich Rechts-nach-links-Layout, während die Redaktion für das Team auf Englisch bleibt.
Jeder sichtbare Text durch eine Funktion
Der erste Schritt war der unspektakulärste: Jeder Text der öffentlichen Seite läuft jetzt über Laravels __(), Pluralformen über trans_choice() und Datumsangaben über Carbons translatedFormat(). So wird aus „Monday, 26 October“ ohne eigene Templates „সোমবার, 26 অক্টোবর“. Die Übersetzungen liegen in einfachen JSON-Dateien, eine pro Sprache, mit dem englischen Satz als Schlüssel. Französisch oder Urdu später hinzuzufügen heißt: eine Datei kopieren und die Werte übersetzen.
Die Sprache wählen
Eine kleine Middleware bestimmt die Sprache jeder Anfrage in dieser Reihenfolge: die ausdrückliche Wahl des Besuchers in der Sitzung, die im Konto eines angemeldeten Lesers gespeicherte Sprache, der Accept-Language-Header des Browsers, wenn mehr als eine Sprache angeboten wird, und zuletzt die Standardsprache. Anfragen an die Redaktion überspringen die Middleware ganz. Welche Sprachen angeboten werden, legt der Verlag in den Einstellungen fest.
Rechts nach links, ohne die Zeitung zu spiegeln
Jede Sprache trägt ihre Schreibrichtung in der Konfiguration, und das Layout schreibt sie ins dir-Attribut der Seite. Der Großteil der Oberfläche folgt dann von selbst. Ein eigener Block RTL-Regeln erledigt den Rest: Seitenleisten wechseln die Seite, Vor- und Zurück-Pfeile drehen sich, und der Hinweis „weiter auf“ im Artikelfenster wandert auf die andere Seite.
Eines wird bewusst nicht gespiegelt: die Seiten. Eine bengalische oder englische Zeitung wurde von links nach rechts gedruckt, Seitenfolge und Artikelpositionen müssen wie gedruckt bleiben, auch wenn die Oberfläche drumherum von rechts nach links läuft. Der Seitencontainer behält direction: ltr, damit die Koordinaten aller klickbaren Artikel stimmen.
Schriften nur für die aktive Sprache
Bengali, Devanagari und Arabisch brauchen eigene Schriften. Alle für jeden Besucher zu laden, brächte Gewicht ohne Nutzen. Das Layout fordert deshalb nur die Noto-Schrift der aktiven Sprache an und fügt sie über CSS-Variablen in den Schriftstapel ein.
Ein Test, der bei fehlender Übersetzung fehlschlägt
Übersetzungen veralten leise: Jemand fügt einen Knopf hinzu und vergisst die JSON-Dateien. Ein Feature-Test durchsucht jetzt die Templates der Leserseite nach übersetzbaren Texten und schlägt fehl, wenn einer Sprachdatei einer fehlt. Er hat eine Überraschung gefunden: Ein Schlüssel namens „Pagination“ landete auf einem Dateisystem ohne Groß-/Kleinschreibung in Laravels eigener pagination.php und lieferte ein Array. Meiden Sie Schlüssel, die wie eine Übersetzungsdatei heißen.
Das Wichtigste
- Allen öffentlichen Text über
__()führen; Übersetzungen als JSON mit dem Ausgangssatz als Schlüssel. - Die Sprache aus Sitzung, Konto, Browser und Standard bestimmen, in dieser Reihenfolge.
diram Dokument setzen und gezielte RTL-Regeln schreiben, gedruckte Inhalte aber in ihrer Richtung lassen.- Schriften für besondere Schriftsysteme nur für die aktive Sprache laden und auf fehlende Texte testen.
Zuvor in dieser Reihe: offline lesen mit einem Service Worker. Wechseln Sie die Sprache oben in der Inkfold-Demo; die Software gibt es bei Charming Theme.
Sie brauchen eine Laravel- oder WordPress-Website auf Bengali, Arabisch oder in mehreren Sprachen? Sprechen wir darüber — ArtinTech Solution baut jede Woche mehrsprachige Websites.