TYPO3@lisardo

Im RTE kann man horizontale Linien einfach mittels Blockstilen zur Verfügung stellen, die einem Absatz zugewiesen werden können. Diese Stile müssen allerdings vom Entwickler zur Verfügung gestellt werden. 

Dieser Absatz hat z. B. eine Linie oberhalb, die auf diese Art eingefügt wurde. 

Der RTE kann allerdings auch das HTML-Element <hr /> einsetzen, das unabhängig ist von den Blockelementen bzw. Absätzen.

Standardmäßig macht der RTE dabei leider einen Fehler: er packt die Linie in einen Absatz: <p><hr /></p>, was beim Validieren der Seite zu einem Fehler führt. Dieser Fehler stört allerdings die optische Darstellung nicht, wer also mit einem Validierungsfehler leben kann, muss nichts weiter unternehmen. 

Der Fehler kann eleminiert werden, wenn in das TypoScript-Template der Seite diese Zeilen eingefügt werden:

Leider hat das aber andere negative Konsequenzen. Wenn ich z. B. hier so eine Linie einfüge:

werden die folgenden Absätze nicht mehr richtig geparst. So werden z. B. in meinen Code-Snippets der <pre>-Tag nicht mehr korrekt von  tx-vjrtecodesnippets erkannt und geparst: 

lib.parseFunc_RTE.externalBlocks := addToList (hr)
lib.parseFunc_RTE.externalBlocks.hr.stripNL = 1

Ausserdem werden offensichtlich Links nicht mehr geparst. Das ganze ist ein Problem, das offenbar seit 2007 im Bugtracker steht, aber bis heute nicht wirklich gelöst wurde (hier sollte eigentlich ein Link stehen, der aber nicht geparst wird. Er folgt im nächsten Absatz, den ich in ein neues Inhaltselement packe.) 

Fazit:

Ich empfehle die Verwendung von Blockstilen wie ganz oben beschrieben. Wenn man unbedingt <hr /> verwenden muss, so sollte der Workaround gründlich getestet werden. Wenn – wie bei mir hier – die Fehler nicht gefixt werden können, dann muss man wohl oder übel mit dem Syntaxfehler des RTE leben. Wie gesagt: die Darstellung ist ja korrekt, es gefällt nur den Validatoren nicht.

Und hier ist der Link in den Bugtracker nochmals ...

[Update]
Für den Bug gibt es seit kurzem einen Fix im Bugtracker von Stanislas Rolland, der das Problem behebt. (Vielen Dank an Stanislas!)

Also Patch einspielen, oder aufs nächste Update von TYPO3 warten, dann wirds wohl dabei sein. 

[Update 2]

In Version 4.4.6 funktioniert es jetzt. 

In der Grundkonfiguration entfernt der RTE eine Reihe von nicht erwünschten Tags. Je nach eingestellter Grundkonfiguration erhält er eigene Tags, löscht diese oder wandelt sie in Entities um. Um eigene Tags zu ermöglichen, sollte deshalb der  Konfiguration des RTE einiges hinzugefügt werden. 

Anstatt der Schreibweise := addToList(sondertag) können natürlich auch alle Tags aufgeführt werden, z. B. so:

Das ist natürlich umständlicher, aber man weiss genau, was man erlaubt hat und was nicht.

Damit der Tag im Frontend ausgegeben wird, muss zusätzlich im TypoScript des Templates noch folgendes hinzugefügt werden:

Beziehungsweise für alle Texteingabefelder, die nicht den RTE benutzen:

In der Regel wird man aber den eigenen Tag nicht im Frontend ausgeben wollen, sondern man möchte ihn auf eine bestimmte – individuelle – Art parsen. Das kann mit Hilfe eines eigenen PHP-Skripts erfolgen oder über eine TypoScript-Konfiguration.

Für ein eigenes PHP-Skript kann man eine eine Extension anlegen und das hier ins Setup des TypoScript-Templates schreiben:

