typo3-handbuch.net
typo3-handbuch.net

RTE – Rich Text Editor in TYPO3

Die Funktionsweise des Rich Text Editors lehnt sich stark an die bekannter Editoren wie Microsoft® Word oder OpenOffice Writer an. Er ist daher für den Benutzer leicht und intuitiv bedienbar. Der RTE verfügt – wie auch die übrigen Icons – über eine sensitive Hilfe (Tool-Tip), mittels derer Informationen zu jedem Icon bereitgestellt werden:

Wie viele Formatierungsoptionen bereitstehen, hängt davon ab, welche Module (bzw. Buttons) vom Administrator frei geschaltet wurden. Es können mehr, aber auch weniger Module bereitstehen. Mit dem RTE lassen sich Texte formatieren und Bilder, Verlinkungen oder Tabellen einfügen.

Um Formatierungen auf ein Wort oder einen Textabschnitt anzuwenden, ist der gewünschte Textbereich – anlog zum Vorgehen in Word – zu markieren und im Anschluss auf das entsprechende Icon zu klicken.

Wichtiger Hinweis: Text lässt sich per Copy&Paste mittels der Tastenkürzel STRG+C (kopieren) und STRG+V (einfügen) bequem aus einem Editor wie Microsoft® Word in den RTE kopieren - inklusive aller Formatierungen. Was auf den ersten Blick praktisch zu sein scheint und mit wenig Arbeit verbunden ist, hat seine Tücken, denn dabei werden auch spezifische Word-Formatierungsinformationen übernommen, so dass der Text nicht mehr dem vom Webdesigner definierten einheitlichen Layout entspricht (z.B. die Verwendung einer bestimmten Schriftart und Schriftgröße, etc.).

Die HTML-Ansicht veranschaulicht das Problem:

   So sieht der formatierte Text im Word aus:
   Dieser Satz hat fetten Text und kursiven Text.

Dieser Text wird von Word direkt in den RTE kopiert. In der HTML-Ansicht des RTE zeigt sich folgender Code:

<span style="font-size: 10pt; line-height: 115%; font-family: &quot;Verdana&quot;,&quot;sans-serif&quot;;">Dieser Satz hat <strong>fetten Text</strong>und <em>kursiven Text.</em></span><strong><span style="line-height: 115%;"><br /></span></strong><span style="line-height: 115%;"></span>

Wie vorstehender HTML-Code zeigt, werden dem Text zusätzliche Informationen mitgegeben. Die Schriftgröße (font-size) soll 10pt betragen, der Zeilenabstand (line-height) 115% und als Schriftart (font-family) soll Verdana zum Einsatz kommen, da der Text in Word mit diesen Formatierungen erstellt wurde.

Wurde vom Webdesigner für die Website einheitlich die Schrift Arial in Schriftgröße 12 definiert, so würde sich der neu aus Word in die Webseite integrierte Text also völlig anders darstellen als der übrige Inhaltstext. Selbst wenn die Website die gleiche Schriftart und Schriftgröße verwendet wie die Word-Textvorlage, ist es dennoch problematisch, wenn solche festen Formatierungen in den Text übernommen werden, da die Flexibilität verloren geht, den Text der Website später über wenige Änderungen im zentralen CSS einheitlich in einer anderen Schriftart und Schriftgröße darstellen zu können.

Ausweg: Die Formatierungen lassen sich mit Hilfe des Moduls Formatierungen entfernen eliminieren oder der Text wird von vornherein unformatiert in das RTE Textfeld eingefügt. Weitere Informationen werden unter Formatierungen entfernen bereitgestellt.

Kurzübersicht über die wichtigsten Icons des Rich Text Editors - RTE:
 

TYPO3 Icon RTE: Bold Fett/Bold

 Kursiv/Italic

TYPO3 Icon RTE: Unterschrichen Unterstrichen/Underlined

TYPO3 Icon RTE: Horizontale Linie horizontale Linie einfügen

TYPO3 Icon RTE: Text links buendig Linksbündig

TYPO3 Icon RTE: Text zentriert Zentriert

TYPO3 Icon RTE: Text rechts buendig Rechtsbündig

TYPO3 Icon RTE: Nummerierung Liste Nummerierung (nummerierte Liste)

TYPO3 Icon RTE: Unordered List Aufzählung (Liste mit Aufzählungspunkten)

TYPO3 Icon RTE: Sonderzeichen Einfügen von Sonderzeichen

TYPO3 Icon RTE: Verlinkung Link einfügen

TYPO3 Icon RTE: Tabelle einfuegen Tabelle einfügen

Bild einfuegen Bild einfügen

TYPO3 Icon RTE: Falsche Formatierung entfernen (falsche) Formatierungen im markierten Bereich entfernen

TYPO3 Icon RTE: Suchen Suchen und ersetzen

TYPO3 Icon RTE: Textmodus umschalten Textmodus umschalten

TYPO3 Icon RTE: Formatierung entfernen Formatierung entfernen

TYPO3 Icon RTE: Aktion Rückgängig Letzte Aktion rückgängig machen

TYPO3 Icon RTE: Aktion wiederholen Letzte Aktion wiederholen

TYPO3 Icon RTE: Credits Info Informationen zum Editor (Copyright, Entwickler)

Die meisten der vorgenannten Formatierungsmöglichkeiten sind selbsterklärend, so dass nachfolgend nur einige ausgewählte Funktionen sowie Formatierungen über Blockstile und Textstile näher betrachtet werden.

BLÄTTERN INNERHALB DER AKTUELLEN RUBRIK

  • VORHERIGE SEITE
  • NÄCHSTE SEITE
 
Feedback zur TYPO3 Webagentur und Webdesign, Köln