Bisher ist es teilweise (sehr) frustrierend gewesen, einzelne Block-Optionen im Editor zu konfigurieren oder zu deaktivieren. Wollten wir etwa, dass für unterschiedliche Blöcke unterschiedliche Farbpaletten zur Verfügung stehen, müssten wir einige Umwege in Kauf nehmen. Und um zum Beispiel die Ausgabe der Initialbuchstabe-Option beim Absatz-Block zu deaktivieren, half nur das Ausblenden mit CSS, das auch nicht so einfach ist, weil die meisten Optionen nur sehr generische Klassen haben (zum Beispiel die Initiale-Option …).

Doch mit WordPress 5.8 erscheint, als Retterin in der Not: die theme.json.

Das Plugin Save Post. Check Links. prüft nach Speichern eines Inhalts, ob die enthaltenen Links gültig sind. Dafür wird in Gutenberg ein AJAX-Request abgeschickt und mit der Antwort eine gegebenenfalls notwendige Fehlermeldung ausgegeben.

Doch wie führen wir in Gutenberg am besten eine Aktion aus, nachdem ein Inhalt gespeichert wurde? Das ist eigentlich recht einfach.

Ein Gutenberg-Block kann komplett ohne zusätzliche Tools mit klassischem JavaScript erstellt werden. Einfacher und übersichtlicher (zumindest nach meinem Empfinden) wird es aber durch den Einsatz von Dingen wie JSX, damit HTML-Elemente innerhalb von JavaScript fast wie normale HTML-Elemente erstellt werden können.

Weniger einfach ist an dem Teil die Einrichtung der Entwicklungsumgebung, um etwa JSX nutzen zu können. Inzwischen ist das aber deutlich leichter geworden, so gibt es ein NPM-Package, das eigentlich alles mitbringt, was für die Gutenberg-Entwicklung notwendig ist 🎉

Eigentlich wollte ich einen Artikel darüber schreiben, wie einzelne Patterns in einem Block zur Auswahl dargestellt werden könnten, wie die Layout-Optionen im Spalten-Block.

Letztlich wurde es jetzt aber erst mal ein Block, der alle Block-Vorlagen zur Auswahl anbietet und gleichzeitig für jede Block-Vorlage eine Variation beinhaltet, sodass Patterns auch direkt über den Block-Inserter eingefügt werden können. So können sich Benutzerinnen und Benutzer, die häufig Patterns verwenden und nicht mehr die visuelle Vorschau des Pattern-Inserters benötigen, einige Zeit beim Einfügen der Patterns sparen. 🎉