Durchsuchen Sie nach Kategorie


GrapesJS RTE

GrapesJS-RTE-Plugins erweitern den eingebauten Rich-Text-Editor um zusätzliche Formatierungssteuerungen, eigene Toolbars und fortgeschrittene Bearbeitungsfunktionen. Von Schriftauswahl und Farbfeldern bis zur Integration vollwertiger Editoren wie TipTap oder Quill geben dir diese Erweiterungen präzise Kontrolle über das Textbearbeiten direkt auf der Arbeitsfläche. Filtere nach Kompatibilität, Preis und Entwicklerbewertung, um die passende RTE-Erweiterung für dein GrapesJS-Projekt zu finden.

Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...Loading...

Über GrapesJS RTE

Der GrapesJS-Rich-Text-Editor ist der Inline-Editor, der sich aktiviert, sobald ein Nutzer auf eine Textkomponente auf der Arbeitsfläche doppelklickt. Standardmäßig bietet er eine einfache Formatierungsleiste; GrapesJS-RTE-Plugins ersetzen oder erweitern sie um zahlreiche zusätzliche Fähigkeiten. Die am häufigsten installierten RTE-Plugins ergänzen Auswahlfelder für Schriftart und -größe, Farbwähler für Vorder- und Hintergrund, Ausrichtungssteuerungen, Link-Editoren sowie die Möglichkeit, Inline-HTML einzufügen. Fortgeschrittenere RTE-Plugins binden komplette Fremdeditoren ein — Wrapper für TipTap, Quill, CKEditor und ProseMirror sind auf GJS.Market verfügbar — und geben deinen Nutzern ein Bearbeitungserlebnis auf Textverarbeitungsniveau direkt im Canvas. Achte bei der Wahl eines RTE-Plugins auf die Spalte zur GrapesJS-Versionskompatibilität: Die RTE-APIs haben sich zwischen den Hauptversionen geändert, und manche älteren Plugins benötigen einen Kompatibilitäts-Shim. Alle RTE-Plugins auf GJS.Market werden gegen die im Kompatibilitäts-Badge genannten Versionen getestet, und auf jeder Premium-Seite ist die Reaktionszeit des Autors angegeben.

GrapesJS RTE — FAQ

Was ist der RTE in GrapesJS?
Der RTE ist der Inline-Rich-Text-Editor, der sich beim Doppelklick auf eine Textkomponente aktiviert. Er bearbeitet direkt im Canvas statt in einem separaten Feld und bringt eine minimale Toolbar mit — fett, kursiv, unterstrichen, durchgestrichen und Link. Alles darüber hinaus kommt von einem Plugin oder eigenen Toolbar-Aktionen.
Wie füge ich Buttons zur GrapesJS-RTE-Toolbar hinzu?
Nutze editor.RichTextEditor.add mit einer id, einem Icon und einer result-Funktion, die die Formatierung auf die aktuelle Auswahl anwendet. Genau so entstehen Schriftauswahl, Farbfelder und Ausrichtungssteuerungen. Beschränke Aktionen auf das Formatieren der Auswahl — alles Strukturelle gehört stattdessen in eine Komponente oder einen Command.
Kann ich den GrapesJS-RTE durch TipTap, Quill oder CKEditor ersetzen?
Ja. GrapesJS erlaubt es, die gesamte RTE-Implementierung über die rte-Konfiguration auszutauschen; Wrapper für TipTap, Quill, CKEditor und ProseMirror findest du in dieser Kategorie. Der Wrapper muss den bearbeiteten Inhalt beim Verlassen des Fokus an die Komponente zurückgeben — genau das nehmen dir diese Plugins ab.
Warum entfernt oder verändert der RTE mein HTML?
Weil contenteditable das Markup normalisiert und GrapesJS das Ergebnis anschließend wieder in sein Komponentenmodell parst. Auf diesem Hin- und Rückweg fallen nicht unterstützte Tags und übrig gebliebene Attribute weg. Wenn Markup exakt erhalten bleiben muss, gehört es nicht in eine Textkomponente — nimm stattdessen einen eigenen Komponententyp mit eigener View.
Welches RTE-Plugin passt zu meiner GrapesJS-Version?
Prüfe das Kompatibilitäts-Badge im jeweiligen Eintrag und nutze den Versionsfilter auf dieser Seite. Der RTE ist der Bereich, in dem sich die API zwischen GrapesJS-Hauptversionen am stärksten geändert hat, ein älteres Plugin braucht auf einem aktuellen Build daher womöglich einen Shim. Premium-Einträge nennen ihre getesteten Versionen ausdrücklich und zeigen die Reaktionszeit des Autors.