TYPO3 und der RTE

Mit der Sys-Extension rte erhielt TYPO3 in der Version 3.8 erstmals eine Art "Aufsatz" für den HTML-Tag <textarea>. Damit war es erstmals möglich in eine textarea formatierten Text einzutragen. Heutzutage besitzt nahezu jedes x-beliebige Forum einen sogenannten RTE (RichText-Editor), um in Beiträgen Optionen wie fett, kursiv und unterstreichen realisieren zu können.

Ab Version 4.0 wurde die Sys-Extension rte durch die Sys-Extension rtehtmlarea ersetzt. Als Alternative zur rtehtmlarea kann man sich aus dem Repository von TYPO3 auch die Extension tinyrte herunterladen. Der Unterschied zwischen den einzelnen RTEs ist die Art und Weise, wie man sie konfigurieren kann und sie unterscheiden sich auch optisch. Vom Hören-Sagen heißt es, dass die rtehtmlarea unglaublich schwer zu konfigurieren sei. Ein Grund mehr, sich diese RTE hier einmal genauer anzuschauen.

Die Sys-Extension rtehtmlarea besitzt schon von der Installation her vordefinierte Block- und Textstile wie rechtsbündig, zentriert, linksbündig, Text mit grauem Hintergrund und einige andere Stile mehr. Einen Nachteil aber hat so eine RTE-Box dennoch:

Eine Webseite unterliegt normalerweise immer einem ganz bestimmten Design. Wenn schwarzer Text verwendet werden soll, dann sollte sich diese Schriftfarbe über alle Webseiten dieser Homepage fortsetzen. Dank einer RTE können die Redakteure die Farben aber selber auswählen, können Tabellen erstellen und die Schrift dank verschiedener Überschriften-Stile viel zu groß anzeigen lassen. Es gibt die Möglichkeit, die RTE-Box nur mit den Optionen zu versehen, die für das Design der Homepage erlaubt sind. Diese Einstellungen werden über die sogenannte User TS-Config und die Page TS-Config ermöglicht.

Die Installations-Voreinstellungen für die rtehtmlarea kann man sich entweder über die Datei:

http://[Homepage]/typo3/sysext/rtehtmlarea/res/typical/pageTSConfig.txt

oder direkt im TYPO3-Backend anschauen:

Web -> Info -> root-Seite auswählen -> Im Drop Down-Feld: Seiten TS-Config auswählen -> Im Drop Down-Feld darunter RTE. auswählen

Classes

WICHTIG!

Die Stile, die in den Drop Down-Listen der RTE angezeigt werden sollen, müssen in einer CSS-Datei definiert werden.
Mit den Klassen, die in der TS-Config definiert werden, kann man nur die Einträge
(die ihren Ursprung in der CSS-Datei haben) verschönern.

Beipiel: In der CSS-Datei steht:

span.name-of-person { color: #10007B; }

Das Script des RTE erkennt nun automatisch, dass es sich bei um einen Text-Stil handelt, also um einen Bereich innerhalb eines Satzes, der z.B. fett geschrieben werden soll. Wenn in die TS-Config diese name-of-person-Klasse nicht weiter definiert wird, erscheint in dem Drop Down-Feld für Textstile ein Eintrag: name-of-person. Mit Hilfe der TS-Config kann dieser CSS-Klasse nun ein Name und ein Wert hinzugefügt werden. In der Original-Datei sieht es folgendermaßen aus:

name-of-person {
  name = LLL:EXT:rtehtmlarea/res/contentcss/locallang.xml:name-of-person
  value = color: #10007B;
}

Dieser LLL:EXT-Eintrag verweist auf eine Sprachdatei: locallang.xml, in der für die Klasse name-of-person der deutsche Spracheintrag für ein deutsches TYPO3-Backend herausgesucht wird. In dem RTE steht also Name der Person und nicht name-of-person. Mit value kann für diesen Eintrag in der Drop Down-Liste ein eigenes Design erstellt werden, das unabhängig von der Definition in der CSS-Datei ist. Heißt: In der CSS-Datei wird z.B. definiert, dass die Klasse name-of-person in roter Schrift dargestellt werden soll, aber mit dem value-Eintrag in der TS-Config, wird definiert, dass das Wort "Name der Person" in der Drop Down-Liste z.B. in grün angezeigt werden soll. Dieses Beipiel soll nur zeigen, dass es sich hierbei um zwei verschiedene Systeme handelt. Natürlich macht es Sinn beide Einträge in der gleichen Farbe darstellen zu lassen.