WordPress 6.6 steht in den Startlöchern und bringt eine Vielzahl von Neuerungen und Verbesserungen mit sich. Dabei hat sich das Team hinter den Kulissen nach eigenen Aussagen vor allem um „polish and finesse“ gekümmert. Es geht also weniger um große, neue Funktionen, sondern eher um das Optimieren bestehender Funktionen. In diesem Artikel gebe ich dir einen Überblick zu einigen der wichtigsten Punkte, die sich ums Design, die Benutzerfreundlichkeit und die Technik drehen.

Verbesserungen rund um Design, Layout, Themes in WordPress 6.6

Pattern Overrides: Mehr Flexibilität für synchronisierte Designs

Patterns sind eine schnelle und einfache Möglichkeit, wiederkehrende Elemente vorzuhalten, die aus mehreren Blöcken bestehen. Es gibt sie bislang in zwei Varianten: synchronisiert und unsynchronisiert. 

• Bei synchronisierten Patterns werden alle Änderungen an einer Instanz automatisch auf alle anderen übertragen. So kannst du beispielsweise einen Namen, ein Bild oder eine Farbe an einer Stelle ändern und es wird automatisch überall geändert.
• Unsynchronisierte Patterns funktionieren dagegen eher wie Vorlagen: Du fügst sie hinzu und passt sie nach Bedarf an. Sie sind nicht mit anderen Instanzen verknüpft. Nachteilig ist hier natürlich, dass Änderungen nicht automatisch überall dort ebenfalls aktualisiert werden, wo du das Pattern verwendet hast.

Nun gibt es mit Overrides eine dritte Option: Damit kannst du bei einem synchronisierten Pattern festlegen, dass einzelne Blöcke anpassbar sein sollen, ohne dass diese Änderungen auf alle Instanzen übertragen werden. Das ist eine wichtige Ergänzung, wie Web Developer Dominic Vogl erklärt: 

„Diese Flexibilität ermöglicht mir bei der Content-Erstellung ein einheitliches Design ohne Kompromisse. Einfach genial, denn es spart mir viel Zeit und erleichtert die Pflege für meine Redakteur:innen enorm.“

Dominic Vogl, Web developer, Raidboxes

Ein konkretes Beispiel macht es deutlich: Du hast auf deiner Website ein Hero-Element für den oberen Bereich deiner Produktseiten und möchtest sicherstellen, dass diese Hero-Patterns zentral änderbar sind, um beispielsweise die Farbgebung für alle Instanzen festzulegen. Zugleich soll aber etwa der Produktname änderbar sein und nur für jeweils eine Seite gelten und nicht für alle. Du kannst jetzt den Block mit dem Platzhalter für den Produktnamen auswählen und in den Blockeinstellungen mit dem Button Overrides als anpassbar festlegen.

Hinter den Kulissen dieser komfortablen Funktion steht die neue Block Bindings API, die das Verbinden von Block-Attributen mit dynamischen Datenquellen ermöglicht. Sie verbessere das Bearbeiten dynamischer Daten innerhalb von Blöcken erheblich, sagt Dominic Vogl und ergänzt:

„Ein echter Gewinn für alle, die regelmäßig mit dynamischem Content arbeiten und dabei keine Sonderlösungen mit ACF oder ähnlichem basteln wollen.“

Dominic Vogl, Web developer, Raidboxes

Es ist bei alledem wichtig zu beachten, dass Pattern Overrides in WordPress 6.6 noch einigen Einschränkungen unterliegen. So werden beispielsweise nicht alle Block-Typen und -Attribute unterstützt. Auch die Möglichkeit, Custom Blocks für Overrides freizugeben, ist noch nicht implementiert. Zukünftige WordPress-Versionen sollen hier Abhilfe schaffen und weitere Blöcke, Attribute und Optionen für Overrides bereitstellen. Siehe dazu diese Diskussion auf GitHub.

Section Styles: Gestaltungsfreiheit für ganze Bereiche

Section Styles ist eine weitere Neuerung, die dir mehr Flexibilität beim Design deiner Website gibt: Damit kannst du ganze Abschnitte deiner Seiten oder Beiträge mit einem Klick individuell gestalten, ohne jeden einzelnen Block bearbeiten zu müssen. 

Das ist beispielsweise nützlich, wenn du einen Abschnitt deiner Seite hervorheben möchtest, indem du ihm einen anderen Hintergrund oder eine andere Schriftart gibst. Bislang musstest du die entsprechenden Stile auf jeden einzelnen Block in diesem Abschnitt anwenden. Mit Section Styles genügt es nun, eine Stilvariation auszuwählen, die sich auf den gesamten Abschnitt auswirkt. 

Es gibt zwei Möglichkeiten, Section Styles zu erstellen:

• Zum einen in der theme.json. Füge im styles-Objekt deiner theme.json Datei ein neues Objekt für blockTypes hinzu. Definiere hier die gewünschten Stilvariationen für die Blöcke, die du als Section Styles verwenden möchtest. 
• Zum anderen programmatisch in deinem Theme. Nutze hierfür die Funktion register_block_style(), um Stilvariationen für bestimmte Blöcke zu registrieren. Mehr dazu im offiziellen Post.

Sobald du Section Styles definiert hast, stehen sie dir im Block-Editor zur Verfügung. Wähle dazu den gewünschten Abschnitt aus und wende die passende Stilvariation über das „Stile“-Panel in der Seitenleiste.

Theme.json v3: Flexiblere Konfiguration

Die „theme.json“-Datei hat sich zu einem zentralen Element für die Konfiguration von Block-Themes entwickelt. Version 3 bringt einige Neuerungen mit sich, die die Flexibilität und Benutzerfreundlichkeit erhöhen. Allerdings beinhaltet Version 3 auch Breaking Changes, die die Kompatibilität mit älteren WordPress-Versionen  betreffen können.

Eine wichtige Änderung dreht sich um die Art und Weise, wie Standardeigenschaften überschrieben werden. Mit den neuen Optionen defaultFontSizes und defaultSpacingSizes hast du jetzt mehr Kontrolle über Standardschriftgrößen und -abstände in deinem Theme. Du kannst darüber explizit festlegen, ob die von WordPress vorgegebenen Standardwerte verwendet oder durch deine eigenen Einstellungen überschrieben werden sollen.

Eine detaillierte Beschreibung der Änderungen und weitere Informationen zur Migration findest du im offiziellen Post zu theme.json version 3.

Verbesserte CSS Specificity: Leichteres Überschreiben von Core Styles

Mit WordPress 6.6 wird die CSS Specificity im Core grundlegend überarbeitet, um Theme-Entwickler:innen das Leben zu vereinfachen. Ziel ist es, das Überschreiben von Core Styles zu erleichtern und gleichzeitig die Unterstützung für globale Stile beizubehalten.

Um dies zu erreichen, führt WordPress 6.6 eine einheitliche CSS-Spezifität von 0-1-0 für Core Block Styles und Theme.json/Global Styles ein. Dies bedeutet, dass Theme-Entwickler:innen nun eigene Styles mit einfacheren Selektoren definieren können, die die gewünschten Elemente überschreiben, ohne komplexe CSS-Regeln verwenden zu müssen.

In Zukunft könnten CSS Layers und Zero Specificity die CSS-Architektur von WordPress noch weiter verbessern.

Für mehr Details lies diesen offiziellen Blogpost und die Diskussion auf GitHub.

Grid Layouts: Ordnung und Flexibilität mit dem Raster

Die Grid Layout Option im Group Block ermöglicht es dir, Inhalte in einem Raster anzuordnen, ohne auf zusätzliche Plugins oder komplizierten Code angewiesen zu sein.

Es bietet dir zwei verschiedene Modi, um dein Raster anzupassen:

• Automatisch: WordPress erstellt automatisch ein responsives Raster, das sich optimal an verschiedene Bildschirmgrößen anpasst.
• Manuell: Du bestimmst selbst die Anzahl der Spalten und die Anordnung der Blöcke innerhalb des Rasters.

Dominic Vogl sagt dazu Folgendes:

„Die Möglichkeit, komplexe Layouts direkt im Editor zu erstellen, spart mir enorm viel Zeit und Mühe. Dieses Feature hebt meine Layouts auf ein neues Level, gibt mir mehr kreative Freiheit und vereinfacht eine saubere, responsive Darstellung der Inhalte.“

Dominic Vogl, Web developer, Raidboxes

Weitere Design-Highlights in WordPress 6.6

