Dies ist eine alte Version des Dokuments!
Der standardmäßig installierte Rich Text Editor lässt sich umfangreich konfigurieren. Im Extension Manager ist zwischen drei Voreinstellungen (Minimal, Typical, Demo) wählbar. Auch lässt sich die Nutzung von Bildern im RTE bequem einstellen. Für die Nutzung einiger Buttons muss enableInlineElements
aktiviert werden (z.B. emphasis
). Über die TSconfig kann man den RTE auch individuell gestalten.
Damit die Ansicht im RTE der Frontendausgabe nahe kommt, kann ein CSS-Dokument mit dem RTE verknüpft werden. In diesem sollten nur relevante Formatierungen vorhanden sein; die Verwendung des Frontend-CSS mit Angaben zum Aufbau etc. wird nicht empfohlen.
RTE.default { contentCSS = fileadmin/template/rte.css useCSS = 1 }
Einige Angaben fügen HTML-Elemente mit Klassen zum Text hinzu, z.B. textstyle
. Diese haben zwar Auswirkungen auf die Ansicht im RTE, nicht aber im Frontend. Hierfür müssen noch Definitionen in der entsprechenden CSS-Datei definiert werden.
Die RTE-Buttons lassen sich einzeln ein- und ausblenden und neu sortieren. Diese Einstellungen werden in der Page TSconfig vorgenommen.
blockstylelabel | Bezeichnung vor dem Blockstil-Dropdownmenü. |
---|---|
blockstyle | Fügt dem Absatz den gewählten Klassennamen zu. Achtung: Es können mehrere Klassen nacheinander ausgewählt werden, die sich im Frontend ungewünscht ergänzen könnten (z.B. zwei verschiedene Rahmen oder Ausrichtungen). Mit remove block style bzw. no block style können die Klassen nacheinander wieder entfernt werden. |
textstylelabel | Bezeichnung vor dem Textstil-Dropdownmenü. |
textstyle | Fügt dem Text ein span mit dem gewählten Klassennamen zu. |
fontstyle | Fügt per Inline-Style eine font-family -Angabe hinzu. |
fontsize | Fügt per Inline-Style eine font-size -Angabe hinzu. |
formatblock | Formatiert den Textblock z.B. zu einer Überschrift. Teilweise lassen sich die Formatierungen ergänzen. Mit remove block format bzw. no block format können die Formatierungen nacheinander wieder entfernt werden. |
blockquote | Fügt ein <blockquote> (Zitat) hinzu. |
insertparagraphbefore | Fügt einen (leeren) Absatz <p></p> vor dem aktuell gewählten Absatz hinzu. |
insertparagraphafter | Fügt einen (leeren) Absatz <p></p> nach dem aktuell gewählten Absatz hinzu. |
lefttoright | Fügt dem Absatz das Attribut dir=„ltr“ hinzu (Textfluss links von nach rechts). |
righttoleft | Fügt dem Absatz das Attribut dir=„rtl“ hinzu (Textfluss von rechts nach links). |
language | Markiert den gewählten Text als gewählte Sprache. |
showlanguagemarks | (De)aktiviert einen Marker vor Inhalten, die ein Sprachattribut lang=„xy“ enthalten. |
left | Fügt dem Element eine Klasse align-left hinzu, die im FE noch definiert werden muss. |
center | Fügt dem Element eine Klasse align-center hinzu, die im FE noch definiert werden muss. |
right | Fügt dem Element eine Klasse align-right hinzu, die im FE noch definiert werden muss. |
justifyfull | Fügt dem Element eine Klasse align-justify hinzu, die im FE noch definiert werden muss. |
orderedlist | Fügt eine nummerierte Liste hinzu. |
unorderedlist | Fügt eine unsortierte Liste hinzu. |
definitionlist | |
definitionitem | |
outdent | Entfernt ein <div class=„indent“> , die zuvor gesetzt wurde. |
indent | Fügt dem Element ein <div class=„indent“> (einrücken) hinzu. Das Verschachteln mehrerer dieser Elemente ist möglich. |
formattext | |
bidioverride | |
big | Markiert den Text mit <big> . |
bold | Fügt ein <span style=„font-weight: bold;“> hinzu. |
citation | |
code | |
definition | |
deletedtext | Markiert den Text mit <del> . |
emphasis | Markiert den Text mit <em> . |
insertedtext | |
italic | Fügt ein '<span style=„font-style: italic;“> hinzu. |
keyboard | |
monospaced | |
quotation | |
sample | |
small | Markiert den Text mit <small> . |
span | |
strikethrough | Fügt ein <span style=„text-decoration: line-through;“> hinzu. |
strong | |
subscript | Fügt ein <span style=„vertical-align: sub;“> hinzu. |
superscript | Fügt ein <span style=„vertical-align: super;“> hinzu. |
underline | Fügt ein <span style=„text-decoration: underline;“> hinzu. |
variable | |
textcolor | Bietet eine Auswahl an Textfarben. |
bgcolor | Bietet eine Auswahl an Hintergrundfarben. |
textindicator | Zeigt die aktuelle Formatierung des gewählten Textes an. |
editelement | |
showmicrodata | |
emoticon | Bietet eine Auswahl von 16 Smilies an, die von TYPO3 mitgeliefert werden. |
insertcharacter | Bietet eine Auswahl an Sonderzeichen an, die der Benutzer bequem im RTE verwenden kann (Durchmesser, Copyright, etc.). |
insertsofthyphen | |
line | Fügt an der gewählten Stelle eine Linie mit <hr /> ein. |
link | Ermöglicht das Setzen von Ankern: interne/externe Links, Dateilinks, E-Mails. |
unlink | |
image | Ermöglicht das Einbetten von Bildern im RTE. |
table | Ermgölicht das Anlegen einer Tabelle mit vielen Einstellungsmöglichkeiten. |
user | Ermöglicht die Verwendung selbst erstellter HTML-Elemente. Diese müssen noch erstellt werden, sonst ist das Feld leer (siehe unten). |
acronym | |
findreplace | Ermöglicht das Suchen und Ersetzen von Wörtern und Wortteilen. |
spellcheck | Ermöglicht eine Rechtschreibprüfung. Hierzu muss allerdings noch zusätzliches in TYPO3 installiert werden (z.B. aspell), vorher wird der Button nicht angezeigt. |
chMode | Zwischen RTE-Ansicht und Quelltext wechseln. |
inserttag | Einer Textauswahl ein HTML-Element mit Attributen hinzufügen. |
removeformat | Ermöglicht das Entfernen verschiedener Formatierungen, z.B. MS Word. |
copy | Auswahl kopieren. |
cut | Auswahl ausschneiden. |
paste | Auswahl einfügen. |
pastetoggle | Das Einfügen ohne Formatierungen ein-/ausschalten. |
pastebehaviour | |
undo | Widerrufen von Arbeitsschritten. |
redo | Wiederherstellen von Arbeitsschritten. |
about | Zeigt den Hinweis über die RTE-Version mit Browser-Support etc. an. |
toggleborders | Tabellenränder im RTE ein-/ausblenden. |
tableproperties | Tabelleneinstellungen anpassen (Breite, Textausrichtung, Rahmen, etc.). |
tablerestyle | |
rowproperties | Zeileneinstellungen anpassen (Breite, Textausrichtung, Rahmen, etc.). |
rowinsertabove | Spalte oben hinzufügen. |
rowinsertunder | Spalte unten hinzufügen. |
rowdelete | Gewählte Zeile löschen. |
rowsplit | Gewählte Zeile teilen. |
columnproperties | |
columninsertbefore | Zeile links hinzufügen. |
columninsertafter | Zeile rechts hinzufügen. |
columndelete | Gewählte Spalte löschen. |
columnsplit | Gewählte Spalte teilen. |
cellproperties | Zelleneinstellungen anpassen (Breite, Textausrichtung, Rahmen, etc.). |
cellinsertbefore | Zelle links hinzufügen. |
cellinsertafter | Zelle rechts hinzufügen. |
celldelete | Einzelne gewählte Zelle löschen. |
cellsplit | Eine Zelle aufteilen. |
cellmerge | Zellen verbinden (vorhandene Zellen werden verschoben, nicht überschrieben). Zwei Abfragen: column, row. |
# Kommaseparierte Liste aller möglichen Werte: blockstylelabel, blockstyle, textstylelabel, textstyle, fontstyle, fontsize, formatblock, blockquote, insertparagraphbefore, insertparagraphafter, lefttoright, righttoleft, language, showlanguagemarks, left, center, right, justifyfull, orderedlist, unorderedlist, definitionlist, definitionitem, outdent, indent, formattext, bidioverride, big, bold, citation, code, definition, deletedtext, emphasis, insertedtext, italic, keyboard, monospaced, quotation, sample, small, span, strikethrough, strong, subscript, superscript, underline, variable, textcolor, bgcolor, textindicator, editelement, showmicrodata, emoticon, insertcharacter, insertsofthyphen, line, link, unlink, image, table, user, acronym, findreplace, spellcheck, chMode, inserttag, removeformat, copy, cut, paste, pastetoggle, pastebehaviour, undo, redo, about, toggleborders, tableproperties, tablerestyle, rowproperties, rowinsertabove, rowinsertunder, rowdelete, rowsplit, columnproperties, columninsertbefore, columninsertafter, columndelete, columnsplit, cellproperties, cellinsertbefore, cellinsertafter, celldelete, cellsplit, cellmerge
RTE.default { showButtons := addToList(pastetoggle,insertcharacter) hideButtons = deletedtext }
Die Buttons lassen sich in der Reihenfolge neu sortieren und mit Linien, kleinen Abständen und Zeilenumbrüchen unterteilen. Buttons, die nicht mit showButtons
aktiviert wurden, werden auch nicht angezeigt. Buttons, die zwar aktiviert wurden, aber nicht in toolbarOrder
gesetzt sind, werden ebenfalls nicht angezeigt.
Schlüsselwörter zur Unterteilung:
space → kleiner Abstand (mehrere hintereinander folgende haben keine Auswirkung auf die Abstandgröße)
bar → Trennlinie
linebreak → Zeilenumbruch
RTE.default { toolbarOrder = bold, italic, bar, left, center, right, justifyfull, linebreak, undo, redo, chMode }
Die Basiskonfiguration kann nach Belieben verändert oder ergänzt werden. So kann man andere Schriften, Farben oder Rahmen für den Anwender bereitstellen.
Der Farbwähler hat eine voreingestellte Liste von 72 Farben sowie ein Feld zur Eingabe von eigenen Farben im Hexadezimalwert. Er kann um eigene Farben ergänzt werden.
# Button für Textfarbe hinzufügen, ohne die bestehende Liste der Buttons zu überschreiben. RTE.default.showButtons := addToList (textcolor) # Standardfarben ausblenden. Ist nicht zwingend notwendig, um eigene Farben zu definieren. RTE.default.disableColorPicker = 1 # Farben mit Hexadezimalwert anlegen. Die Farbnamen sind frei wählbar. RTE.default.colors = rot, gruen, blau RTE.colors { rot { name = Rot value = #FF0000 } gruen { name = Grün value = #00FF00 } blau { name = Blau value = #0000FF } }