Am 12. Februar 2025 wurde eine neue Ära erklommen, so zumindest hat der Hauptentwickler von GenerateBlocks 2.0 die neue Hauptversion beschrieben.1 Das Update bringt eine Welle an leistungsstarken Verbesserungen, darunter brandneue Blöcke, eine tiefere Integration der globalen Stile, dynamische Inhalte und eine komplett überarbeitete Benutzeroberfläche mit mächtiger Such- und Filterfunktion mit.
GenerateBlocks 2.2.0
Am 27. Mai 2025 wurde GenerateBlocks Pro 2.2.0 veröffentlicht.2 Dieses Update führt zwei mächtige neue Blöcke ein, die die Art und Weise, wie du Header und Navigationen erstellst, grundlegend verändern. Damit wird die Erstellung dieser wichtigen Seitenelemente aus dem traditionellen WordPress-Customizer direkt in den flexiblen Block-Editor verlagert.
Features (Neue Funktionen)
Navigations-Block (Navigation Block)
Dieser Block gibt dir die volle Kontrolle über die Erstellung von dynamischen und responsiven Menüs. Er besteht aus einem Haupt-Navigations-Block und mehreren untergeordneten Blöcken, die dir eine detaillierte Gestaltung ermöglichen. Du kannst damit:
- Komplett eigene Menüs mit voller Kontrolle über Layout, Typografie, Farben und Abstände erstellen.
- Voll funktionsfähige Drop-down-Menüs für Websites mit komplexer Seitenstruktur bauen.
- Das Design für jede Bildschirmgröße (Desktop, Tablet, Mobil) präzise anpassen.
- Aus einer Vielzahl von leichtgewichtigen Animationseffekten für das Ein- und Ausblenden von Menüs wählen.
- Die Menüs automatisch mit deinen veröffentlichten Seiten befüllen oder auf ein klassisches WordPress-Menü zurückgreifen und dessen Design im Editor anpassen.
Seiten-Header-Block (Site Header Block)
Mit diesem Block hebst du die Gestaltung von Kopfzeilen auf ein neues Level. Er ermöglicht es dir, den Standard-Header deines Themes (z.B. von GeneratePress) komplett durch eine eigene, im Block-Editor erstellte Version zu ersetzen. Die Hauptvorteile sind:
- Vollständige Designfreiheit: Baue deinen Header mit beliebigen Blöcken – füge Logos, Buttons, Suchfelder oder dynamische Inhalte hinzu.
- „Merge“-Funktion: Lasse den Header mit dem restlichen Seiteninhalt verschmelzen, um beeindruckende Hero-Sektionen mit transparentem Header zu erzeugen.
- Präzise Vorschau: Kontrolliere die Editor-Breite, um eine exakte Vorschau deines Designs zu erhalten.
GenerateBlocks 2.1.0
Hier ist die Übersicht der Neuerungen aus dem Update auf GenerateBlocks 2.1, das am 6. Mai 20253 veröffentlicht wurde:
Features (Neue Funktionen)
Vollständigen iFrame-Editor aktivieren
Der Editor lädt nun in einem sogenannten iFrame. Das bedeutet, dass die Darstellung deiner Seite während der Bearbeitung exakt der auf der Live-Website entspricht, inklusive aller Theme-Stile. Änderungen an den Blockeinstellungen werden flüssiger und präziser angezeigt, was dir eine genauere visuelle Kontrolle über dein Design gibt.
Verbessertes Indikator-Punktesystem im Stil-Editor
Es war oft schwierig nachzuvollziehen, woher ein bestimmter Stil (z.B. eine Farbe oder Größe) kommt. Das neue System löst dieses Problem mit farbigen Punkten, die dir sofort anzeigen, ob ein Stil lokal am Block (Orange), von einem übergeordneten Element geerbt (Gelb) oder global (Lila) festgelegt wurde. So siehst du auf einen Blick, welche Stile aktiv sind und woher sie stammen.
Geerbte Werte als Platzhalter anzeigen
Passend zum neuen Punktesystem werden geerbte Werte nun als Platzhalter direkt im Eingabefeld angezeigt. Das macht das responsive Design erheblich einfacher, da du sofort siehst, welcher Wert von der Desktop-Ansicht auf das Tablet oder Smartphone vererbt wird, und diesen bei Bedarf gezielt überschreiben kannst.
„Static“-Wert zur „Position“-Steuerung hinzugefügt
Bei den Positionierungs-Optionen kannst du jetzt auch den Wert „Static“ auswählen. Das ist der Standardwert in CSS und gibt dir mehr Kontrolle, um beispielsweise auf Mobilgeräten eine absolute Positionierung aufzuheben und zum normalen Layout-Fluss zurückzukehren.
„aria-label“-Feld zu allen Blöcken hinzugefügt
Im Sinne der Barrierefreiheit verfügt nun jeder Block über ein „aria-label“-Feld. Hier kannst du eine für Screenreader verständliche Beschreibung hinterlegen, um die Benutzererfahrung für Menschen mit Sehbehinderungen zu verbessern.
„inline-grid“-Option hinzugefügt
Bei den Layout-Optionen für Container steht nun zusätzlich „inline-grid“ zur Verfügung. Dies bietet dir mehr kreative Freiheit bei der Anordnung von Elementen innerhalb deiner Blöcke.
Fixes (Fehlerbehebungen)
Fehlender „current parent“-Query-Parameter
Ein Fehler wurde behoben, bei dem ein Parameter für die Abfrage des übergeordneten Beitrags fehlte. Dadurch funktionieren dynamische Inhalte, die sich auf übergeordnete Seiten oder Beiträge beziehen, nun wie erwartet.
Fallback-Vorschauunterstützung im Farbwähler
Die Vorschau im Farbwähler funktioniert nun zuverlässiger, auch wenn bestimmte Farbwerte nicht sofort geladen werden können.
Probleme bei der Eingabe einiger Einheiten in der Einheitensteuerung
Es war teilweise nicht möglich, bestimmte Einheiten oder Werte (z.B. mit einem Bindestrich am Anfang) in die Felder für Abstände oder Größen einzutippen. Dieses Problem wurde behoben.
Vorschau-Stile für Blöcke/Muster
Die Darstellung von Block- und Mustervorschauen im Editor wurde korrigiert, um konsistenter und zuverlässiger zu sein.
IME-Probleme bei Mehrfachauswahl-Komponenten
Probleme bei der Verwendung von Eingabemethoden-Editoren (IME) für asiatische Sprachen in Verbindung mit Mehrfachauswahl-Feldern wurden behoben.
Ausrichtung des Synchronisierungs-Buttons für Ränder in v1-Blöcken
Ein kleiner Anzeigefehler bei der Ausrichtung des Buttons zum Synchronisieren von Rahmen-Einstellungen in den alten v1-Blöcken wurde korrigiert.
Optionsschlüssel für die Anzahl einzelner Kommentare in dynamischen Tags
Ein Fehler bei der Verwendung des dynamischen Tags für die Anzeige der Kommentaranzahl wurde behoben.
Umschalten von benutzerdefinierten At-Rules im Editor
Die Verarbeitung von speziellen, benutzerdefinierten CSS-Regeln (At-Rules) im Editor wurde korrigiert und funktioniert nun stabiler.
Schriftfamilien-Filter im Stil-Editor
Ein Fehler im Filter für Schriftfamilien innerhalb des Stil-Editors wurde behoben.
Werte in der Einheitensteuerung, die mit einem Bindestrich beginnen
Die Eingabe von negativen Werten oder Werten, die mit einem Bindestrich beginnen (z.B. für CSS-Variablen), funktioniert nun korrekt.
Auswahl von Bild-Blöcken in WP 6.8
Eine Fehlerbehebung wurde implementiert, um die Kompatibilität mit der kommenden WordPress-Version 6.8 bei der Auswahl von Bild-Blöcken sicherzustellen.
Gleichzeitige Verarbeitung dynamischer Tags in einem Container
Ein Performance-Problem wurde gelöst, bei dem alle dynamischen Tags in einem Container-Block auf einmal verarbeitet wurden, was nun effizienter geschieht.
Verwendung von 0 als Schlüssel für verschachtelte Post-Meta-Daten
Es ist nun möglich, 0 als gültigen Schlüssel für den Abruf von verschachtelten benutzerdefinierten Feldern zu verwenden.
Sicherstellen, dass Block-Stil-Assets im wp_head geladen werden
Es wurde sichergestellt, dass die für die Blöcke benötigten CSS-Dateien korrekt im Kopfbereich der Webseite geladen werden.
Tabulator-Reihenfolge in den Abmessungs-Steuerelementen
Die Navigation mit der Tabulator-Taste durch die Felder für Abmessungen (Höhe, Breite etc.) folgt nun einer logischen Reihenfolge.
Bedingtes Laden des Skripts für die „Instant Pagination“
Das Skript für die Paginierung ohne Neuladen der Seite wird nun nur noch dann geladen, wenn es auch wirklich benötigt wird.
Tweaks (Optimierungen)
Leistung des Editors verbessert
Durch verschiedene Optimierungen wurde die allgemeine Leistung des Editors verbessert. Das Arbeiten und Gestalten von Inhalten fühlt sich nun flüssiger an und geht schneller von der Hand.
Gängige Benutzer-Meta-Felder immer im Dropdown anzeigen
Beim Arbeiten mit dynamischen Daten werden gängige Benutzer-Meta-Felder (wie first_name, last_name) nun immer direkt im Dropdown-Menü angezeigt, um Zeit zu sparen.
Unterstützung für die Gerätesichtbarkeits-Funktion in Pro hinzugefügt
Die kostenlose Version enthält nun die technische Grundlage für die Pro-Funktion zur Gerätesichtbarkeit. Dadurch wird eine nahtlose Integration sichergestellt, wenn du auf die Pro-Version umsteigst.
generateblocks_use_v1_blocks Filter hinzugefügt
Ein neuer Filter für Entwickler wurde hinzugefügt, der es ermöglicht, die Verwendung der alten Blöcke der Version 1 zu steuern.
Standard-Selektoren/Shortcuts im Stil-Editor verbessert
Die Standard-Selektoren (z.B. für Hover-Effekte) und Shortcuts im Stil-Editor wurden optimiert, um den Workflow zu verbessern.
Berechtigungen früher im Editor laden
Benutzerberechtigungen werden nun früher im Ladevorgang des Editors geprüft, was die Stabilität verbessert.
Schlagwörter für Blöcke verbessert
Die Schlagwörter (Keywords) für die Suche nach Blöcken im Editor wurden überarbeitet, um die Blöcke leichter auffindbar zu machen.
Wert des Block-ID-Attributs bereinigen
Der Wert, der für die eindeutige ID eines Blocks vergeben wird, wird nun bereinigt, um ungültige Zeichen zu verhindern.
Wert für das download-Attribut erlauben
Bei Links kann dem download-Attribut nun ein spezifischer Dateiname mitgegeben werden, anstatt es nur als reines Schalter-Attribut zu verwenden.
Suchhinweis zum Stil-Editor hinzugefügt
Während der Suche im Stil-Editor wird nun ein Hinweis angezeigt, um die Benutzerführung zu verbessern.
generateblocks_block_css Filter hinzugefügt
Ein neuer Filter für Entwickler, um das CSS eines einzelnen Blocks vor der Ausgabe zu modifizieren.
generateblocks_process_block_css Action hinzugefügt
Eine neue Action für Entwickler, um eigene Funktionen auszuführen, nachdem das Block-CSS verarbeitet wurde.
Standard-alt-Tag zu Bildern hinzugefügt
Bilder erhalten nun standardmäßig ein leeres alt-Attribut, was die Barrierefreiheit verbessert, da es Screenreadern signalisiert, dass ein Bild rein dekorativ ist, falls kein alternativer Text angegeben wird.
GenerateBlocks 2.0.0
Sicherheit
Verhindern, dass angemeldete „Contributors“ private Inhalte abfragen können
Diese Änderung schließt eine potenzielle Sicherheitslücke. Autoren mit eingeschränkten Rechten (sogenannte Contributors) können nun nicht mehr durch bestimmte Abfragen auf Inhalte von privaten Beiträgen oder Seiten zugreifen, für die sie keine Berechtigung haben.
Neuerungen
Alle Blöcke für bessere Leistung und Kontrolle von Grund auf neu geschrieben
Das Herzstück des Updates: Die gesamte Codebasis der Blöcke wurde komplett erneuert. Das Ergebnis ist ein saubererer Code, eine deutlich schnellere Ladezeit (sowohl im Editor als auch auf der Live-Website) und eine präzisere Kontrolle über das Design und Verhalten jedes Elements.
Blöcke der Version 1 bleiben dort, wo sie verwendet werden, erhalten und funktionieren normal weiter
Keine Sorge um bestehende Seiten! Wenn du das Update installierst, werden alle deine mit den alten Blöcken erstellten Inhalte weiterhin perfekt funktionieren. Dies garantiert einen reibungslosen Übergang ohne fehlerhafte Darstellungen.
Blöcke der Version 1 können mit einem einfachen Filter standardmäßig aktiviert werden
Obwohl für neue Inhalte die modernen Blöcke vorgesehen sind, hast du die Flexibilität, bei Bedarf die Blöcke der Version 1 wieder für die Block-Auswahl zu aktivieren. Dies geschieht über einen einfachen Code-Filter und ist nützlich für spezielle Anwendungsfälle.
Element-Block – ersetzt die bisherigen Container- und Grid-Blöcke
Anstelle von separaten Blöcken für Layout-Container und Raster gibt es nun einen einzigen, leistungsfähigeren „Element“-Block. Er vereint die Funktionen beider Blöcke und vereinfacht so die Auswahl.
Der Element-Block bietet im Block-Menü die Varianten „Container“ und „Grid“
Um den Umstieg zu erleichtern, findest du in der Block-Auswahl weiterhin die vertrauten Optionen „Container“ und „Grid“. Dabei handelt es sich nun um voreingestellte Varianten des neuen Element-Blocks, sodass dein Workflow gleich bleibt, du aber die neue Technologie nutzt.
Text-Block – ersetzt die bisherigen Headline- und Button-Blöcke
Ähnlich wie beim Element-Block fasst der neue, flexible „Text“-Block die Funktionen zusammen, die bisher auf die Blöcke für Überschriften (Headline) und Buttons aufgeteilt waren.
Der Text-Block bietet im Block-Menü die Varianten „Headline“, „Text“ und „Button“
Auch hier bleibt der gewohnte Arbeitsablauf erhalten. Beim Hinzufügen siehst du weiterhin die Optionen für „Headline“ oder „Button“, die nun als praktische Varianten des neuen, vielseitigen Text-Blocks fungieren.
Query-Block – ersetzt den bisherigen Query-Loop-Block
Der Block zur Anzeige dynamischer Beitragslisten (z.B. für ein Blog-Archiv) wurde von „Query Loop“ in „Query“ umbenannt und auf der neuen Architektur aufgebaut.
Looper-Block – ersetzt den Grid-Block innerhalb des Query-Blocks
Innerhalb des Query-Blocks ist nun der „Looper“-Block dafür zuständig, das Layout der angezeigten Beiträge zu steuern (z.B. in einem Raster).
Loop-Item-Block – ersetzt das Post-Template (Container) im Query-Block
Dieser Block dient als Vorlage für das Design eines einzelnen Eintrags in deiner Beitragsliste (z.B. wie ein einzelner Blogbeitrag mit Titel, Bild und Textauszug dargestellt wird). Die neue Benennung schafft mehr Klarheit.
„Keine-Ergebnisse“-Block – fügt Inhalte hinzu, die angezeigt werden, wenn eine Abfrage keine Ergebnisse liefert
Mit diesem praktischen Block kannst du ganz einfach eine benutzerdefinierte Nachricht (z.B. „Leider keine Beiträge gefunden.“) gestalten, die automatisch erscheint, wenn eine Beitragsabfrage keine Ergebnisse liefert.
„Seitenzahlen“-Block – fügt eine Seitennummerierung (Paginierung) zu deinem Query-Block hinzu
Ein eigener Block, um unkompliziert eine Seitennummerierung („Seite 1, 2, 3…“) zu deinen Beitragslisten hinzuzufügen und die Navigation zu erleichtern.
Shape-Block – fügt beliebige SVG-Formen zu deinen Seiten hinzu
Dieser neue Block erlaubt es dir, Vektorgrafiken im SVG-Format ganz einfach auf deinen Seiten einzufügen und zu gestalten. Ideal für Icons, Logos oder dekorative Elemente, die ohne Qualitätsverlust skalierbar sein müssen.
Media-Block – ersetzt den bisherigen Image-Block
Der Block zum Hinzufügen von Bildern wurde erneuert und in „Media“-Block umbenannt. Er basiert auf der neuen, performanteren Architektur und ist für zukünftige Medien-Typen gerüstet.
Lokale Blöcke verfügen jetzt über den vollständigen Stil-Editor, der aus den Globalen Stilen von GB Pro bekannt ist
Die extrem leistungsstarke Design-Oberfläche, die bisher den globalen Stilen vorbehalten war, steht dir nun für jeden einzelnen Block zur Verfügung. Das ermöglicht eine nie dagewesene gestalterische Freiheit direkt am Element.
Lokale Blöcke können jetzt für jeden Breakpoint oder jede verschachtelte Regel gestaltet werden
Ein gewaltiger Sprung für das responsive Design. Du kannst das Aussehen eines Blocks direkt für verschiedene Bildschirmgrößen (Desktop, Tablet, Mobil) anpassen. Außerdem kannst du Stile für Zustände (z.B. Hover-Effekte) oder andere komplexe Szenarien definieren.
Design-Optionen im Editor filtern, je nachdem, ob sie einen Wert haben
Die Benutzeroberfläche im Editor wird übersichtlicher. Dir werden nur noch die Design-Optionen angezeigt, die du für einen Block aktiv nutzt. Das schafft Ordnung und hilft dir, dich auf das Wesentliche zu konzentrieren.
Design-Optionen im Editor filtern, je nachdem, ob sie einen Wert erben
Diese Filter-Option erleichtert das Debugging von Designs. Du kannst dir gezielt nur die Stile anzeigen lassen, die ein Block von einem globalen Stil oder einem übergeordneten Element erbt. So siehst du sofort, woher ein Stil kommt.
System für dynamische Tags. Füge dynamische Daten überall in deinen Blöcken ein
Eine der wichtigsten Neuerungen: Du kannst nun Daten direkt aus der WordPress-Datenbank (wie den Beitragstitel, Autorennamen oder das Veröffentlichungsdatum) in jeden beliebigen Block einfügen. Das ist die Grundlage für den Bau von mächtigen, wiederverwendbaren Templates.
Mehrere dynamische Tags können in einen einzigen Block eingefügt werden
Du bist nicht auf ein dynamisches Datum pro Block beschränkt. Erstelle zum Beispiel eine Überschrift wie „Beitrag von [Autorenname] am [Datum]“, indem du mehrere Tags in einem Element kombinierst.
CSS-Variable --gb-container-width für die globale maximale Breite
Für fortgeschrittene Nutzer und Entwickler gibt es nun eine CSS-Variable, die den Wert der globalen maximalen Inhaltsbreite deiner Website enthält. Diese kannst du in eigenem CSS verwenden, um Elemente einfach an der Hauptinhaltsbreite auszurichten.
Geschwindigkeit
Lokale Blöcke generieren ihr CSS und HTML jetzt direkt während der Bearbeitung im Editor
Der Code für deine Blöcke wird in Echtzeit erstellt, während du sie gestaltest. Diese „Live-Kompilierung“ ist effizienter und sorgt für eine präzisere Vorschau des Endergebnisses.
Die Blöcke werden auf der Webseite für eine bessere Leistung als statisches HTML/CSS ausgegeben
Das ist der Schlüssel zur Geschwindigkeit deiner Website. Für deine Besucher wird kein schweres JavaScript oder PHP zur Darstellung der Blöcke benötigt. Stattdessen wird sauberer, statischer HTML- und CSS-Code ausgegeben, was zu extrem schnellen Ladezeiten führt.
Warum dieser große Schritt?
Im Vergleich zur 1.x-Version hat sich enorm viel verändert. Wir mussten uns längere Zeit mit der neuen Oberfläche beschäftigen, bevor die allgemeinen Einstellungen wieder so intuitiv wie vorher abliefen.
Wie die Entwickler selbst erklären, liegt der Ursprung dieses Updates in der Technologie, die sie für ihr Global-Styles-Feature entwickelt haben. Damit war es ihnen gelungen, ein Werkzeug zu schaffen, das Code auf absolutem Profi-Niveau direkt im Block-Editor erzeugt. Diese Technologie war laut dem Team einfach zu gut, um sie nicht überall im Plugin zu nutzen.
Anstatt die neue Technik nur über die alten Blöcke zu stülpen, entschied sich das Entwicklerteam für einen radikalen, aber konsequenten Weg: Sie haben alle Blöcke von Grund auf neu gebaut. Das gab ihnen die Freiheit, ein perfektes Zusammenspiel zu garantieren und sicherzustellen, dass die neuen Blöcke so sauber, schnell und stabil wie nur möglich sind.
- Tom schreibt auf Generatepress.com über GenerateBlocks Version 2.0 ↩︎
- Tom schreibt auf Generatepress.com über GenerateBlocks Version 2.2 ↩︎
- Kathy schreibt auf Generatepress.com über GenerateBlocks Version 2.1 ↩︎