Wiederverwendbare Blöcke zwischen Sites einer Multisite synchronisieren

Im Block-Editor können wiederverwendbare Blöcke erstellt werden. Diese Blöcke lassen sich dann wie Core- und Plugin-Blöcke normal einfügen. Sobald eine Instanz dieses Blocks bearbeitet wird, wird überall diese aktualisierte Version ausgespielt.

Ein nützlicher Anwendungsfall für diese wiederverwendbaren Blöcke ist beispielsweise die Darstellung von Team-Mitgliedern, wenn einzelne davon auch auf anderen Seiten als Ansprechpartnerinnen und Ansprechpartner angezeigt werden sollen. Hier zeige ich, wie sich diese Blöcke zwischen mehreren Sites einer Multisite synchronisieren lassen, um über das gesamte Netzwerk hinweg immer den aktuellen Stand anzuzeigen.

Gutenberg-Blöcke übersetzen

Seit WordPress 5.0 können auch in JavaScript Übersetzungsfunktionen genutzt werden. Beim Bau von Gutenberg-Blöcken sind die sehr nützlich, allerdings gibt es ein paar Hürden bei der Übersetzung, wenn das Plugin mit dem Block nicht im offiziellen WordPress.org-Verzeichnis liegt. Hier zeige ich, wie Übersetzungen für Blöcke angelegt werden können.

Voraussetzungen

Neben einem Plugin, in dem wir JS-Strings übersetzen möchten, brauchen wir WP-CLI 2.2.0 oder neuer. Falls ihr das Tool noch nicht installiert habt, findet ihr auf der Installing-Seite des WP-CLI-Handbuchs verschiedene Möglichkeiten dafür.

Alternativen Stil für Gutenberg-Block erstellen

Für den Gutenberg-Editor gibt es die Möglichkeit, alternative Block-Stile zu erstellen. Bei der Auswahl eines Stils wird dann eine CSS-Klasse eingefügt und der Block kann ein angepasstes vordefiniertes Design erhalten. Von Haus aus hat beispielsweise der Zitat-Block einen Stil »Groß«. Hier zeige ich anhand eines kleinen Beispiel-Plugins, wie sich so ein Stil erstellen lässt.

Einrichtung von Webpack für die Gutenberg-Entwicklung

Um einen Gutenberg-Block zu entwickeln, braucht es theoretisch nichts außer einem Text-Editor. Wer sich das Leben aber etwas leichter machen möchte (oder mindestens zunächst schwerer, wenn die Tools noch nicht bekannt sind), kann

  • Babel einsetzen, um mit modernem JavaScript zu entwickeln, das nach Kompilierung trotzdem auch von älteren Browsern verstanden wird
  • SASS einsetzen, um sich Schreibarbeit bei den Styles zu sparen und
  • ein Tool wie Webpack nutzen, um Babel und die SASS-Kompilierung (und eventuelle weitere Dinge, wie automatische Generierung eines SVG-Sprites aus vielen einzelnen SVG-Icons, et cetera) nicht immer manuell anstoßen zu müssen.

Hier zeige ich am Beispiel von Webpack ein minimales Setup, das modernes JavaScript mit Babel kompiliert und SASS zu CSS macht.

„State of the Word“ – WordPress im Jahr 2018

Wie schon im letzten Jahr hat Matt Mullenweg in seiner Rede „State of the Word“ über die Fortschritte des WordPress-Projekts in den letzten zwölf Monaten berichtet. Der deutliche – und im Voraus absehbare – Schwerpunkt lag auf dem neuen Block-Editor, der am 6. Dezember veröffentlicht wurde. 

Der Block-Editor

Die erste Hälfte seines Vortrags verwandte Mullenweg also darauf, die Beweggründe für die Entwicklung des Gutenberg-Editors vorzustellen und einen kurzen Abriss der Möglichkeiten des Editors zu geben.

Der Zwischenstand, während wir uns auf das Ende von Phase 1 des Gutenberg-Projekts zubewegen: Zusätzlich zu den 70 Blöcken, die zusammen mit WordPress 5.0 ausgeliefert werden, sind inzwischen schon über 100 Blöcke von Plugin-Entwicklerinnen und -Entwicklern auf WordPress.org verfügbar. 

Warum Gutenberg mehr als nur ein Editor ist

In den letzten Monaten wird vermehrt über den neuen WordPress-Editor „Gutenberg“ berichtet, der in der nächsten großen Version – WordPress 5.0 – kommen wird. Doch das Gutenberg-Projekt ist weit mehr als nur ein neuer Editor.

In der jährlichen State of the Word Präsentation auf dem WordCamp US 2016 kündigte der WordPress Mitbegründer Matt Mullenweg an, wieder die Leitung der WordPress-Produktentwicklung zu übernehmen und dabei drei Hauptfokusse zu haben. Die REST-API, den Editor und den Customizer. Die drei Bereiche bilden die Grundlage für das Projekt mit dem Codenamen „Gutenberg“. Dieses Projekt hat es sich zum Ziel gesetzt das Erstellen und Verwalten von Inhalten auf Webseiten möglichst einfach und intuitiv zu gestalten. Aktuell gibt es viele verschiedene Konzepte (Beiträge, Widgets, Shortcodes, Menüs, Benutzerdefinierte Felder …) um Inhalte zu verwalten und die Art von Inhalten hat sich in den letzten Jahren immer weiter diversifiziert. Gutenberg soll die Grundlage für die nächsten Jahre in WordPress und somit für 30% des Internets schaffen. Die Entwicklungsphase von Gutenberg kann dabei in drei Schritte unterteilt werden.