Hur man översätter RTL-språk i WordPress: Arabiska, hebreiska, persiska
Du har precis avslutat översättningen av ditt WordPress-tema till arabiska. Du laddar upp .mo-filen, byter webbplatsens språk och resultatet är oläsligt. Text flyter över till vänster, knappar överlappar och din noggrant utformade layout ser ut som om den hade matats genom en pappersförstörare.
Välkommen till världen av höger-till-vänster-språk (RTL) – där översättning bara är halva striden. Arabiska, hebreiska och persiska (farsi) är bland de mest talade språken på jorden. Arabiska har ensamt över 400 miljoner modersmålstalare. Om din WordPress-webbplats ignorerar dessa målgrupper lämnar du allvarliga pengar på bordet. Men att betjäna dem kräver mer än att bara byta ut engelska ord mot arabiska. Det kräver att du tänker om hela din layoutriktning.
Den här guiden täcker allt du behöver veta: hur RTL fungerar i WordPress, hur du åtgärdar din CSS, hur du hanterar .po-filer med RTL-strängar och hur du undviker de vanligaste fallgroparna.
Hur RTL fungerar i WordPress
WordPress har inbyggt RTL-stöd. När du ställer in din webbplats språk till arabiska (ar), hebreiska (he) eller persiska (fa), lägger WordPress automatiskt till dir="rtl" till <html>-taggen och laddar en rtl.css-stilmall om ditt tema tillhandahåller en.
Detta är teorin. I praktiken levereras de flesta teman med minimalt eller trasigt RTL-stöd.
Vad som faktiskt ändras
När RTL-läget aktiveras speglar webbläsaren hela sidlayouten:
- Text flyter från höger till vänster.
- Sidofält byter sida.
- Navigeringsmenyer vänder ordning.
- Värden för utfyllnad och marginal vänds (vänster blir höger).
- Ikoner med riktningsbetydelse (pilar, vinklar) måste speglas.
Om ditt temas CSS endast skrevs för LTR, kämpar nu varje deklaration av margin-left, padding-right, float: left och text-align: left mot webbläsarens RTL-motor.
Fixa din CSS för RTL: En praktisk guide
Det renaste tillvägagångssättet är att använda CSS Logical Properties, som automatiskt anpassar sig till dokumentets skrivriktning. Istället för left och right använder du inline-start och inline-end.
Före: Fysiska egenskaper (går sönder i RTL)
/* LTR-only CSS -- breaks in Arabic */
.sidebar {
float: left;
margin-right: 20px;
}
.nav-arrow {
padding-left: 10px;
text-align: left;
}
.card {
border-left: 3px solid #0073aa;
}
Efter: Logiska egenskaper (fungerar i båda riktningarna)
/* Direction-agnostic CSS -- works in both LTR and RTL */
.sidebar {
float: inline-start;
margin-inline-end: 20px;
}
.nav-arrow {
padding-inline-start: 10px;
text-align: start;
}
.card {
border-inline-start: 3px solid #0073aa;
}
Med logiska egenskaper skriver du din CSS en gång och den fungerar korrekt på både engelska och arabiska utan några åsidosättanden.
Metoden [dir="rtl"] för åsidosättande
Om du inte kan refaktorera hela din stilmall kan du rikta in dig specifikt på RTL med hjälp av attributväljare:
[dir="rtl"] .sidebar {
float: right;
margin-left: 20px;
margin-right: 0;
}
[dir="rtl"] .nav-arrow {
padding-left: 0;
padding-right: 10px;
text-align: right;
}
Detta fungerar, men det fördubblar din underhållsbörda. Varje gång du uppdaterar dina LTR-stilar måste du också uppdatera RTL-åsidosättningarna.
Översätta PO-filer med RTL-strängar
Själva översättningen introducerar utmaningar som går utöver layout. RTL-språk har unika egenskaper som snubblar de flesta automatiserade verktyg.
Dubbelriktad text (Bidi) i PO-filer
Den verkliga komplexiteten uppstår när RTL- och LTR-text blandas i en enda sträng. Tänk på detta vanliga WordPress-mönster:
msgid "Powered by %s"
msgstr "مدعوم بواسطة %s"
Platshållaren %s kommer att ersättas med ett engelskt produktnamn som "WooCommerce". I den renderade utgången måste webbläsaren visa arabisk text som flyter från höger till vänster, sedan växla till vänster till höger för det engelska ordet och sedan potentiellt växla tillbaka.
Detta kallas dubbelriktad text (eller "bidi"), och det hanteras av Unicode Bidirectional Algorithm. För det mesta fungerar det automatiskt. Men när du har flera platshållare eller siffror intill RTL-text kan den visuella ordningen bli oförutsägbar.
Vanliga översättningsmisstag
Generiska översättningsverktyg gör flera RTL-specifika fel:
-
Omvänd platshållarordning. En sträng som
%1$s ut av %2$skan få platshållarna utbytta eftersom AI:n ordnar om dem för att matcha arabisk grammatik. Detta ger felaktig utdata som "10 ut av sida" istället för "Sida ut av 10". Lär dig mer om hur du skyddar kodvariabler under översättning. -
Trasig HTML-riktning. Om din sträng innehåller inline-HTML som
<span dir="ltr">, kan en naiv översättare ta bortdir-attributet eller översätta det. -
Saknade pluralformer. Arabiska har sex pluralformer – noll, en, två, få, många och andra. Detta är det mest komplexa plurala systemet av alla språk som WordPress stöder. Ett verktyg som bara genererar två former (som engelska singular/plural) kommer att lämna din arabiska
.po-fil trasig. För en djupdykning i hur Gettext-plural fungerar, se vår guide om komplex pluralisering i WordPress.
Här är hur en korrekt översatt arabisk pluralsträng ser ut i en .po-fil:
# Arabic: nplurals=6
msgid "%d comment"
msgid_plural "%d comments"
msgstr[0] "لا تعليقات"
msgstr[1] "تعليق واحد"
msgstr[2] "تعليقان"
msgstr[3] "%d تعليقات"
msgstr[4] "%d تعليقًا"
msgstr[5] "%d تعليق"
Om någon av dessa sex former är tomma eller felaktiga, kommer WordPress att återgå till den engelska strängen för det specifika antalet. Dina användare kommer att se "5 kommentarer" på engelska utspridda i ett annars helt arabiskt gränssnitt.
Testa din RTL-implementering
Att översätta och fixa CSS räcker inte. Du måste verifiera resultatet i en riktig webbläsare.
En snabb testchecklista
- Byt WordPress-språk till arabiska i Inställningar > Allmänt. Lägg inte bara till
dir="rtl"manuellt – använd den riktiga språkinställningen så att WordPress laddar sina egna RTL-åsidosättanden. - Kontrollera navigeringsmenyer. Är de speglade? Öppnas rullgardinsmenyer i rätt riktning?
- Inspektera formulärfält. Inmatningstext ska flöda från höger till vänster. Platshållartext ska vara högerjusterad.
- Verifiera innehåll med blandad riktning. Strängar som innehåller både arabiska och engelska (som varumärkesnamn eller URL:er) ska renderas i rätt visuell ordning.
- Testa på mobilen. RTL-layoutbuggar är ofta mer allvarliga på mindre skärmar där det finns mindre utrymme för justeringsfel.
Om dina översättningar inte visas alls, kan problemet vara orelaterat till RTL – kontrollera din .mo-filkompilering och filsökvägar först.
Webbläsarens utvecklarverktygstrick
I Chrome DevTools kan du tillfälligt tvinga RTL på vilken sida som helst utan att ändra WordPress-inställningar:
/* Paste in DevTools console as: document.documentElement.dir = 'rtl' */
html {
direction: rtl;
}
Detta ger dig en snabb förhandsvisning av hur ditt tema hanterar RTL innan du ens börjar översätta.
Automatisera RTL-översättning på rätt sätt
Manuell översättning av RTL-språk är dyrt och långsamt. Professionella arabiska översättare tar ut höga priser, och det är svårt att hitta någon som förstår både språket och WordPress-specifik Gettext-syntax.
SimplePoTranslate löser detta med en Context-Aware AI-motor som förstår RTL-specifika utmaningar inbyggt:
- Alla sex arabiska pluralformer genereras automatiskt. Vår motor läser
Plural-Forms-huvudet i din.po-fil och producerar exakt det antal former som ditt målspråk kräver. Inga tommamsgstr-platser, inga engelska återgångar. - Platshållarsäkerhet. Variabler som
%s,%doch%1$sär låsta under översättning. AI:n kan inte ordna om, ta bort eller förstöra dem – även när arabisk grammatik föreslår en annan ordning. Läs mer om hur syntaxlåsning skyddar din kod. - Dubbelriktat sammanhang. AI:n förstår att strängar med blandad riktning behöver speciell hantering och bevarar HTML-riktningsattribut.
Oavsett om du lokaliserar ett bloggtema för en hebreisk publik eller översätter en hel WooCommerce-butik till persiska, är processen densamma: ladda upp din .po-fil, välj ditt målspråk och ladda ner den översatta filen. Hela arbetsflödet tar minuter, inte dagar.
För en komplett genomgång av WordPress-lokaliseringsprocessen, se vår ultimata guide till WordPress-lokalisering.
Sluta behandla RTL som en eftertanke
Höger-till-vänster-språk representerar över en miljard potentiella användare. Arabiska är det femte mest talade språket i världen. Hebreiska och persiska betjänar viktiga marknader i Mellanöstern och Centralasien.
Om din WordPress-webbplats inte kan betjäna dessa användare med en polerad, inhemsk upplevelse, kommer de att hitta en konkurrent som kan.
De goda nyheterna: WordPress har redan infrastrukturen. Ditt tema behöver bara korrekt CSS, och dina .po-filer behöver ett översättningsverktyg som respekterar komplexiteten i RTL-språk.
Redo att översätta din WordPress-webbplats till arabiska, hebreiska eller persiska? Börja gratis på SimplePoTranslate.com