WordPress 5.0 – Gutenberg, der Editor mit dem Baukastenprinzip

Was hat sich geändert?

WordPress 5.0 „Bebo“ wurde am 6. Dezember 2018 veröffentlicht und ist das wohl bedeutendste WordPress Update der letzten Jahre. Während in den meisten Fällen vor allem Bugs entfernt, Geschwindigkeiten verbessert und neue Widgets präsentiert werden, bringt WordPress 5.0 neben dem neuen Theme „Twenty Nineteen“ eine besonders gravierende Änderung mit dem Namen „Gutenberg“ mit sich. Hinter diesem Namen verbirgt sich der neue, blockbasierte Editor, der den klassischen TinyMCE-Editor ersetzen soll. Der klassische Editor wird allerdings bis 31. Dezember 2021 weiterhin als Plugin zur Verfügung stehen.

Bereits lange vor der Veröffentlichung von WordPress 5.0 wurde die Einführung des neuen Editors heftig diskutiert und kritisiert. Die Meinungen gehen nach wie vor auseinander.

Die Gründe für den neuen Editor

Einer der Hauptgründe für das Einführen des neuen Editors ist wohl die Konkurrenz. Seiten, die einen extrem vereinfachten Aufbau von Websites ermöglichen, zum Beispiel Wix, erfreuen sich großer Beliebtheit und können ein dementsprechend hohes Wachstum verzeichnen.

Unter WordPress-Nutzern werden häufig Page-Builder-Plugins genutzt, da sie vielfältige Möglichkeiten bieten und ihre Bedienung einfacher ist als die des klassischen Editors. Der Nutzer möchte seine Inhalte auf einfachem Weg hinzufügen, bearbeiten, entfernen und neu anordnen können, ohne dabei auf HTML und CSS angewiesen zu sein.

Betrachtet man diese Entwicklungen, kommt man schnell zu dem Schluss, dass der klassische Editor, wie wir ihn kennen, nicht mehr Wettbewerbsfähig ist. Deshalb musste WordPress einen Weg finden, um die Benutzerfreundlichkeit zu erhöhen und das Gestalten von Layouts zu vereinfachen, um für die Zukunft gerüstet zu sein.

„It’s time for WordPress’ next big thing, the thing that helps us deal with our challenges and opportunities. The thing that changes the world.” – Matt Mullenweg

Nach 10 Jahren hat der klassische Editor also nun beinahe ausgedient. Die Zukunft heißt „Gutenberg“ und basiert auf einem beliebten JavaScript-Framework namens React. Dadurch werden schnellere Ladezeiten versprochen. Ob diese auch gehalten werden können, wird sich erst im Laufe der Zeit zeigen.

Wie funktioniert "Gutenberg"?

Auch, wenn der klassische TinyMCE-Editor immer als „WYSIWYG“-Editor bezeichnet wird, ist das nur zum Teil richtig, denn man kann nur erahnen, wie das Frontend wirklich aussehen wird. Durch die Beschränkung auf die notwendigsten Funktionen zum Einfügen und Bearbeiten von Inhalten sind die Möglichkeiten der Layoutgestaltung ohne HTML und CSS-Kenntnisse sehr eingeschränkt.

Der Gutenberg-Editor soll dafür sorgen, dass diese Einschränkungen der Vergangenheit angehören und das Arbeiten mit WordPress so einfach wie möglich gemacht wird. Bei Gutenberg trifft die Bezeichnung „what you see is what you get“ schon eher zu. Die Seiten können im Backend genau so aufgebaut werden, wie sie auch im Frontend aussehen werden. Dass es in der Praxis zu Abweichungen in der Darstellung kommen wird, steht außer Frage, da die Darstellung ja nicht nur vom Editor abhängt, sondern auch vom genutzten Theme bestimmt wird. Dennoch kommt es „WYSIWYG“ relativ nahe. Zum Aufbau einer Seite wird im Prinzip nur eines benötigt: Blöcke!

Erstellt man eine neue Seite oder einen neuen Beitrag, erscheint eine cleane Schreibfläche, die nur einen Titel und einen Absatzblock enthält. Bereits auf den ersten Blick wird ersichtlich, dass im Gegensatz zum klassischen Editor kaum Ablenkung und viel Platz zum Aufbau einer Seite oder eines Beitrags vorhanden ist. Der Absatz-Block kann in jeden beliebigen Content-Block umgewandelt werden. Die Auswahl des gewünschten Content-Blocks kann entweder aus der Liste oder über die Suchfunktion erfolgen.