Man kann aber auch im Kickstarter eine Extension anlegen, die sich im das Parsen eines einzigen Tags kümmert. In der Auswahl der Frontendplugins gibt es am Ende der Liste die Option, einen Custom Tag zu verarbeiten. In diesem Fall muss nichts mehr ins Setup geschrieben werden, da die Einbindung das localconf der neuen Extension übernimmt.

Oder man geht komplett über TypoScript, zum Beispiel so:

Einfügen über User-Elemente

Eigene HTML-Tags zu erlauben ist natürlich nur der erste Schritt – wir müssen es den Redakteuren noch ermöglichen, diese auch einzugeben. Normalerweise werden diese Tags nämlich bei der Eingabe bereits in Entities umgewandelt. Man könnte natürlich auf die HTML-Eingabe umschalten oder den RTE vorübergehen deaktivieren, aber das ist eigentlich nicht zumutbar.

Wir können es aber über eine eigene Bibliothek mit User-Elementen ermöglichen.

Zuerst muss das »user«-Werkzeug erlaubt werden. Dazu muss es entweder unter »showButtons« hinzugefügt oder bei »hideButtons« ausgelassen werden. Je nachdem, wie man prinzipiell den RTE konfiguriert hat. Ich gehe über hideButtons und lösche dort »user« aus der Liste:

Danach sollte im RTE ein Werkzeug auftauchen mit dem Tooltipp »Insert custom element«. Bei Klick öffnet sich ein Dialog, mit dem die neuen Elemente eingefügt werden können. Damit die Elemente zur Vefügung stehen, müssen diese noch konfiguriert werden:

Dabei bildet »10« eine Kategorie mit der Bezeichnung »Eigene Sondertags« und »1» ist das erste Element. Die folgenden Elemente dieser Kategorie beginnen mit »2«, »3« und so weiter. Wichtig ist die Angabe des Modus – damit wird erreicht, dass der markierte Text vom Content umgeben wird.

Mit dieser Technik können nicht nur Tags ermöglicht werden, sondern es können Bilder oder Textbausteine zur Verfügung gestellt werden oder auch weiterführende Formatierungen mit <div>-Containern. Es können sogarPHP-Skript darüber aufgerufen werden, die markierte Inhalte vor der Übergabe verarbeiten.

Fehler / Probleme

Bei uns tauchte gelegentlich das Problem auf, dass bei <div>-Containern, die auf diese Art in den RTE eingefügt wurden, bei der Ausgabe ins Frontend der äusserste Container in einen p-Tag umgewandelt wurde. Da in einen p-Tag kein <div> geschachtelt werden darf, hat das unangenehme Konsequenzen – unter Umständen auf das Rendering der gesamten Seite. Dieser Fehler ist ein Feature und kann abgeschaltet werden durch diesen Eintrag ins TypoScript Setup:

Dieser Eintrag soll eigentlich dafür sorgen, dass versehentlich eingefügte <div>-Tags durch Absätze ersetzt werden. Bei einigermaßen guter Konfiguration des RTE ist dieses Feature aber überflüssig und kann abgeschaltet werden.

Weiterführende Links

• Manual auf Typo3.org Hinweis: das Manual ist nicht auf dem üblichen Weg zu finden; die Extension gehört zwar mittlerweile zur Standardinstallation, aber sie wird in der Core-Dokumentation gelistet. Es gibt deshalb eine eigene Extension nur für das Manual von htmlArea RTE. Interessant sind hier vor allem die Abschnitte »userCategory« und »userElements«
• Tags Der Abschnitt über eigene Tags in TSref. 

Es besteht die Möglichkeit Konstanten zu definieren, die im RTE bzw. in allen Texteingabefeldern verwendet werden können. Diese Konstanten werden im RTE einfach in dieser Schreibweise eingefügt: ###MEINE_KONSTANTE###. Bei der Ausgabe im Frontend können diese Konstanten gegen einen vorgegeben Text oder gegen ein HTML-Snippet ersetzt werden.

Dazu müssen die Konstanten lediglich auf der obersten Ebene im Setup des TypoScript-Templates definiert werden:

Verantwortlich dafür sind diese Einträge, die standardmäßig eingeschaltet sind:

