Blog

Beitragsbild-Block-Editor-Tutorial-8

Teil 8: Widgets im WordPress-Block-Editor

WordPress - Tipps & Tricks
Lesedauer: 4 min

In einer Serie von Anleitungen führen wir Sie in den neuen Standardeditor von WordPress ein. Dies ist Teil 8 unseres Block-Editor-Tutorials, in dem wir die Widget-Blöcke vorstellen.

Teil 1: Eine Einführung in den Block-Editor
Teil 2: Dokument-Einstellungen der Beiträge und Seiten
Teil 3: Die wichtigsten Grundfunktionen und Einstellungen
Teil 4: Grundlegende Blöcke
Teil 5: Strukturelle und komplexe Blöcke
Teil 6: Überblick über Struktur und Inhalt
Teil 7: Wiederverwendbare Blöcke
Teil 8: Widgets (dieses Tutorial)

Das Widget wird zum Block

Früher nur in bestimmten Bereichen einsetzbar oder durch spezielle Pagebuilder oder Plugins anderweitig verwendbar, bricht der Block-Editor den alten Gebrauch der Widgets auf. Das starre Raster verschwindet und man sieht immer deutlicher wohin die Reise von WordPress mit dem Block-Editor gehen soll — nämlich irgendwann themeunabhängig auch Header, Footer und Sidebars mithilfe von Blöcken anlegen und gestalten zu können.

Schon jetzt ist es möglich, vorhandene Widget-Blöcke aus der Block-Bibliothek an beliebiger Stelle des Dokuments einzufügen (Abbildung 1).

Block-Bibliothek mit aufgeklapptem Widgets-Bereich im WordPress-Block-Editor

Abbildung 1 – Block-Bibliothek mit aufgeklapptem Widgets-Bereich im WordPress-Block-Editor

Aktuell (WordPress Version 5.4) stehen folgende Widgets zur Verfügung:

  • Shortcode
  • Archive
  • Kalender
  • Kategorien
  • Neueste Kommentare
  • Neueste Beiträge
  • RSS
  • Suchen
  • Social Icons
  • Schlagwörter-Wolke

Die Widget-Blöcke kurz erklärt

Shortcode-Block

Mit dem Shortcode-Block können Sie Shortcodes einfügen. Der Vorteil der Verwendung dieses Blocks ist, dass Sie so verwendete Shortcodes einfach zu erkennen und auffindbar sind. Einstellungsoptionen gibt es nicht, da sie nicht benötigt werden.

Archive-Block

Den Archive-Block verwendet Sie, wenn Sie eine monatliche Übersicht der Beiträge anzeigen möchten.
Die Block-Einstellungen enthalten weitere Optionen, wie das Einstellen als Dropdown-Liste oder das Anzeigen der Beitragszahl.

Block-Einstellungen des Archive-Blocks im Block-Editor

Abbildung 2 – Block-Einstellungen des Archive-Blocks im Block-Editor

Kalender-Block

Um einen Kalender mit Verlinkung der beitzräge nach Veröffentlichungsdatum einzubinden, verwenden Sie einen Kalender-Block. Das Layout des Kalender-Blocks ist abhängig vom verwendeten Theme und kann bisher nicht individuell angepasst werden.

Kategorien-Block

Haben Sie Ihre Beiträge kategorisiert, dann können Sie mithilfe der Kategorien-Blocks Ihre Beiträge nach Kategorien gelistet anzeigen. Über die Block-Einstellungen (Abbildung 3) oder über die Block-Werkzeugleiste können Sie das Widget noch ein wenig konfigurieren: Über Regler lassen sich die Kategorien als Dropdown-Liste anzeigen, die Hierarchien einblenden und die Beitragsanzahl ergänzen.

Block-Einstellungen des Kategorie-Blocks im Block-Editor

Abbildung 3 – Block-Einstellungen des Kategorie-Blocks im Block-

Neueste Kommentare-Block

Sofern Sie Kommentare zu Ihren Beiträgen zulassen, wird dieser Block die letzten Kommentare inklusive Avatar, Textauszug und Datum an eingefügter Stelle ausgeben.

Nutzen Sie die Block-Einstellung, um die Anzahl der Kommentare zu regulieren und die Ausgabe von Avatar, Textauszug und Datum zu steuern (Abbildung 4).

Block-Einstellungen des „Neueste Kommentare“-Blocks im WordPress-Block-Editor

Abbildung 4 – Block-Einstellungen des „Neueste Kommentare“-Blocks im WordPress-Block-Editor

Hinweis: Achten Sie aufgrund der DSGVO darauf, die Avatare für Kommentare nicht anzeigen zu lassen. Diese werden von externen Servern geladen und stehen unter Verdacht, personenbezogene Daten Ihrer Besucher zu übertragen. Wir raten Ihnen deshalb, über die allgemeinen WordPress-Einstellungen unter Einstellung > Diskussion > Avatare > Avatar anzeigen diese Funktion zu deaktivieren!

Neueste Beiträge-Block

Auch die Funktion dieses Blocks ist ziemlich selbst erklärend. Deswegen gleich rüber zu den Block-Einstellungen, die in Abbildung 5 abgebildet sind.

Block-Einstellungen für den „Neueste Beiträge“-Block in der Listenansicht im WordPress-Block-Editor

Abbildung 5 – Block-Einstellungen für den „Neueste Beiträge“-Block in der Listenansicht im WordPress-Block-Editor

