RTE Editor personalisieren, eigene Stile einbinden

Um eigene Stil-Definitionen im RTE zu verwirklichen, muss einfach nur folgende Konfiguration im TS Config der Rootseite des Seitenbaumes eingefügt werden.

# Konfiguration des RTE
RTE {

    # Grundeinstellungen
    default {
    
        # CSS-Datei einbinden fürs Backend einbinden
        contentCSS = fileadmin/vorlagen/rte.css
        useCSS = 1
        # Buttons einblenden
        showButtons := addToList(image,emoticon)
        # Hinzufügen von Block und Textstilen
        classesParagraph := addToList(weissaufrot,blauhgr)
        classesCharacter := addToList(roteschrift,sehrgross)
    
    }
    
    # Definition der Darstellung im Auswahlfeld
    classes {
    
        weissaufrot {
            
            name = Weiss auf Rot
            value = background-color:#cc3333; color:#ffffff
        }
    
        blauhgr {
            
            name = blauer Hintergrund
            value = background-color:#3333cc;
        }
    
        roteschrift {
            
            name = Rote Schrift
            value = color:#cc3333;
        }
        
        sehrgross {
            
            name = Grosse Schrift
            value = font-size: 18px;
        }
    }
    
    # erlauben des Speicherns der neuen Stile
    default.proc {
        
        allowedClasses := addToList(weissaufrot,blauhgr,roteschrift,sehrgross)
    }

}

Die entsprechende CSS Datei "rte.css", die beim RTE eingebunden wird, muss dann folgende Klassen aufweisen.

p.weissaufrot {
 background-color: #cc3333; color: #ffffff;
}
p.blauhgr {
 background-color: #3333cc;
}
span.roteschrift {
 color: #cc3333;
}
span.sehrgross {
 font-size: 18px;
}