Die WordPress-Gemeinde teilt sich in verschiedene Glaubensrichtungen auf. Es gibt die große Gruppe der Anwender, die vollständig auf visuelle Pagebuilder wie Elementor oder Divi setzen. Ebenso stark vertreten sind die Anhänger des WordPress-eigenen Gutenberg Editors, der auch so eine Art Pagebuilder sein möchte und sicher werden wird.
Und dann gibt es noch eine Art back to the roots Splittergruppe, die das alles für Teufelszeugs hält und nur den classic Editor akzeptiert.
Wir beschäftigen uns hier mit Gutenberg und Erweiterungen wie Generateblocks.
Insgesamt bietet der Gutenberg-Editor von WordPress eine intuitive Benutzeroberfläche und eine umfangreiche Bibliothek von Blöcken, die es Benutzern erleichtern, ansprechende Webseitenlayouts zu erstellen. Andere Pagebuilder wie Elementor, Beaver Builder, Divi und Oxygen bieten jedoch eine höhere Flexibilität und Anpassbarkeit, die für fortgeschrittene Benutzer und professionelle Entwickler besser geeignet sein können.
Wie passt da Generateblocks rein?
Generateblocks ist ein auf Gutenberg basierender, visueller Block-Editor für WordPress. Der Editor unterstützt Webdesigner bei der Erstellung von ansprechenden Layouts und Inhalten. Er wurde für den Einsatz im GeneratePress Theme entwickelt, kann aber auch unabhängig davon angewandt werden. Insbesondere in Verbindung mit dem zugehörigen Theme kann der Editor seine Stärken voll ausspielen.
Generateblocks bietet keine umfassende Sammlung von Blöcken für alle möglichen Anwendungsfälle, noch hat es zahlreiche Vorlagen oder Animationen vorinstalliert. Stattdessen besteht es aus einer überschaubaren Anzahl von funktionalen und durchdachten Blöcken. Die volle Leistungsfähigkeit von Generateblocks erschließt sich jedoch erst nach längerer Nutzung. Erfahrene Designer können mit etwas Einarbeitungszeit anspruchsvolle und komplexe Layouts mit Funktionalität umsetzen. Dies ist jedoch auch der Grund, warum ich Anfängern oder Designern, die bunte Klickoberflächen gewohnt sind, dieses Plugin nicht mehr uneingeschränkt empfehle. Das Nutzererlebnis und der Workflow unterscheiden sich stark von Elementor, Divi Builder oder Oxygen.
Das sind die neuen Features in Generateblocks
Generateblocks hat am 21. Februar 2023 die Version 1.7 herausgebracht. Diese Version konzentriert sich auf die Überarbeitung bestehender Blöcke und Erweiterung derselben. Es gibt keine neuen Vorlagen oder Animationen, sondern eine übersichtliche Anzahl funktionaler Blöcke. Die Programmierung ist schlank und einfach zu bedienen. Die neuen Flexbox-Controls sind das wichtigste Feature des Upgrades und bieten mehr Kontrollmöglichkeiten für das pixelgenaue Design. Grundsätzlich wurde der Code bei einigen Blöcken komplett überarbeitet, wie beim Container- und Buttons-Block. Es gibt auch neue Blöcke, wie den Accordion- und Tabs-Block in der Pro-Version. Generateblocks eignet sich für erfahrene Designer, die anspruchsvolle und komplexe Layouts mit Funktionalität umsetzen möchten.
Kleiner Einschub: empfohlene Werkzeug-Sammlung
Mein Vorschlag für ein Toolset zur Arbeit mit Inhalten wäre wie folgt:
- GeneratePress Pro als Theme
- Generateblocks Pro als „Pagebuilder“
- eine weitere Block-Sammlung wie Spectra, Kadence, Stackable etc. (falls es Bedarf an speziellen Blöcken gibt)
- auch Shortcodes Ultimate ist eine hervorragende Sammlung an Snippets, die mittels Shortcode eingebunden werden
- Code Snippets Plugin, um mit eigenem Code das Theme zu pimpen
Ich finde, man sollte unbedingt die Pro Versionen von GeneratePress und Generateblocks nutzen. Die Pro-Version des Themes ist viel stärker als die Lite-Version. Wenn ich wählen müsste, würde ich immer die Pro-Version des Themes nehmen, weil sie so viel mehr kann. Das Plugin hat zwar keinen so großen Unterschied zwischen der kostenlosen und der Premium-Version, aber ich nutze mittlerweile die Pro-Version und möchte nicht mehr ohne arbeiten.
Nun aber zur Generateblocks Version 1.7, die am 21. Februar 2023 ausgerollt wurde. Welche neuen Features wurden hinzugefügt und wie arbeitet man mit diesen?
Neues Container-Modell: Innere Container und Size Controls
Generateblocks wurde in seiner Anfangszeit so entwickelt, dass der Nutzer sich nicht allzu sehr um Positionierung seiner Container kümmern musste. Doch dieser Komfort hatte seinen Preis: Dazu mussten zusätzliche Elemente und versteckter CSS-Code hinzugefügt werden. Zum Beispiel wurde bei Verwendung des Container-Blocks standardmäßig immer auch ein innerer Block erstellt. Dies wurde jetzt durch eine Überarbeitung des Codes abgeändert. Legt man einen neuen Container auf der obersten Ebene an, erhält man einen Hinweis zum Anlegen eines inner-Containers (siehe Screenshot).
Dieser innere Container ist vor allem bei full-width Layouts sinnvoll, damit der Text nicht am Rand des Bildschirms klebt wie im Screenshot zu sehen ist.
Der innere Container setzt dann auch gleichzeitig den auto-Wert bei den Margins, um sich selbst zu zentrieren. Seine Breite bestimmt sich aus der global eingestellten Breite im Customizer. Ich kann mir vorstellen, dass dies noch einmal in einer der kommenden Versionen überarbeitet wird. Für alles Weitere gibt es nun Size-Controls (siehe Screenshot).
Mit diesen Angaben kann man die Abmessungen sowie Mindest- und Maximalmaße der Blöcke einstellen.
Flexbox Controls und Legacy Fallback
Die Flexbox-Controls sind das wichtigste Feature des Upgrades. Sie ermöglichen die effektive Nutzung der Power von Flexbox. Der Grid-Block arbeitete schon immer mit Flex, aber vor dem Anwender verborgen. Sobald man jetzt Display auf flex setzt, stehen einem die Grundlegenden Funktionen des Flexmodells zur Verfügung. Im Beispiel in der Abbildung habe ich den zweiten Container auf flex gesetzt und die vier enthaltenen Container zentriert floaten lassen. Kein Grid oder Raster mehr nötig (die aber weiterhin funktionieren).
Allerdings sind sie nicht mit den bereits bestehenden und somit veralteten Containern kompatibel und werden deshalb in diesen Blöcken auch nicht angezeigt. Damit das bestehende Design nicht beeinträchtigt wird, werden alle vorhandenen Container-Blöcke als Legacy-Blöcke behandelt. Durch den Legacy-Status ändert sich bei diesen Blöcken nichts und sie können weiterhin wie gewohnt genutzt werden.
Neue Buttons ohne zusätzliche Container
Der Buttons Block wurde komplett überarbeitet und dabei der Code verbessert. Früher wurde immer ein umschließender Container „Buttons“ um deneigentlichen Button-Block gelegt. Dieses Vorgehen hat mich immer irritiert. Jetzt gibt es nur noch den Button-Block. Den umschließenden Container kann man zusätzlich hinzufügen.
Diese Änderungen gelten nur für neu angelegte Button-Blöcke. Alles bisher angelegten Buttons bleiben unverändert und unterliegen dem Legacy-Prinzip.
Wie man sieht, fokussiert sich die neue Version auf die Überarbeitung bestehender Blöcke bzw. die Erweiterung derselben. Aber es gibt auch neuen Blöcke, auch wenn diese nur in der Erweiterung Pro zur Verfügung stehen.
Neu in der Pro-Version: Accordions und Tabs
Fun fact am Rande. Vor ein paar Wochen mache ich mir die Mühe, einen eigenen Accordion-Block zu bauen. Der sollte nur auf HTML und CSS aufsetzen und ein anderes Plugin überflüssig machen.
Was passiert?
Generateblocks Pro im 1.5 Upgrade führt einen eigenen Accordion-Block ein.
Ich werde nun den neuen Accordion-Block verwenden und meine Eigenentwicklung auf Eis legen. Dafür kann ich das andere Plugin tatsächlich löschen – das Generateblocks-Accordion hat alles was ich brauche.
Im Zuge der Accordion-Block Einführung ist der Tabs-Block eine sinnvolle Ergänzung. Hierüber kann man eine Tabulator-gestütze Darstellung von Inhalten realisieren.
Es handelt sich hierbei nicht um komplett neue Blöcke. Es sind vielmehr Varianten bzw. Kombinationen bereits bestehender Blöcke wie die allgegenwärtigen Container und Buttons.
Wie man mit Generateblocks im Allgemeinen und den neuen Möglichkeiten im Speziellen umgeht – dafür gibt es genügend Tutorials da draußen. Zum Beispiel hier oder auch hier. Das dort meistens die alpha-Version besprochen wird ist nicht weiter problematisch. Die Unterschiede sind nicht so groß. Und für das grundlegende Verständnis gibt es auch immer noch die offizielle Generateblocks Dokumentation.
