Kategorien
Content Management Systeme

Dynamische Inhalte mit dem neuen WordPress Core Query-/Abfrage-Block

Eine verwöhnte Drupal User:in schaut gelegentlich ein wenig verwirrt auf WordPress und fragt sich, wie dort eigentlich dynamische Blöcke auf den jeweiligen Inhaltsseiten erstellt werden. Also so etwas wie die neuesten fünf Beiträge, die Events im nächsten Monat, die zuletzt aktualisierten Beiträge, ein paar Portfolio Beiträge zum Thema XY und das alles unterschiedlich sortiert mit individuellem Layout und ausgewählten Feldern.

Bisher wurde so etwas in WordPress über Plugins realisiert, unter anderem auch über zusätzliche, konfigurierbare Widgets in Plugins, beispielsweise im Jetpack Plugin oder auch viel ausgefeilter in Elementor Custom Post Loops, um nur zwei Beispiele zu nennen. Im WordPress Core gibt es bisher wenige vordefinierte Widgets mit ein paar Parametern. Im Rahmen des Gutenberg-Editor Block-Konzeptes nähern sich Blöcke und Widgets nun immer mehr an und bereiten WordPress auf vollständig Block-basierte Seiten vor.

Besonders augenfällig wird dies nach dem Update auf WordPress 5.8 in der Administrationsseite der Widgets (Design -> Widgets).

Nach dem Update erscheinen dort die bisherigen Widgets in der Übersicht als Legacy-Widgets. Die Seite ist jetzt organisiert wie im Gutenberg-Editor und man sieht bereits, wie Widgets und Blöcke sich immer mehr ähneln. Widgets werden nun in einer Live-Vorschau dargestellt.

Widgets im Novatrend-Block nach Update auf WordPress 5.8

In der Widget-Ansicht im Customizer erscheint sogar eine Begrüssungsnachricht „Willkommen bei den Block-Widgets“, die bestätigt werden soll.

Hinweis: Wem das alles noch nicht geheuer ist, der kann sich das Classic Widgets Plugin laden und dann bleibt alles wie gehabt.

Wer sich allerdings auf das neue System einlässt, erlebt vielleicht einen echten Aha-Moment!

Inhalte können nun tatsächlich komplett aus Blöcken erstellt werden. Als Sahnehäubchen gibt es den Query- (English) oder Abfrage-Block (deutsch). Mit diesem Abfrage-Block lassen sich die obigen Beispiele

… also so etwas wie die neuesten 5 Beiträge, die Events im nächsten Monat, die zuletzt aktualisierte Beiträge, ein paar Portfolio Beiträge zum Thema XY, und das alles unterschiedlich sortiert mit individuellem Layout …

erstellen. Was auf den ersten Blick eine eher unscheinbare Neuerung ist, enthält auf den zweiten Blick viel Potential. Der Abfrage-Block bietet gewissermassen eine rudimentäre Benutzeroberfläche für die WP_Query Klasse in WordPress. Was bisher nur mit PHP auf Code-Ebene möglich war, kann nun über die Benutzeroberfläche konfiguriert werden. Die momentane Renaissance von No-Code-Plattformen lässt grüssen!

Wer wissen will, wo diese Entwicklung hinführen könnte, sollte sich das Layout- und das Views-Modul in Drupal ansehen. Und wenn solche Konzepte in WordPress eingeführt werden, dann wird das alles mit der Zeit noch viel benutzerfreundlicher werden 🙂

Beispiele

Ein Beispiel ist besser als tausend Worte. Der nun folgende Abfrage-Block enthält zwei Spalten mit je einem Beitrag aus der Kategorie soziale Netze und ist „Neu nach alt“ (mit dem Bezug auf das Erstellungsdatum) sortiert. Es werden maximal zwei Beträge angezeigt. Im Hintergrund ist ein Farbverlauf, die Schriftfarbe wurde verändert.

  • Invidious und Nitter als Frontend für YouTube und Twitter

    Invidious und Nitter als Frontend für YouTube und Twitter

    Wenn man mit einem Link auf ein Video bei YouTube oder einen Tweet auf Twitter verweist, dann meist, weil man diese Informationen nützlich, interessant, lustig oder auf eine andere Art und Weise wertvoll findet. Leider werden alle, die einem solchen Klick folgen, auf den jeweiligen Plattformen zunächst aufgefordert, sich doch bitte bei der jeweiligen Plattform […]


  • #neuhier – von Plattformen und Hypertexten

    #neuhier – von Plattformen und Hypertexten

    Dies ist ein linearer Text. Lies ihn bitte von Anfang bis Ende durch. Hyperlinks oder Weblinks machen es prinzipiell möglich alle Inhalte im World Wide Web zu verknüpfen. So ein Hyperlink stellt einen Querverweis zu einem anderen elektronischen Dokument dar. Durch Hyperlinks verbundene Texte nennt man Hypertext. Normalerweise hätte ich das Wort Hypertext jetzt mit […]


Wir benutzen das aktuelle WordPress-Theme Twenty-Twenty-One hier im Novatrend Blog (mit g) und ich konnte diesen Beispiel-Block (mit ck 🙂 ), während ich den Beitrag geschrieben habe, sehr einfach innerhalb des Gutenberg Editors konfigurieren!

Im Editor sieht die Zusammenstellung des Abfrage-Blocks aus wie im nächsten Screenshot. Auf der rechten Seite können die Parameter eingestellt werden.

Konfiguration eines Abfrage-Block-Blocks

Wer nun in einer Web-Agentur sitzt und die Hände über den Kopf zusammenschlägt ob der unpassenden Farben, Schriftgrössen und ähnlichen typografischen Möglichkeiten diverser Fehltritte, dem sei gesagt, das solche Blöcke natürlich auch wiederverwendbar und an individuelle Themes angepasst von einer Agentur konfiguriert werden können.

Die jeweilige Anwender:in, die den Beitrag schreibt, muss den Block nur noch im Gutenberg-Editor auswählen.

Fazit

Der Abfrage-Block ermöglicht die Verbindung während des Schreibens eines Beitrags mit der Programmierung und dem Design individueller Widgets, die dann in dem Beitrag auftauchen.

Die durchaus disruptive Neuigkeit an diesem Konzept ist die Tatsache, dass Programmierung und Design hinter einer abstrahierten No-Code Benutzeroberfläche verschwinden. Der Benutzer wählt ganz einfach aus den vordefinierten Möglichkeiten aus.

Momentan sind diese Möglichkeiten noch eingeschränkt, wer jedoch schon mal mit dem Views-Modul in Drupal gearbeitet hat, kann sich vorstellen, was in Zukunft in WordPress möglich sein wird.

Links

Von hagengraf

Ich erstelle bequeme und benutzerfreundliche Orte in virtuellen und physischen Umgebungen.

Eine Antwort auf „Dynamische Inhalte mit dem neuen WordPress Core Query-/Abfrage-Block“

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht.