Questions & Answers

CNoetzel
Elite Observer

Schriftrichtung (RTL) aus CMS_INPUT_DOM abgreifen

Werte Community,

wir verwenden als Eingabekomponente ein CMS_INPUT_DOM in das wir arabischen Text eintragen. Dieser Text wird von der Eingabekomponente korrekt erkannt in RTL (right-to-left) Form dargestellt. Die Ausgabe im HTML-Ausgabe im HTML-Ausgabekanal erfolgt wie gewohnt รผber:

$CMS_IF(!st_text.isEmpty)$

     $CMS_VALUE(st_text)$

$CMS_END_IF$

Dadurch wird der Text aber ganz gewรถhnlich in LTR Schreibweise angezeigt. Die Eingabekomponente soll sowohl fรผr LTR als auch RTL Texte verwendet werden.

Nun meine Frage: Ist es irgendwie mรถglich die Formatierung (RTL) aus dem DomElement abzugreifen, um Text automatisch auch im Ausgabekanal in RTL Schriftrichtung darzustellen?

Ziel sollte es sein, dass ein Redakteur in der Eingabekomponente Texte pflegt (deutsch, englisch, arabisch), die Schriftrichtung automatisch erkannt und im Ausgabekanal entsprechend dargestellt wird.

Vielen Dank im Voraus!

Freundliche GrรผรŸe

Carsten Noetzel

4 Replies
kscheuing
I'm new here

Hallo Carsten,

das ist meiner Meinung nach ein Style Thema. Versuchs mal mit dem "direction" Tag:

<div id="text" style="direction:rtl;" >ุญู…ุงุฉ ุงู„ุญู…ู‰ </div>

Die "direction" wiederrum kรถnnte man รผber einen Radiobutton steuern:

<div id="text" $CMS_IF(st_radio.toString == "rtl")$ style="direction:rtl;" $CMS_END_IF$>

GruรŸ, Kai

Hallo Kai,

vielen Dank fรผr Deine Rรผckmeldung. Das es einen Weg รผber das direction-Tag gibt, ist mir bewusst. Man kรถnnte auch eine Formatvorlage anlegen, die den entsprechenden Text in RTL-Schreibweise und rechtsbรผndig ausgibt.

Meine Frage zielt aber darauf ab, ob es mรถglich ist das zu automatisieren, ohne dass der Redakteur einen Radiobutton betรคtigen oder eine Formatvorlage auswรคhlen muss. Anscheinend bekommt die Eingabekomponente ja mit, dass es sich um RTL-Text handelt, denn man kann ihn ja so editieren.

Soweit ich das jetzt beurteilen kann, wird ein in RTL Schreibweise eingegebener Text auch in RTL Schreibweise ausgegeben. Was fehlt ist dennoch die Rechtsbรผndigkeit.

GrรผรŸe

Carsten

0 Kudos

Hallo Carsten,

weiรŸ zwar nicht obs dich weiter bringt, habs auch nicht versucht, aber das hab ich in der API gefunden:

Interface DomEditorValue

String      toHtml(Language language)

Build an HTML representation for the given language's value.

0 Kudos

Nach weiteren Recherchen hat sich herausgestellt, dass die fehlende Rechtsbรผndigkeit auf den CSS-Style "text-align:left" im Parent-Container zurรผckzufรผhren ist.

Anscheinend sorgt diese Eigenschaft dafรผr, dass ein mittels dir="RTL" bzw. dir="auto" annotiertes p-Element links-bรผndig angezeigt wird, obwohl das dir-Attribut es rechtbรผndig anzeigen sollte.

Ein Minimalbeispiel zum Selbertesten:

<!doctype html>

<html>

<head>

<title>Test</title>

<meta charset="utf8">

</head>

<body style="text-align:left">

    <h4>Direction Test</h4>

    <p dir="auto">LTR Schrift mit dir="auto"!</p>

    <p dir="auto">ุจุงู„ุฑุบู… ูˆุงู„ุฑูˆุณูŠุฉ ููŠ ุฌุนู„. ุฏุงุฑ ูƒุงู†ุช ู…ุฏูŠู†ุฉ ูุงุชู‘ุจุน ุฃู…. ูุนู„ ุฏูู‘ุฉ ูŠุง-ูุฑู†ุณุง ุญูˆู„.</p>

</body>

</html>

Entfernt man den style-Teil aus dem Body-Tag, wird der arabische Text korrekt in RTL Form angezeigt.

Um das ursprรผngliche Problem zu lรถsen, kann man in den Allgemeinen Formatvorlagen die Vorlage "Standard" um das dir-Attribut erweittern.

<p dir="auto">$CMS_VALUE(#content)$</p>

Damit wird automatisch erkannt, ob es sich bei dem eingegebenen Text um RTL oder LTR Text handelt und dieser entsprechend dargestellt. Es muss aber sichergestellt sein, dass die Parent-Container kein Text-Alignment vorgeben, da RTL-Text sonst nicht rechtsbรผndig dargestellt wird. Der Nachteil dieser Workarounds ist, dass die Schreibrichtung auf Basis des ersten Zeichens im Absatz festgelegt wird und es somit zu Alignment-Problemen kommt, wird RTL-Text (arabisch) mit LTR-Text (deutsch) gemischt (siehe dazu auch http://www.w3.org/TR/html5/dom.html#the-dir-attribute).

Type a product name