Es gibt noch weitere große und kleine Ergänzungen und Verbesserungen. Hier einige davon in aller Kürze:

• Pattern Management in klassischen Themes: Auch Nutzer:innen von klassischen Themes profitieren nun von der komfortablen Pattern-Verwaltung direkt im Backend.
• Mix & Match von Stilvariationen: Kombiniere verschiedene Farbpaletten und Schriftarten, um einzigartige Designs zu kreieren und deiner Website eine individuelle Note zu verleihen.
• Site-wide Background Images: Definiere ganz einfach ein Hintergrundbild für deine gesamte Website, um ein einheitliches Erscheinungsbild zu schaffen.
• Negative Margins: Nutze negative Margin-Werte, um Elemente überlappen zu lassen und so spannende visuelle Effekte zu erzeugen.
• Custom Shadows: Gestalte individuelle Schatten für deine Elemente und verleihe deiner Website mehr Tiefe und Dimension.
• Custom Aspect Ratio Presets: Definiere eigene Seitenverhältnisse für Bilder und andere Medien, um ein harmonisches Layout zu gewährleisten.

WordPress 6.6 Optimierungen rund um die User Experience

Verbesserte Data Views

Bereits mit WordPress 6.5 hielten die Data Views Einzug. Sie helfen bei der Verwaltung von Inhalten aller Art (z. B. Templates, Patterns, Beiträge, Medien) und sollen die bestehenden WP List Tables ersetzen. Denn die sind für komplexe Websites und die Anforderungen moderner Kollaborations-Workflows nicht mehr flexibel genug. Damit sind die Data Views übrigens Teil der dritten Phase des Gutenberg-Projekts, das sich um eine bessere Zusammenarbeit dreht. 

Nicht zuletzt sollen sie Entwickler:innen künftig umfassende Möglichkeiten zur Anpassung und Erweiterung bieten und so eine neue Ära der Flexibilität und Benutzerfreundlichkeit einläuten.

WordPress 6.6 baut nun auf dieser Grundlage auf und erweitert die Data Views um wichtige Funktionen und Einsatzmöglichkeiten. Sie kommen vor allem im Site-Editor zum Einsatz und verbessern die Verwaltung von Templates, Template-Parts und Seiten. 

In zukünftigen Versionen sollen die neuen Ansichten auf andere Bereiche des WordPress-Backends ausgeweitet werden, z. B. die Beitragsliste und die Mediathek. In einem eigenen Blogpost findest du weitere Hintergründe dazu.

Mehr Einheitlichkeit bei den Editoren

Bisher unterschieden sich der Block-Editor, in dem du Beiträge und Seiten erstellst, und der Site-Editor, in dem du das Design deiner Website bearbeitest, teilweise in ihrer Bedienung. Mit WordPress 6.6 werden die Abläufe in beiden Editoren stärker vereinheitlicht, um ein flüssigeres und intuitiveres Nutzererlebnis zu schaffen.

Zu den konkreten Änderungen gehören:

• Der Prozess zum Veröffentlichen von Beiträgen und Seiten wurde überarbeitet und an den Site-Editor angeglichen.
• Einstellungen und Optionen werden nun in beiden Editoren ähnlicher dargestellt und platziert.

So findest du dich in beiden Editoren (hoffentlich) besser zurecht und kannst einfacher zwischen dem Bearbeiten von Inhalten und dem Gestalten deiner Website wechseln.

Dominic Vogl begrüßt die Änderungen:

„Der Site Editor in WordPress 6.6 wächst weiter mit dem normalen Editor zusammen. Jetzt kann ich mühelos Kommandos auf mehreren Seiten anwenden und zwischen ihnen navigieren. Diese Integration macht die gesamte Bearbeitung meiner Website viel flüssiger und effizienter, was mir die Arbeit deutlich erleichtert.“

Dominic Vogl, Web developer, Raidboxes

Weitere Verbesserungen in WordPress 6.6

• Tastaturkürzel zum Gruppieren: Mit dem neuen Tastaturkürzel Strg+G (Windows) oder Cmd+G (Mac) kannst du mehrere Blöcke gruppieren und so effizienter arbeiten.
• Block-Inserter: Der Block-Inserter zeigt dir jetzt immer alle verfügbaren Blöcke an, unabhängig vom aktuell ausgewählten Block.
• Werte von Custom Fields: Die Werte lassen sich jetzt direkt aus dem verbundenen Block im Editor bearbeiten, was dir Zeit und Klicks spart.

