Die CSS-Klassen werden an vier verschiedenen Stellen definiert:

1. in der unter RTE.default.contentCSS angegebenen CSS-Datei.
2. im Objektpfad RTE.classes: hier werden der CSS-Name der  Klasse und der in der Auswahlliste anzuzeigende Titel festgelegt. Wenn keine CSS-Datei verwendet wird, stehen hier auch die Formatierungsangaben.
3. im Objektpfad RTE.default.proc.allowedClasses; dort müssen durch Komma abgetrennt  alle Klassen angegeben werden, die den Weg vom RTE in die Datenbank überleben sollen.
4. in eine der folgenden Kommalisten, die darüber entscheiden, welche Klassen in welcher Auswahlliste erscheinen sollen:

• RTE.default.classesParagraph (Klassen, die in der Auswahl für Blockelemente erscheinen sollen)
• RTE.default.classesCharacter (Klassen für Inline-Elemente)
• RTE.default.classesTable (Klassen für Tabellen-Elemente)
• RTE.default.classesTD (Klassen für Tabellenzellen, <td> und <th>)
• RTE.default.classesImage (Klassen für Bilder)
• RTE.default.classesLinks (Klassen für Links) -die Klasse RTE.classesAnchor bietet aber mehr Optionen
• RTE.classesAnchor, RTE.default.classesAnchor und RTE.default.classesAnchor.default
• RTE.default.showTagFreeClasses (Klassen, deren HTML Element nicht definiert ist)

Eine Zuweisungweisung wie classesParagraph = paragraph-1 überschreibt die Standardeinstellungen. Die Funktion addToList kann benutzt werden, um Klassen zu den Standartklassen hinzuzufügen: classesParagraph := addToList(paragraph-1)

Die Konfiguration gehört in die TSconfig der Rootpage. (Seiteneigenschaften bearbeiten -> Options)

Eine Beispiel Konfiguration:

RTE.default {
  contentCSS = fileadmin/css/main/typo3-RTE.css
  showTagFreeClasses=1
  classesCharacter := addToList(align-left, align-center, align-right)
  classesParagraph := addToList(paragraph-1)
  classesTable := addToList(table-1, table-2)
  classesTD := addToList(cell-1)
  classesAnchor = internal-link
  defaultLinkTarget = _top
  classesImage := addToList(pic-1)
  proc {
    allowedClasses := addToList(align-left, align-center, align-right, paragraph-1, table-1, table-2, cell-1, pic-1)
    denyTags < RTE.default.buttons.inserttag.denyTags
  }
  FE {
    proc  {
      allowedClasses < RTE.default.proc.allowedClasses
    }
  }
}

Eine Beispiel CSS Datei:

/* #############################
** ### classesCharacter ########
** #############################
*/

span.align-left {text-align:left;}

span.align-center {text-align:center;}

span.align-right {text-align:right;}

/* #############################
** ### classesParagraph ########
** #############################
*/

p.paragraph-1 {font-weight:bold;}

/* #############################
** ### classesTable ########
** #############################
*/

table.table-1 {border:1px solid #f0f0f0;}

table.table-2 {width:100%;}

td.cell-1 {padding:10px;}

/* #############################
** ### TagFreeClasses ##########
** #############################
*/

.red {color:#ff0000;}

.green {color:#00ff00;}

Getestet auf TYPO3 4.2.6, htmlArea RTE 1.7.9

Hier ist das Manual zum htmlArea RTE 1.7.9