Initialisierung

Diese Anleitung erklärt, wie Sie RichText in eine Seite einbinden. Führen Sie die folgenden Schritte aus, um einen einsatzbereiten Editor zu erhalten:

1. Quelldateien in die Seite einbinden.
2. Einen Container für RichText erstellen.
3. RichText initialisieren.

Quelldateien einbinden

Fügen Sie die JavaScript- und CSS-Dateien von RichText zu Ihrem Projekt hinzu. Laden Sie das Paket herunter und entpacken Sie den Inhalt in Ihren Projektordner.

Um RichText zu erstellen, binden Sie zwei Quelldateien in Ihre Seite ein:

• richtext.js
• richtext.css

Verweisen Sie in Ihrem HTML auf diese Dateien. Passen Sie die relativen Pfade an Ihre Ordnerstruktur an:

index.html

<script type="text/javascript" src="./codebase/richtext.js"></script>  
<link rel="stylesheet" href="./codebase/richtext.css">

Container erstellen

Fügen Sie einen Container für RichText mit einer ID wie "root" hinzu:

index.html

<div id="root"></div>

RichText initialisieren

Initialisieren Sie RichText mit dem Konstruktor richtext.Richtext. Der Konstruktor akzeptiert zwei Parameter:

• einen Container — einen CSS-Selektor oder ein DOM-Element
• ein Konfigurationsobjekt mit den Editor-Eigenschaften. Siehe die vollständige Liste der Eigenschaften unten

Das folgende Beispiel initialisiert RichText im Container #root:

index.html

const editor = new richtext.Richtext("#root", {
    // Konfigurationseigenschaften  
});

Konfigurationseigenschaften

Fügen Sie Konfigurationsoptionen als Schlüssel des Konfigurationsobjekts hinzu.

Hinweis

Die vollständige Liste der Konfigurationseigenschaften finden Sie in der Eigenschaften-Übersicht.

RichText-Instanz zerstören

Rufen Sie die Methode destructor() auf, um das RichText-HTML zu entfernen und alle zugehörigen Events zu trennen:

const editor = new richtext.Richtext("#root", {
    // Konfigurationseigenschaften
});

editor.destructor();

Beispiel

Das folgende Beispiel initialisiert RichText mit aktivierter Menüleiste:

Verwandtes Beispiel: RichText. Initialisierung