Grundlagen zum Rich-Text-Editor

Überblick

Ein Rich-Text-Editor (RTE) bietet die Möglichkeit, Text mit Markup einzugeben.

Bei Communities-Komponenten wirkt sich dies ähnlich wie der Rich-Text-Editor in der Autorenumgebung auf den in der Veröffentlichungsumgebung eingegebenen Text aus.

Rich-Text-Editor

Aktivieren des Rich-Text-Editors

Communities-Komponenten, die benutzergenerierte Inhalte (UGC) zulassen, können aktiviert werden, um den RTE zuzulassen. Je nachdem, ob die Komponente einer Seite hinzugefügt oder in einer Funktion enthalten wurde, kann der RTE standardmäßig aktiviert sein oder nicht.

Wenn diese Option nicht aktiviert ist, geben Sie einfach den Bearbeitungsmodus Autor ein, wählen Sie die zu bearbeitende Komponente aus und aktivieren Sie das Kontrollkästchen Rich Text Editor.

RTE ist für die folgenden Communities-Komponenten verfügbar:

Anpassung

Die Anpassung des Rich-Text-Editors ist möglich, da die Implementierung auf CKEditor basiert.

Die aktuelle Konfiguration für Communities-Komponenten befindet sich im Ordner cq.social. scf clientlib im Repository unter

/libs/clientlibs/social/commons/scf/ckrte.js

Eine Änderung der clientlib cq.social.scf wird nicht empfohlen, da zukünftige Upgrades Änderungen überschreiben können.

Aus Sicherheitsgründen sind die Hyperlink-Optionen nicht im Satz von Rich-Text-Symbolen enthalten, die Mitgliedern standardmäßig angezeigt werden. Die Fähigkeit, Unruhe zu stiften, ist groß, wenn href in UGC erlaubt sind.

So fügen Sie die Hyperlink-Optionen zur Symbolleiste hinzu:

  • Fügen Sie eine Symbolleiste mit dem Namen " links"hinzu.
    • { name: 'links', items: [ 'Link','Unlink','Anchor' ] }
  • Wählen Sie Alle speichern

/libs/clientlibs/social/commons/scf/ckrte.js

CKRte.prototype.config = {
    toolbar: [
        { name: "basicstyles",
           items: ["Bold", "Italic", "Underline", "NumberedList", "BulletedList", "Outdent", "Indent", "JustifyLeft", "JustifyCenter", "JustifyRight", "JustifyBlock", "TextColor"]
        },
        { name: 'links',
           items: [ 'Link','Unlink','Anchor' ]
        }
    ],
    autoParagraph: false,
    autoUpdateElement: false,
    removePlugins: "elementspath",
    resize_enabled: false
};

Auf dieser Seite