WordPress: Der Gutenberg Editor ist da – und das sind Good News

WordPress steht vor einer grossen Veränderung: Der Gutenberg Editor wird die Art und Weise, wie wir Website-Inhalte erstellen, dramatisch verändern. Ich behaupte: Es ist eine Veränderung zum Guten, auch wenn Gutenberg bisher oft kritisiert wurde. Denn der heutige Editor ist sehr limitiert – das wird einem erst richtig bewusst, wenn man Gutenberg einmal ausprobiert hat.

Die Geschichte des Gutenberg Editors

Ende 2016 kündigte WordPress-Begründer Matt Mullenweg an, die User Experience für Content Managers durch einen neuen Editor grundlegend verbessern zu wollen. Im Juni 2017 folgte dann die allererste Version 0.1 des Gutenberg Plug-ins, das seither kontinuierlich weiterentwickelt wurde und aktuell bei der Version 3.6.2 angekommen ist. Trotzdem haben bisher vergleichsweise wenige WordPress-Anwender Notiz vom Gutenberg Editor genommen. Erst seit dem WordPress-Update 4.9.8, das kürzlich ausgerollt wurde, wird Gutenberg prominent im WordPress Dashboard beworben. Noch ist der neue Editor nur eine Option, die man installieren oder ignorieren kann. Aber ab WordPress 5.0 wird Gutenberg zum Standard gehören, und deshalb ist jetzt der richtige Moment, um sich damit auseinanderzusetzen.

Die Begeisterung für den neuen Editor hielt sich bisher in Grenzen, jedenfalls wenn man die Bewertungen auf wordpress.org als Massstab nimmt: Gerade einmal 2.3 von 5 Sternen hat das Gutenberg Plug-in dort erhalten, und zahlreiche Blogger aus der WordPress Community haben Gutenberg in den letzten 12 Monaten immer wieder kritisiert. Diese Kritik mag begründet sein, aber man sollte sich davon nicht beirren lassen. Denn erstens beziehen sich viele Kritikpunkte auf frühe Beta-Versionen und sind inzwischen behoben. Zweitens entstehen viele Probleme dadurch, dass Themes und Plug-ins noch nicht an Gutenberg angepasst sind – wenn wir den Entwicklern noch etwas Zeit geben, wird die Situation bald ganz anders aussehen. Und drittens darf man getrost davon ausgehen, dass sich das Gutenberg-Team bei der ganzen Sache etwas überlegt hat: Wenn man sich näher mit dem neuen Editor beschäftigt, dann sieht man plötzlich auch das Potential, das in diesem Ansatz steckt.

Die Grenzen des alten WordPress Editors

Wer bisher in WordPress einen Beitrag oder eine Seite bearbeitet hat, hat dafür den sogenannten TinyMCE Editor benutzt. Dieser besteht aus einem einzigen Eingabefeld mit einem minimalistischen Toolbar. Das reicht, um einen Text mit Zwischentiteln und Aufzählungen zu erfassen, der zwischendurch auch einmal ein Bild oder ein eingebettetes Video enthält.

Wer allerdings Tabellen, einen Button, ein speziell formatiertes Zitat, mehrspaltige Inhalte oder gar ein dynamisches Element benötigt, ist auf zusätzliche Plug-ins angewiesen und muss mit Shortcodes operieren. In gewissen Fällen kommt man auch nicht darum herum, ein paar Zeilen HTML- oder CSS-Code zu schreiben. Das funktioniert zwar alles, ist aber weder benutzerfreundlich noch zeitgemäss.

Um dieses Defizit zu kompensieren, entwickelten zahlreiche Anbieter sogenannte Page Builders – sei es als Teil eines Themes, sei es als theme-neutrales Plug-in. Diese Page Builders erlauben es einem Content Manager, aus einer Vielzahl von Elementen/Modulen auszuwählen und ad hoc mehrspaltige Layouts zu kreieren. Prominente Beispiele sind Avia (Teil des Enfold Theme), Beaver Builder, Divi, Elementor, Site Origin oder Visual Composer. Ihnen allen ist gemeinsam, dass sie ihren eigenen Editor mitbringen und somit den WordPress Editor übersteuern.

Mit solchen Page Builders zu arbeiten ist eine Freude, wenn man in kurzer Zeit komplexe Webpages bauen will und dabei Dinge wie Drag & Drop oder WYSIWYG schätzt. Dafür muss man in Kauf nehmen, dass man seinen Page Builder später nicht mehr austauschen kann, ohne die ganze Website neu zu bauen, weil jeder Page Builder seine eigenen Konzepte und Features hat. Zudem sind Konflikte mit Plug-ins und Themes nie ganz auszuschliessen.

Das Konzept des Gutenberg Editors

Man kann Gutenberg ebenfalls als einen sehr einfachen Page Builder sehen. Was bei einem Page Builder «Element» oder «Modul» heisst, nennt sich bei Gutenberg «Block». Um den Content für eine Seite zu erstellen, fügt man zuerst geeignete Blöcke ein und bearbeitet dann deren Inhalt. Die elementarsten Block-Typen ermöglichen eine Überschrift, einen Textabsatz, eine Aufzählung oder ein Bild. Komplexere Block-Typen fügen eine Tabelle, eine Bildergalerie, einen Button oder eine Liste mit den letzten Kommentaren ein. Sogar ein einfaches zweispaltiges Layout kann man über einen Block realisieren.

Natürlich ist der Gutenberg Editor erweiterbar: Plug-ins und Themes können die Palette mit ihren eigenen Block-Typen ergänzen. Wer beispielsweise ein Testimonial, ein Akkordeon oder eine Google Map benötigt, greift zu Plug-ins wie Advanced Gutenberg, Atomic Blocks, Gutenberg Spacer Block, Maps Block for Gutenberg oder Stackable. Entwickler können auch ihre ganz eigenen Custom Blocks erstellen.

Im Gegensatz zu den meisten Page Builders ist der Wirkungsbereich des Gutenberg Editors im Moment auf den Content-Bereich beschränkt. Will heissen: Header inkl. Navigation, Sidebar und Footer werden weiterhin mit den traditionellen Methoden bewirtschaftet. Gemäss Morten Rand-Hendriksen ist es allerdings nur eine Frage der Zeit, bis man mit Gutenberg komplette Webpages bearbeiten kann.

10 Vorteile des Gutenberg Editors

Ich möchte hier nicht im Detail auf die Features und das Bedienungskonzept des Gutenberg Editors eingehen – dazu gibt es inzwischen genügend Blog-Artikel und Videos im Netz. Ich möchte vielmehr aufzeigen, worin die Vorteile des ganzen Konzepts liegen und damit den zahlreichen Gutenberg-Kritikern etwas entgegenhalten.

1. Weil Gutenberg grundsätzlich mehr kann als der alte Editor, werden einige Plug-ins überflüssig. Das ist deshalb gut, weil jedes Plug-in potentiell Konflikte, Sicherheitslücken, Datenschutzproblematiken und Performance-Einbussen mit sich bringt.
2. Gutenberg macht auch viele Shortcodes überflüssig und bietet stattdessen ein WYSIWYG-Erlebnis.
3. Obwohl man für jeden einzelnen Block in die HTML-Ansicht wechseln kann, wird man bei Gutenberg weit seltener den HTML-Code bearbeiten müssen, weil die Blocks viele Dinge bereitstellen, die man bisher manuell coden musste (z.B. Tabellen, Buttons oder Abstände).
4. Dass man für jeden Zwischentitel oder jedes Bild einen neuen Block anlegen soll, wirkt auf den ersten Blick umständlich. Dafür hat jeder Block seine eigenen Einstellmöglichkeiten und kann so sehr gezielt konfiguriert und formatiert werden. Zudem kann man bei Bedarf die Reihenfolge der Blöcke sehr elegant umstellen.
5. Jeder Block hat seinen spezifischen Toolbar und seine Parameter (in der Randspalte). Weil man aber nur die Tools und Parameter des jeweils aktiven Blocks sieht, wirkt die Benutzeroberfläche sehr viel aufgeräumter. Man sieht immer nur das, was man gerade braucht.
6. Wer links das Menü einklappt und rechts die Randspalte ausblendet, hat einen extrem reduzierten Bildschirm vor sich, der das ablenkungsfreie Schreiben begünstigt und die Bildschirmfläche bestmöglich ausnutzt.
7. Auch Widgets – die bisher nur in Sidebars zur Verfügung standen – können endlich im normalen Content genutzt werden.
8. Das Speichern einer Seite geht viel schneller. Dies liegt darin, dass bei einem Klick auf «Speichern» bzw. «Publizieren» nicht das gesamte Backend neu geladen wird, sondern dass der Content über die Rest API in die Datenbank geschrieben wird.
9. Ein Content Manager kann jeden beliebigen Block inklusive dessen Inhalt und Konfiguration als Reusable Block definieren. Dadurch kann man einen Block mehrfach verwenden – aktualisiert man ihn an einer Stelle, so werden auch alle anderen Instanzen aktualisiert. Und weil man einen Reusable Block auch wieder in einen normalen Block umwandeln kann, lässt sich dieses Konzept für individuelle Content-Bausteine nutzen.
10. Man kann auch weiterhin mit dem altbekannten Editor arbeiten, wenn man das möchte. Einerseits gibt es einen Block-Typ «Classic», der weitgehend dem entspricht, was man bisher als den normalen WordPress Editor kannte. Zudem kann man jeden Post wahlweise im Classic Editor oder im Gutenberg Editor öffnen. Und schliesslich kann man mit Plug-ins wie Gutenberg Ramp oder Gutenberg Manager detailliert steuern, für welche Post Types der Gutenberg Editor überhaupt zur Verfügung steht.

Gutenberg ist besser als sein Rating

Selbstverständlich hat Gutenberg auch Nachteile, selbstverständlich ist er noch nicht in allen Punkten ausgereift, und selbstverständlich gibt es im Moment noch Konflikte mit Plug-ins und Themes. Gutenberg ist auch nicht unbedingt der Traum eines Power Users, der möglichst mit Tastaturbefehlen statt mit der Maus arbeiten will, seine Shortcodes auswendig kennt und gerne ein paar Zeilen HTML/CSS schreibt. Zudem wurden Bedenken bezüglich der Accessibility des neuen Editors geäussert (was ich selbst aber nicht beurteilen kann).

Trotzdem: Mit Gutenberg bekommt WordPress endlich einen leistungsfähigen und zugleich benutzerfreundlichen Editor, wie man ihn von anderen Plattformen wie Medium oder LinkedIn her kennt. Er bietet viele Features, für die man bisher Plug-ins oder Page Builders hinzuziehen musste. Zudem wurde bei der Einführung des neuen Editors vieles richtig gemacht: Man wird nicht gezwungen, Gutenberg zu nutzen, und man kann jederzeit auf den Classic Editor zurückgreifen. Der Gutenberg Editor verdient deshalb nicht nur eine Chance, sondern auch ein deutlich besseres Rating.