Technische Verbesserungen in WordPress 6.6

Options API: Intelligentere Handhabung von Optionen

Um die Performance von WordPress-Websites zu verbessern, nimmt WordPress 6.6 eine wichtige Änderung an der Options API vor. Bisher wurden viele Optionen in der Datenbank bei jedem Seitenaufruf automatisch geladen (autoload), selbst wenn sie gar nicht benötigt wurden. Dies führte zu unnötigem Datenverkehr und längeren Ladezeiten, insbesondere bei Websites mit vielen Plugins.

WordPress 6.6 geht nun intelligenter mit diesen Optionen um. Der Standardwert für den $autoload-Parameter wurde von „yes“ auf „null“ geändert. Entwickler:innen sollten nun explizit angeben, ob eine Option immer „true“, nie „false“ oder nur bei Bedarf „null“ geladen werden soll.

Um Entwickler:innen die Arbeit zu erleichtern, wurden neue Funktionen und Filter eingeführt. Mit wp_autoload_values_to_autoload() lassen sich beispielsweise alle Werte abfragen, die automatisch geladen werden sollen. Über den Filter wp_default_autoload_value lässt sich das Autoload-Verhalten für einzelne Optionen anpassen. Website-Betreiber:innen werden künftig im Site Health Check darauf hingewiesen, wenn die Performance durch umfangreiche Optionen beeinträchtigt wird. Wer das vorab testen möchte, kann dafür das Performance Lab plugin installieren.

Automatische Updates: Mehr Sicherheit durch Rollback-Funktion

Automatische Updates für Plugins und Themes sind zwar praktisch, bergen aber immer das Risiko, dass eine neue Version unerwartete Probleme verursacht.

WordPress 6.6 entschärft diese Gefahr mit einer neuen Rollback-Funktion: Falls das automatische Update eines Plugins deine Website funktionsuntüchtig macht, erkennt WordPress dies automatisch und stellt die vorherige, funktionierende Version wieder her.

Weitere technische Änderungen

• PHP-Support: Mit WordPress 6.6 wird die Unterstützung für PHP 7.0 und 7.1 eingestellt. Nutzer:innen und Entwickler:innen, die noch ältere PHP-Versionen verwenden, sollten ein Update auf mindestens PHP 7.2 durchführen, um weiterhin von Sicherheitsupdates und neuen Funktionen zu profitieren.
• Internationalisierung (I18N): WordPress 6.6 erleichtert die Übersetzung und Lokalisierung von Websites durch neue Funktionen und Filter. Entwickler:innen können nun beispielsweise einfacher zwischen PHP-Übersetzungsdateien wechseln und erhalten mehr Kontrolle über den Ladeprozess.
• Admin Toolbar Search: Die Priorität der Admin Toolbar Search wurde geändert, was Auswirkungen auf Entwickler:innen haben kann, die eigene Suchfunktionen implementieren. Durch die Anpassung der Priorität wird sichergestellt, dass die WordPress-eigene Suche korrekt funktioniert, auch wenn Plugins eigene Suchfunktionen hinzufügen.

Fazit

Wie eingangs erwähnt, gibt es in dieser Version von WordPress nicht zwingend das eine große Feature. Dafür stehen eher viele kleine und nicht minder wichtige Verbesserungen an. Weitere Beispiele findest du wie immer im „Field Guide“ zur neuen WordPress-Version, der vor allem Entwickler:innen einen guten Überblick gibt. Nach meiner Erfahrung können solche „Kleinigkeiten“ oftmals große Auswirkungen haben. Ein Beispiel sind hier die Pattern Overrides, die sich bei vielen Projekten als sehr nützlich erweisen könnten. Auch die fortgesetzte Arbeit an den Data Views wird sich künftig auszahlen, wenn wir dadurch eine moderne, flexible Benutzeroberfläche bekommen. Und nicht zuletzt fließen acht Updates des Gutenberg-Projekts in den Block-Editor ein. Nutzer Marc lobte unter dem Post zur Version 18.0, dass der Editor inzwischen einen „großen Reifegrad“ erreicht habe.