Mit dem Beitragsinhalt bestimmen Sie, ob neben dem Titel auch jeweils die Texte ausgegeben werden und wenn ja, in Form des vollständigen Beitrags oder doch lieber nur den Textauszug, dessen maximale Anzahl von Wörtern Sie einstellen können.

Ist das Beitragsdatum relevant? Betätigen Sie den Regler!

Ebenso verhält es sich mit dem. Die Bildgröße kann mittels Beitragsbild-Einstellung auf drei verschiedenen Wegen bestimmt werden. Auch die Bildausrichtung nehmen Sie hier vor.

Unter Sortieren und filtern legen Sie Reihenfolge und Anzahl der anzuzeigenden Beiträge aus einer oder mehreren Kategorien fest.

Die Block-Werkzeugleiste komplettiert das Darstellungsangebot dieses Widget-Blocks, denn durch die Auswahl der Rasteransicht (Abbildung 6) erhält der Eintrag Sortieren und filtern die Option die Spalten-Anzahl festzulegen.

 

Block-Werkzeugleiste des „Neueste Beiträge“-Blocks im Block-Editor

Abbildung 6 – Block-Werkzeugleiste des „Neueste Beiträge“-Blocks im Block-Editor

RSS-Block

Halten Sie Ihre Besucher auf dem Laufenden und zeigen Sie RSS- oder Atom-Feeds beliebiger Websites über den RSS-Block an. In den Block-Einstellungen passen Sie die Ausgabe der Feeds an, ob mit oder ohne Autor, Datum oder Textauszug und bestimmen Sie die Anzahl der angezeigten Beiträge (Abbildung 7). Wählen Sie über die Block-Werkzeugleiste wieder zwischen Listen- und Rasteransicht oder passen die URL durch das Bedienelement Bearbeiten (Stift-Icon) an.

Block-Einstellungen des RSS-Blocks im WordPress-Block-Editor

Abbildung 7 – Block-Einstellungen des RSS-Blocks im WordPress-Block-Editor

Suchen-Block

Über den Suchen-Block wird eine Suche in das Dokument integriert. Die Überschrift des Suchfeldes und die Beschriftung des Buttons sind frei wählbar. Optional ist auch die Vergabe eines Platzhalter-Texts direkt im Block-Element möglich. Block-Einstellungen sind bisher nicht verfügbar. Abbildung 8 zeigt den Suchen-Block mit Standardtexten und Abbildung 9 durch uns veränderte Texte des Widgets.

Der Suchen-Block des Block-Editors ohne Änderungen

Abbildung 8 – Der Suchen-Block des Block-Editors ohne Änderungen

 

Der Suchen-Block mit textlichen Änderungen im WordPress-Block-Editor

Abbildung 9 – Der Suchen-Block mit textlichen Änderungen im WordPress-Block-Editor

Social Icons-Block

Über den Social Icons-Block fügen Sie Icons der bekanntesten sozialen Netzwerke in Ihr Dokument ein.
Nach Auswahl des Blocks werden Ihnen sechs Icons angezeigt (Abbildung 10). Zur Auswahl klicken Sie auf ein gewünschtes Icon und geben die URL ein. Nun wird Ihnen der entsprechende Dienst auf der Außenseite (Frontend) angezeigt.
Sollte Ihr Lieblingsdienst in der Vorauswahl nicht dabei sein, nutzen Sie das „+“ am Ende der Zeile und durchstöbern die Liste.

„Social Icons“-Block mit Vorauswahl und URL-Eingabe im Block-Editor

Abbildung 10 – „Social Icons“-Block mit Vorauswahl und URL-Eingabe im Block-Editor

Jetzt noch einen der drei zur Auswahl stehenden Stile in den Block-Einstellungen wählen und die Icons werden Standard, nur als Logo oder in Pillenform (Abbildung 11) dargestellt.

Block-Einstellungen des „Social Icons“-Block im Block-Editor

Abbildung 11 – Block-Einstellungen des „Social Icons“-Block im Block-Editor

Schlagwörter-Wolke-Block

Wie der Name es schon vermuten lässt, wird die ausgewählte Taxonomie (Schlagwörter oder Kategorien) als „Wolke“ dargestellt und optional mit einer Beitragszahl über die Block-Einstellung versehen (Abbildung 12).

Block-Einstellungen des Schlagwörter-Wolke-Blocks im WordPress-Block-Editor

Abbildung 12 – Block-Einstellungen des Schlagwörter-Wolke-Blocks im WordPress-Block-Editor

Zu guter Letzt – Vorläufiger Abschluss unseres Block-Editor-Tutorials

Wir hoffen, wir konnten Ihnen den Block-Editor und die Zukunft von WordPress durch unsere Serie von Anleitungen näher etwas näher bringen. Doch wir können es nicht häufig genug sagen: Der WordPress-Block-Editor ist auch noch anderthalb Jahre nach der Einbindung in WordPress mitten im Entwicklungsprozess. Rechnen Sie mit stetigen Updates in der die Optik, der Benutzerführung und den Funktionen. Auch neue Blöcke werden hinzukommen, ebenso werden die Einsatz-Bereiche für Blöcke ausgeweitet.

Bei signifikanten Änderungen werden wir Sie auf dem Laufenden halten und bestehende Tutorials aktualisieren, sowie neue Beiträge verfassen.

,
Lesedauer: 4 min

Schreiben Sie einen Kommentar

Ihre E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Fill out this field
Fill out this field
Bitte geben Sie eine gültige E-Mail-Adresse ein.

Menü