Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen der Seite angezeigt.

--- typo3:about:rte [2014/02/15 17:49] – [Die Ausgabe im Frontend] admin
+++ typo3:about:rte [2016/11/18 20:37] (aktuell) – RTE-Dialogfenster anpassen admin
@@ Zeile 9: / Zeile 9: @@
 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.
-Zudem werden einige HTML-Elemente, die dem RTE hinzugefügt wurden (z.B. <cite>), standardmäßig nicht geparst, wodurch diese Quellcode-Elemente im Frontend ausgegeben werden. Das Parsen dieser Elemente kann jedoch konfiguriert werden.
+Zudem werden einige HTML-Elemente, die dem RTE hinzugefügt wurden (z.B. <cite>), standardmäßig nicht geparst, wodurch diese Quellcode-Elemente im Frontend ausgegeben werden (-> <cite>Das Zitat</cite>). Das Parsen dieser Elemente kann jedoch konfiguriert werden.
 ===== CSS im RTE =====
 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.
+Auch wichtig: Um eigene Klassen im RTE verwenden zu können, **müssen** diese Klassen in der CSS-Datei des RTE vorhanden sein!
 <code typoscript>
 RTE.default {
-  contentCSS = fileadmin/template/rte.css
+  contentCSS = path/to/rte.css
-  useCSS = 1
 }
 </code>
@@ Zeile 70: / Zeile 71: @@
 ^small|Markiert den gewählten Text mit ''<small>''.|
 ^span|Markiert den gewählten Text mit ''<span>''.|
-^strikethrough|Fügt ein <span style="text-decoration: line-through;"> hinzu.|
+^strikethrough|Fügt ein ''<span style="text-decoration: line-through;">'' hinzu.|
 ^strong|Markiert den gewählten Text mit ''<strong>''.|
-^subscript|Fügt ein <span style="vertical-align: sub;"> hinzu.|
+^subscript|Fügt ein ''<span style="vertical-align: sub;">'' hinzu.|
-^superscript|Fügt ein <span style="vertical-align: super;"> hinzu.|
+^superscript|Fügt ein ''<span style="vertical-align: super;">'' hinzu.|
-^underline|Fügt ein <span style="text-decoration: underline;"> hinzu.|
+^underline|Fügt ein ''<span style="text-decoration: underline;">'' hinzu.|
 ^variable|Markiert den gewählten Text mit ''<var>'' (Variable).|
 ^textcolor|Bietet eine Auswahl an Textfarben.|
 ^bgcolor|Bietet eine Auswahl an Hintergrundfarben.|
 ^textindicator|Zeigt die aktuelle Formatierung des gewählten Textes an.|
-^editelement| |
+^editelement|Ermöglicht ein Menü, mit dem einem Element Attribute wie //id//, //lang// und //onmouseover// hinzugefügt werden können.|
-^showmicrodata| |
+^showmicrodata|ab TYPO3 4.7: (De)aktiviert einen Marker vor Inhalten, die Mikrodaten (//itemscope//, //itemtype// ...) enthalten.|
 ^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| |
+^insertsofthyphen|ab TYPO3 4.7: Ermöglicht das Setzen eines weichen Trennzeichens (Worttrennung durch den Browser an den angegebenen Stellen).|
 ^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| |
+^unlink|Entfernt einen zuvor gesetzten Anker.|
 ^image|Ermöglicht das Einbetten von Bildern im RTE.|
-^table|Ermgölicht das Anlegen einer Tabelle mit vielen Einstellungsmöglichkeiten.|
+^table|Ermöglicht 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| |
+^acronym|Markiert den gewählten Text mit ''<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.|
@@ Zeile 108: / Zeile 109: @@
 ^tablerestyle| |
 ^rowproperties|Zeileneinstellungen anpassen (Breite, Textausrichtung, Rahmen, etc.).|
-^rowinsertabove|Spalte oben hinzufügen.|
+^rowinsertabove|Zeile oben hinzufügen.|
-^rowinsertunder|Spalte unten hinzufügen.|
+^rowinsertunder|Zeile unten hinzufügen.|
 ^rowdelete|Gewählte Zeile löschen.|
 ^rowsplit|Gewählte Zeile teilen.|
-^columnproperties| |
+^columnproperties|Spalteneinstellungen anpassen.|
-^columninsertbefore|Zeile links hinzufügen.|
+^columninsertbefore|Spalte links hinzufügen.|
-^columninsertafter|Zeile rechts hinzufügen.|
+^columninsertafter|Spalte rechts hinzufügen.|
 ^columndelete|Gewählte Spalte löschen.|
 ^columnsplit|Gewählte Spalte teilen.|
@@ Zeile 187: / Zeile 188: @@
   }
 }
+</code>
+===== <select> Elemente ausblenden =====
+==== formatblock ====
+Mit **TSconfig** können unliebsame Optionen einfach entfernt werden:
+<code>
+RTE.default {
+  buttons.formatblock.removeItems = address,h5,h6,article,footer,header,nav,section,aside,div
+}
+</code>
+==== blockstyle ====
+Für das select-Menü ''blockstyle'' gibt es hierzu kein TSconfig! Was aber die Lösung bringt: In der **CSS** des RTE einfach die nicht gewünschten Klassen entfernen.
+----
+==== RTE-Dialogfenster anpassen ====
+Mit dem folgenden Snippet lässt sich die Fenstergröße des Link Wizards anpassen.
+**Page TSconfig:**
+<code typoscript>
+RTE.default {
+    buttons.link.dialogueWindow.width = 750
+    buttons.link.dialogueWindow.height = 750
+    buttons.link.dialogueWindow.positionFromTop = 10
+    buttons.link.dialogueWindow.positionFromLeft = 10
+}
 </code>

Snippets + Wiki

Benutzer-Werkzeuge

Webseiten-Werkzeuge

Unterschiede

Seiten-Werkzeuge