Gutenberg – der neue WordPress-Editor
Bei der Layout-Gestaltung waren WordPress-Redakteure lange Zeit stark eingeschränkt, egal ob sie mit dem Texteditor oder dem visuellen Editor von WordPress gearbeitet haben. Mehr als Text-Bild-Kombinationen waren ohne Programmierkenntnisse in der Regel nicht möglich. Das war auch gar nicht nötig, denn WordPress war ursprünglich als reine Blog-Software konzipiert worden.
Mittlerweile hat sich WordPress aber zu einem gern und viel genutzten Content-Management-System für Webseiten gemausert. Daher Und eine immer größer werdende Community stellt Tools und Plugins bereit, um die Gestaltungsmöglichkeiten zu erweitern.
So wurden in den letzten Jahren zahlreiche Page Builder entwickelt, die es auch Redakteuren ohne Programmier-Know-how erlauben, komplexere Layouts und Seiten zu gestalten. Viele der Themes, die jetzt zur Seitengestaltung zur Verfügung stehen, sind auf einen speziellen Page Builder ausgelegt und liefern diesen auch gleich mit. Die beherrschenden Editoren der letzten Jahre waren Divi, Visual Composer, Beaver Builder und Elementor.
Als WordPress Agentur setzen wir dieses CMS gerne für kleinere und mittlere Projektgrößen ein.
Was ist Gutenberg?
Der Editor Gutenberg hat den Standard-Editor von WordPress abgelöst und ist seit Version 5.0 standardmäßig in WordPress integriert. Er ist kein Plugin, muss also nicht zusätzlich installiert werden. Gutenberg ist kein reiner Editor mehr, sondern eigentlich schon ein Page Builder, mit dem man aus verschiedenen Bausteinen, sogenannten „Blöcken“, ganz individuelle, mehrspaltige Layouts erstellen kann, die auch professionellen Ansprüchen genügen.
Wie funktioniert Gutenberg?
Gutenberg basiert auf dem Konzept der „Blöcke“. Ähnlich wie bei traditionellen Druckerpressen werden hier fertige Bausteine in beliebiger Kombination angeordnet. Ein Block besteht aber nicht aus einem einzelnen Buchstaben, sondern das können ganz unterschiedliche User-Interface-Komponenten sein, etwa ein Textabsatz, ein Bild, eine Überschrift, ein Video oder eine Bildergalerie. Aber auch Tabellen, Spalten und Text+Media-Kombinationen können einzelne Blöcke sein. Gerade die Spalten spielen eine besonders wichtige Rolle bei Gutenberg. Sie lassen sich einfach mit anderen Blöcken bestücken und so kann man mit vergleichsweise wenig Aufwand auch komplexere Layouts anlegen. Die Zeiten von monotonen vertikalen Text-Bild-Abfolgen sind damit endgültig vorbei.
Alle Elemente können per Drag-and-drop beliebig verschoben und verschachtelt werden. Und das Schöne bei Gutenberg: Im Editor sieht das Layout exakt so aus wie auf der Website. Es gibt also keine böse Überraschung, wenn man sich die Seite später live anschaut.
Besonders hilfreich und praktisch sind die wiederverwendbaren Blöcke. Mit diesem Feature kann man Kombinationen, die man für eine Seite erstellt hat, einfach abspeichern und an anderer Stelle erneut einsetzen.
Lässt sich Gutenberg erweitern?
Ganz nach dem WordPress-Motto „Mehr erreichen mit weniger Plugins“ bietet Gutenberg nur eine begrenzte Anzahl von Funktionen. Mit etwas Fantasie und cleverem Einsatz lassen sich damit aber bereits anspruchsvolle Layouts erstellen. Es ist also nicht mehr nötig, einen zusätzlichen Page Builder zu installieren, nur weil man gerne ein mehrspaltiges Layout hätte. Das schafft man auch problemlos mit Gutenberg.
Doch Gutenberg wäre nicht der standardmäßige Editor von WordPress, wenn er nicht erweiterbar wäre. Wem die Basis-Version des Editors nicht genügt, der kann diesen beliebig mit Custom-Blöcken ergänzen. Diese bekommt man entweder einzeln oder auch als ganze Block Libraries.
Liste mit einzelnen Blöcken:
Bekannte Block Libraries:
Die zusätzlichen Blöcke werden per Plugin installiert und sind dann im Gutenberg-Editor verfügbar.
Vor- und Nachteile von Gutenberg
Vorteile
Ohne zusätzliche Plugins erhält man eine schlanke und praktische Lösung, um anspruchsvolle Layouts zu erstellen.
Man kann den Editor um einzelne Blöcke erweitern und muss dafür nicht gleich eine komplette Library installieren.
Herkömmliche Page Builder erzeugen oft einen erheblichen Overhead an Markups, Styles und Javascript. Darunter kann die Performance der Seite leiden. Bei Gutenberg ist das nicht der Fall, denn hier werden lediglich Inhaltsblöcke kombiniert, nicht deren Aussehen definiert (mit Ausnahme der Spaltenbreiten im Spalten-Layout-Element).
Bei vielen Page Buildern ist es kaum möglich ein Theme zu wechseln, wenn dieses den Page Builder nicht unterstützt. Bei Gutenberg werden Design und Content wieder stärker entkoppelt: Damit lassen sich auch Themes leichter austauschen.
Nachteile
Die Basis-Version von Gutenberg ist in manchen Bereichen tatsächlich noch sehr basic. An der ein oder anderen Stelle wünscht man sich die Möglichkeit, Innen oder Außenabstände definieren zu können. Ein Grund, am Ende doch auf einen der gängigen Page Builder zurückzugreifen.
Durch seine Erweiterbarkeit hat Gutenberg ein richtiggehendes Plugin-Wettrüsten ausgelöst. Die Libraries sind praktisch und bieten immer noch mehr Möglichkeiten. Manch Library gleicht schon einem CSS-Editor. Das erhöht die Komplexität und sorgt für einen Overhead bei HTML, CSS und JS.
Kann man den Gutenberg-Editor ausprobieren?
Besser als jede noch so anschauliche Erklärung ist es, Dinge selbst auszuprobieren. WordPress bietet deshalb einen Live-Editor, um den Gutenberg einfach mal zu testen:
Wir freuen uns auf ein WordPress-Projekt mit Ihnen
Sprechen Sie mit mir über Ihre Herausforderungen und Ziele – in einem unverbindlichen Erstgespräch. Gemeinsam finden wir Lösungen, die begeistern.