Damit wird sowohl im RTE wie in allen Texteingabefeldern die Ersetzung der Konstanten eingeschaltet. Das gilt auch für die Eingabefelder von Extensions, soweit diese durch eine der beiden Funktionen geparst werden.

Platzhalter oder Abkürzungen

Neben diesen Konstanten können Abkürzungen oder Ausdrücke definiert werden, die bei der Ausgabe ins Frontend ersetzt oder expandiert werden. Diese Abkürzungen oder Platzhalter müssen im TypoScript-Setup zunächst definiert werden:

Dabei ist darauf zu achten, dass diese Definition diesmal nicht global erfolgt sondern lokal; um sie also auch in anderen Textfeldern verwenden zu können müssen sie für die normale parseFunc nochmals definiert werden.

Im RTE muss nur die Abkürzung oder der Platzhalter eingegeben werden – es ist keine weitere Auszeichnung erforderlich. Im obigen Beispiel wird ein alleinstehendes »T3« im Frontend automatisch durch »Typo3« in einem span-Tag ersetzt. Allerdings sollte dabei bedacht werden, dass diese Abkürzungen immer ersetzt werden; sinnvoll wären also nur eindeutige Abkürzungen.

Weiterführende Links

Der Abschnitt über die ParseFunc im TSconfig.

Achtung Update!

Dieser Artikel ist schon einigermaßen alt – im wesentlichen stimmen die hier beschriebenen Techniken noch, aber zur Zeit läuft vor allem die Extension linkhandler nicht in TYPO3 in Version 6.x. Sie wirft im Backend solche Fehler, dass es nicht mehr zugänglich ist. Also mein Tipp: auf keinen Fall über den Extensionsmanager installieren, sondern diesen Fork von Github verwenden. Einfach herunterladen, das zip-Archiv auspacken und den entstehenden Ordner umbenennen in »linkhandler«. 

Eine Anpassung an die neue News-Extension findet ihr in einem neueren Artikel zu diesem Thema: Links im RTE auf News-Einträge mit der Extension linkhandler

Mit der Extension linkhandler können im RTE (bzw. in den normalen Inhaltselementen) Links auf News-Einträge oder auf beliebige sonstige Datensätze erstellt werden. Sie funktioniert sehr gut und lässt sich ideal konfigurieren.

Installation

Normal installieren und nicht vergessen, das statische Template einzubinden. Danach funktioniert die Extension insoweit, dass man Links im RTE erstellen kann; allerdings werden diese noch nicht im Frontend geparst. Das muss über TypoScript erst konfiguriert werden.

Konfiguration des Link-Browsers im RTE

Dazu folgende Zeilen im TSconfig der Rootseite eingeben (bzw. der Seite, die auch die restliche Konfiguration des RTE enthält)

Konfiguration der Links

Die Links müssen im TypoScript-Setup konfiguriert werden. Die einfache Variante verwendet nur eine einzige Zielseite für die Singledarstellung der News:

Eine etwas komplexere Variante, die abhängig von der pid der News-Datensätze eine andere Seite für die Single-Darstellung aufruft:

Man kann auch beliebige andere Tabellen ansprechen, auch aus eigenen Extensions. Hier ein Beispiel im TSConfig, das weitere Reiter im Dateibrowser des RTE erzeugt, die auf Datensätze von eigenen Extensions zugreifen:

Dazu dann diese Entsprechung in Setup für das Verarbeiten der Links:

Dabei ist tx_buchtitel_liste der Name der SQL-Tabelle, parameter die uid der Zielseite mit der Single-Darstellung. So können beliebig viele Reiter im RTE angelegt werden, die auf Datensätze in beliebigen Tabellen verweisen.

Linkhandler für t3blog

Die Einstellungen für t3blog funktionieren prinzipiell genauso. Zunächst das TSconfig:

Im Setup gibt es aber eine Besonderheit, da für Links auf einen Blogeintrag  neben der uid des Postings auch das Datum iausgegeben werden muss – zumindest ist das erforderlich, wenn RealURL eingesetzt wird. Hier hilft die stdWrap-Funktion mit cObject weiter: