Typo3 - Rich Text Editor (RTE)

RTE-Konfiguration als Extension laden

Todo. Vgl. die Extension Rich Text Editor pre-configuration die bei den Examples steht.

RTE einrichten

Hinweis:

Ab Version 4 ist der Editor HTMLArea eingesetzt, den es für frühere Versionen als Extension gibt. Für Typo3 Versionen unter 4 muß die HTMLArea Extension in einer Version kleiner 1.3 installiert werden sonst gibt's eine Fehlermeldung beim Verlinken.

Das Aussehten des RTE, die verfügbaren Optionen und die HTML-Ausgabe läßt sich einstellen. Über das PageTS Config Feld der Seiten kann man z.B. einzelne Funktionen des RTE für den Seitenbaum abstellen.

RTE HTML-Ausgabe

Der RTE formatiert verändert den HTML Code auf verschiedene Weise. Wie er das macht läßt sich beeinflussen. Hier einige nützliche Beispiele:

Restriktive RTE-Konfiguration

1.Schritt: Nur die Inhaltselemente Text und Text mit Bild sollen mit dem RTE bearbeitet werden.

Im PageTS-Config Feld:

RTE.default.disabled=1
RTE.config.tt_content.bodytext.types{
   text.disabled = 0
   textpic.disabled = 0
}

2. Schritt: Nur noch die Standardformatierung und zwei Spezial formatierungen zur Auswahl lassen:
<pre>
RTE.classes{
   highlight{
      name = Highlight
      value = font:bold; color: red;
   }
   zitat{
      name = Zitat
      value=font:italic 15px; margin-left:20px;
   }
}
RTE.default.classesCharacter = highlight, zitat

3.Schritt: Üver das User TSConfig kann man nun einstellen welche Menüoptionen dem User angezeigt werden.

   options.RTEkeyList = class, bold, italic, link

htmlArea

Mit der Extension htmlarea steht auch für Mozilla basierte Browser ein Editor zur Verfügung der auf dem bekannten HTMLArea basiert.

Viele der RTE Optionen funktionieren auch in htmlarea, darüber hinaus auch noch einige weitere.

Konfigurationsbeispiele htmlarea

Eigene Tags verwenden

RTE.default.proc.allowTags = list-of-allowed-tags
RTE.default.proc.HTMLparser_rte.tags.mycustomtag.protect =1

where list-of-allowed-tags is the list of all allowed tags, including your custom tag, and mycustomtag is the name of your tag.

Klasse für Tabellen ändern

«Typo3 always replaces the class I selected in the RTE for a table with the class "contenttable". Do you have an idea how to switch that off?» Assuming that you have installed extension CSS Styled Content (css_styled_content), add the following line in your TS template Setup field:

lib.parseFunc_RTE.externalBlocks.table.stdWrap.HTMLparser.tags.table.fixAttrib.class.list >

The contenttable class will then be added only if no class is specified for the table.

diverses

eigene Klassen

RTE {
    classes {
        Infobox {
            name = Infobox
            value = eigenschaften
        }
    }

    default {
        classesParagraph = Infobox
        contentCSS = fileadmin/templates/version1/css/style.css
        classesCharacter = Infobox
        proc.allowedClasses (
            Infobox, ...
        )
    }
}

Probleme und Lösungen

htmlarea - Bilder lassen sich nicht speichern

Das "Problem" liegt darin dass htmlarea standardmässig so konfiguriert ist:

## REMOVE IMG TAGS
entryHTMLparser_db.tags.img.allowedAttribs = 0
entryHTMLparser_db.tags.img.rmTagIfNoAttrib = 1

Damit werden beim Speichern in typo3 also zuerst alle Attribute aus dem Image-Tag entfernt und schließlich der gesamte Tag auch noch, weil er ja kein Attribut mehr enthält.

Ohne Häcken im Extension-Manager tut es also auch

## SAVE IMG TAGS
entryHTMLparser_db.tags.img.allowedAttribs = alt,class,style,src,title
entryHTMLparser_db.tags.img.rmTagIfNoAttrib = 1

Vor allem das Attribut src ist wichtig ;-)

htmlarea - Fehlermeldung wenn Bilder im Frontend angezeigt werden sollen

Bei Versionen unter Typo3 4.0 eine niedrigere Version von htmlarea verwenden (1.1.3 oder evt. 1.1.6)