Gutenberg Editor Drupal

Während der Gutenberg-Editor in der WordPress-Welt seit der aktuellen Version der Standard-Editor ist, wurde dieser auch seit 2018 in Drupal integriert und kann nach unserer Ansicht seit Januar 2022 als stabil betrachtet werden. Doch was hat es mit dem Gutenberg-Editor auf sich und was kann er alles? All das und noch vieles mehr erfahren Sie in unserem heutigen Blogbeitrag.

Das Wichtigste in Kürze:

  • Gutenberg ist eine Mischung aus WYSIWYG- und Sitebuilder-Editor, der die Beitragserstellung mit Hilfe eines innovativen und interaktiven Interface erheblich vereinfachen soll.
  • Das Hauptfeature von Gutenberg sind die sogenannten "Blocks". Diese verkörpern die einzelnen Elemente einer Webseite und lassen sich frei nach Herzenslust verschieben.

Gutenberg-Editor: Was ist das überhaupt?

Beim sogenannten Gutenberg-Editor handelt es sich um einen Editor, der nach dem Buchdruck-Erfinder Johannes Gutenberg benannt ist. Dabei verfolgt der Gutenberg-Editor das Ziel, die Texteingabe einfacher zu gestalten und zugänglicher zu machen. Seit 2022 gibt ist den Editor als aus unserer Sicht stabiles Drupalmodul.

Was ist denn wirklich neu am Modul "Gutenberg-Editor"?

Was für Wordpress neu war, ist bei Drupal schon lange Alltag: "Blocks". Doch was hat es mit dem Blocks-Feature auf sich? Wie Sie mit Sicherheit wissen, besteht ein Beitrag aus vielen verschiedenen Einzelelementen: Überschriften, Texte, Listen, Zitate, Bilder und Videos, Menüs, Widgets, interaktive Elemente und Co. Für jedes dieser Elemente hält der Gutenberg-Editor einen eigenen Block bereit. Diese wiederum verfügen jeweils über eine unglaublich große Bandbreite an unterschiedlichen Optionen. Mit diesen einzelnen Blöcken bauen Sie dann nach und nach Ihren individuellen Beitrag zusammen. Dabei genießen Sie eine unglaublich beeindruckende kreative Freiheit. Einfach ausgedrückt kann man sagen, dass die einzelnen "Blocks", die der Gutenberg-Editor bereithält, dafür sorgen, dass auch der letzte Rest an Programmierarbeit, der bei der Gestaltung von Beiträgen notwendig war, beinahe vollständig wegfällt.

Welche Blöcke gibt es im Gutenberg-Editor?

Mittlerweile gibt es bereits eine große Auswahl an "Blöcken" und da Plugin- und Theme-Entwickler jederzeit selbst "Blöcke" hinzufügen können, werden es immer mehr. Zu den Standard-"Blöcken" gehören unteranderem folgende:

Allgemeine "Blöcke"

Block-BezeichnungBeschreibung
AbsatzMit diesem "Block" können Sie einen neuen Absatz einfügen. Hierbei handelt es sich um einen "Standard-Block", der durch Drücken der Enter-Taste eingefügt wird.
AudioHiermit lassen sich Audio-Dateien durch Drag&Drop einfügen. Die Auswahl erfolgt direkt über die Mediathek oder aber per Eingabe einer URL.
BildMit diesem "Block" können Sie durch Drag&Drop Bilder hochladen oder aus der Mediathek einfügen.
DateiHiermit lassen sich beliebige Dateien mittels Drag&Drop hochladen oder aus der Mediathek einfügen. (Nicht empfohlen)
GalerieMit diesem "Block" können Sie eine Bildergalerie mit 2 bis 8 Spalten einfügen.
ListeHiermit gelingt das Einfügen von nummerierten oder auch nicht nummerierten Listen.
TitelbildDieser "Block" erlaubt Ihnen das Einfügen eines Bildes, das über die gesamte Breite geht. Wahlweise können Sie dieses auch fixieren und mit einem Titel versehen. (Nicht empfohlen)
ÜberschriftHiermit lassen sich H2-, H3, H4-, H5- und H6-Überschriften einfügen. Die Ausrichtung ist dabei anpassbar.
UntertitelHierbei handelt sich um einen "Block" mit grauer und kursiver Schrift. Er eignet sich vor allem für Bild- und Videounterschriften.
VideoMittels diesem "Block" können Sie Videos durch Drag&Drop einfügen. Die Auswahl erfolgt über die Mediathek oder per URL-Eingabe. (Nicht empfohlen)
ZitatHiermit lassen sich Zitate inklusive Quellenangabe einfügen. (An der linken Seite wird ein dicker schwarzer Strich ersichtlich, um auf das Zitat aufmerksam zu machen)

Elemente für das Layout

Block-BezeichnungBeschreibung
AbstandshalterMit diesem "Block" können Sie Abstände zwischen zwei einzelnen "Blöcken" einfügen. Die Höhe ist dabei in Pixel einstellbar.
ButtonHiermit können Sie einen Button einfügen. Die Farbe des Textes und des Hintergrundes sind individuell anpassbar.
SpaltenDieser "Block" fügt 2 bis 6 Spalten ein, sodass sich Inhalte problemlos nebeneinander anzeigen lassen. In jede Spalte könne Sie beliebig viele andere "Blöcke" einfügen
TrennzeichenMit diesem "Block" fügen Sie einen Trennstrich ein.