Das Einfügen von Inhalten – egal, ob Überschriften, Absätze, Fotos, Gallerien, Buttons etc. – erfolgt also durch Blöcke, die im Prinzip wie Bausteine funktionieren. Dabei gibt es eine Vielzahl an Kategorien und Typen, die zahlreiche Möglichkeiten bieten – auch Widgets können so eingebunden werden. Die Formatierung erfolgt ebenfalls direkt im Block.

Ein wesentlicher Vorteil dieses Blockbasierten Systems ist, dass alle Blöcke beliebig oft verschoben und so immer wieder neu angeordnet werden können. Möchte man also zum Beisiel ein Bild weiter oben oder unten positionieren, kann man das mit Hilfe der Pfeile tun.

Gutenberg bietet also zahlreiche Funktionen, die bereits aus den beliebten Page-Builder-Plugins bekannt sind. Zwar sind die Funktionen noch nicht so umfangreich wie bei manchen Plugins, WordPress verspricht aber eine laufende Erweiterung.

Was passiert mit bestehenden Inhalten?

Bestehende Inhalte werden im Gutenberg-Editor nach wie vor als TinyMCE-Box angezeigt, um das Format nicht zu zerstören. Um den Gutenberg-Editor zu verwenden, kann die Option „In Blöcke umwandeln“ verwendet werden. Dabei werden alle Inhalte automatisch in die passenden Blöcke umgewandelt und können danach beliebig verändert und verschoben werden. Das gilt auch für Shortcodes.

Was vor dem Update auf WordPress 5.0 beachtet werden sollte

Um problemlos auf WordPress 5.0 umzusteigen, gibt es einige Dinge, die beachtet und getestet werden sollten. Am Wichtigsten ist es, sich Zeit zu lassen, denn (abhängig vom Hosting-Anbieter) wird das Update normalerweise nicht automatisch installiert – und die Vorgängerversion funktioniert nach wie vor einwandfrei.

Tests

Da noch nicht alle Themes und Plugins mit Gutenberg kompatibel sind, ist es sinnvoll, das Update nicht zu überstürzen und WordPress 5.0 zuerst in einer Testumgebung auszuprobieren. Die meisten größeren Anbieter von Themes und Plugins haben außerdem Erklärungen zu WordPress 5.0 veröffentlicht und geben wertvolle Tipps zur Aktualisierung.

Sind das Theme und alle verwendeten Plugins mit WordPress 5.0 bzw. dem Gutenberg-Editor kompatibel, spricht nichts dagegen, die Aktualisierung auf der Live-Version durchzuführen.

Updates von WooCommerce und Plugins

Um Probleme zu verhindern sollte sichergestellt werden, dass vor dem Update auf WordPress 5.0 auch ein Update auf die aktuellste Version von WooCommerce und Plugins wie Yoast SEO durchgeführt wird.

Backups

Wie bei allen größeren Änderungen ist es auch hier unumgänglich, vor der Aktualisierung alle Daten und die MySQL-Datenbank zu sichern. So kann bei Problemen schnell reagiert werden und es wird vermieden, dass Inhalte zur Gänze verloren gehen.

„Twenty Nineteen“ – das neue Theme

Das neue Theme mit dem simplen, eher Typografie-basierten Design ist laut WordPress für verschiedenste Anwendungsbereiche geeignet – vom Fotoblog bis hin zur kleinen Business-Website. Durch das minimalistische Design und die Nutzung von Systemschriften soll die Ladezeit erhöht werden. Vor allem aber wurde das Theme im Hinblick auf den Gutenberg-Editor entwickelt und verspricht, dass alle Funktionen des Editors perfekt mit dem Theme funktionieren und harmonieren.

ACF für Gutenberg

Die bekannte WordPress-Erweiterung ACF ist mit Version 5.8 nun auch mit Gutenberg kompatibel. So können benutzerdefinierte Blöcke in kurzer Zeit erstellt werden – ohne lange JavaScript Codes schreiben zu müssen.

Fazit

WordPress 5.0 bringt also gravierende Neuerungen mit sich, die Entwickler vor einige Herausforderungen stellten und weiterhin stellen, um Themes und Plugins mit Gutenberg kompatibel zu machen. Auch der Support-Aufwand darf nicht unterschätzt werden. Der Aufschrei war allerdings vor der Veröffentlichung deutlich größer als danach, und viele Entwickler nehmen die Änderung mittlerweile als positiven Schritt wahr.

Ob Gutenberg seine Versprechen halten kann und welche Verbesserungen uns noch erwarten wird sich im Laufe der Zeit zeigen.