Gutenberg-Editor = neues Feeling in der Erfassung von Inhalten

Nach dem Verfassen von rund zwei bis drei Blogbeiträgen oder Artikeln haben Sie sich mit großer Wahrscheinlichkeit an die neue Art der Inhaltserfassung gewöhnt und werden feststellen, dass sich dabei tatsächlich das WYSIWYG-Feeling breitmacht. Wenn Sie einen verfassten Blogbeitrag gegenlesen, müssen Sie immer zwei Browserfenster geöffnet haben. Während Sie im einen Browserfenster die lesbare Variante mit all ihren Fehlern sehen, haben Sie im anderen Browser jeweils das Edit-Formular offen. Hier macht es durchaus Sinn über einen zweiten Monitor nachzudenken, falls Sie nicht bereits einen haben.

Welche Vor- und Nachteile hält der Gutenberg-Editor bereit?

Einer der größten Vorteile des Gutenberg-Moduls liegt ganz klar in seiner Leichtigkeit und dem innovativen Minimalismus, der die Beitragserstellung des heutigen modernen digitalen Zeitalters anpasst. Der Gutenberg-Editor ist nicht nur schnell und effizient, sondern auch super leicht zu bedienen. Vor allem Redakteure werden sich binnen kürzester Zeit zurechtfinden und ansehnliche Beiträge erstellen können. Bei intensiverer Beschäftigung mit dem Modul wird schnell klar, welch eine herausragende Design-Philosophie die Entwickler hier miteinfließen lassen haben.

Anbei finden Sie einige weitere Vor- und Nachteile des Gutenberg-Editors:

Vorteile

  • Einbindung von Nodes, Blocks und Views
  • intuitive und unkomplizierte Beitragserstellung
  • komplizierte Elemente wie zum Beispiel Layouts aber auch Funktionen erfordern beinahe keinerlei CSS- und HTML-Kenntnisse mehr
  • Entwickler können mit dem Gutenberg-Modul bei Bedarf selbst individuelle "Blöcke" erstellen und diese abspeichern
  • der Gutenberg-Editor überzeugt durch eine sehr ordentliche und minimalistische Oberfläche
  • das Gutenberg-Modul erleichtert neuen Webseitenbetreibern den Einstieg in das Kreieren von Content

Nachteile

  • wer mit dem vollen Umfang des Gutenberg-Editors arbeiten möchte, muss dennoch JavaScript beherrschen
  • das interaktive Interface kann ein großes Problem für die Barrierefreiheit darstellen
  • hin und wieder gibt es Probleme bei der Webeseitenoptimierung für mobile Endgeräte

Braucht Drupal den Gutenberg-Editor wirklich?

Die Antworten hierauf sind ein wenig zwiegespalten. Wer einen gewisses Grad an Erfahrung mit HTML und CSS hat, braucht diesen Editor nicht. Bei kleinen Redaktionen, wo diese Weiterbildungen oft fehlen, ist er eine hervorragende Erweiterung. Auch beim zügigen Erstellen von Landing-Pages bringt er viele Vorteile mit. Grundsätzlich ist er auf jeden Fall eine gute Ergänzung zu Drupals Paragraphs.

Die Mischung machts: Gutenberg-Editor, Drupal Blocks, Drupal Views und Paragraphs geben den Redakteuren mehr Optionen, die man gut gesteuert durch die Administratoren empfehlen kann.

Gutenberg-Editor für Drupal-Redakteure

Drupal-Redakteure profitieren hingegen ganz klar vom Gutenberg-Editor, denn er erspart ihnen HTML- und CSS-Kenntnisse. Zugleich bringt er auch Design-Elemente wie zum Beispiel Galerien und Spalten relativ einfach auf jede Seite und auch an sämtlichen beliebigen Stellen des Seiteninhalts ein. Für Drupal-Redakteure stellt der überschaubare und aufgeräumte Gutenberg-Editor eine hervorragende Erweiterung dar.

Vorteile für Wordpress-Umsteiger

Wordpress setzt schon immer auf Einfachheit, wohingegen Drupal schon eine steile Lernkurve hat. Mit dem Gutenberg-Editor fällt der Umstieg auf Drupal aber auch WP-Redakteuren leichter, da diese in eine vertraute Umgebung kommen und sich dann nach und nach mit den leistungsstarken Features von Drupal beschäftigen können.

Gutenberg-Editor und DSGVO: Wie schaut es damit aus?

Informationen zur Folge soll der Gutenberg-Editor keinerlei personenbezogene Daten von Webseitenbesucher verarbeiten. Das heißt, das Modul speichert keine Informationen von Besuchern in der Datenbank. Auch externe Scripte werden durch den Gutenberg-Editor selbst oder durch einzelne verwendete "Blöcke" nicht geladen. Vorsicht ist jedoch nach wie vor bei Embeds geboten. Hierbei handelt es sich um eingebettete Inhalte wie zum Beispiel YouTube-Videos, Facebook-Post und Co. über die mitunter personenbezogene Daten an Drittanbieter übertragen werden.

Schlusswort

Die Idee, den Gutenberg Editor in Drupal einzubauen, ist herausragend, denn Gutenberg bringt frischen Wind in die Arbeit von Redakteuren. Wir empfehlen kleinen und mittleren Redaktionen die Erweiterung um dieses Modul ab Drupal 9.