Widgets im Überblick

Lektion Fortschritt:

Einige Widgets können Sie individuell anpassen: Sie können Titel vergeben, Darstellungsmöglichkeiten auswählen, ein Bild hochladen, mit einem speziellen Beitrag oder einer speziellen Seite verlinken. Hier möchten wir Ihnen die Standard-Widgets, die WordPress von Hause aus mitliefert, kurz vorstellen:

Archiv

Mit dem Archiv-Widget generieren Sie einen Link, über den Ihre bereits erstellten Beiträge dem Monat zugeordnet werden, in dem sie erstellt wurden. Sie erleichtern damit Ihren Besuchern das Suchen monatsabhängiger Inhalte.

Die Einstellmöglichkeiten des WordPress Archiv-Widgets

Folgende Einstellmöglichkeiten haben Sie:

  • Titel
    Definiert die Überschrift.
  • Als Auswahlbox darstellen
    Im Frontend wird eine Auswahlbox anstatt eine Liste dargestellt (siehe Bild unten).
  • Zeige Beitrags-Zähler
    Die einzelnen Monate erhalten einen Beitragszähler.
Archivwidget zeigt Dropdown mit Anzahl der Artikel
Das Monatsarchiv zeigt das Auswahlfeld mit Anzahl der Artikel
Archivwidget zeigt Monate
Das Monatsarchiv zeigt Monate in denen Artikel veröffentlicht wurden

Kalender

Das Kalender-Widget erstellt einen Kalender der Beiträge Ihrer Seite. Es ist eigentlich gleich dem Archiv-Widget, nur eben in Kalenderform.

Einstellmöglichkeiten im WordPress Kalenderwidget

Wie Sie sehen, sind die Einstellmöglichkeiten auf einen Titel beschränkt.

Unser aktuelles Theme zeigt im Frontend folgendes an. Die Tage an denen Beiträge erschienen sind, werden blau hervorgehoben:

WordPress Kalenderwidget im Frontend

Letzte/Neueste Beiträge

Mit diesem Widget werden immer die aktuellsten Beiträge Ihrer Website im Widgetbereich angezeigt. Sie können dabei die Anzahl der Beiträge einstellen, die aufgelistet werden sollen und festlegen, ob das Veröffentlichungsdatum mit angezeigt wird.

Einstellmöglichkeiten im Widget für die letzten Beiträage

Die Einstellmöglichkeiten:

  • Titel
  • Anzahl der Beiträge, die angezeigt werden
  • Veröffentlichungsdatum anzeigen?

Und so sieht es ungefähr aus, wenn der Haken für das Veröffentlichungsdatum gewählt ist:

Letzte-Beiträge-Widget im Frontend von WordPress

Meta

Das Meta-Widget gibt standardmäßig Links zum Loginbereich aus sowie zum Abonnement von RSS-Feeds (zu Beiträgen und Kommentaren) sowie WordPress.org-Links.

WordPress Meta-Widget Einstellungen

Hier können Sie ebenfalls nur den Titel ändern. Im Frontend sieht es ungefähr so aus:

WordPress Meta Widget Darstellung

Schlagwörter-Wolke

Die Schlagwörter-Wolke gibt eine „Wortwolke“ Ihrer meist genutzten Wörter zurück. Solche Wolken können für jede beliebige Taxonomie erstellt werden. Das können z.B. Schlagwörter oder Kategorienamen sein.

Je öfter Sie ein Wort verwenden, umso größer wird seine Darstellung in der Wolke. Besucher können dadurch Inhalte, die zu diesem Schlagwort oder eine Kategorien gehören, leichter filtern.

Einstellmöglichkeiten für das Widget Schlagwörter-Wolke

Die Einstellungen sind auch hier überschaubar:

  • Titel
  • Taxonomie
    Wählen Sie aus der Liste die Schlagwörter, Kategorien oder Linkkategorien aus. Letzteres gibt es seit geraumer Zeit in WordPress nicht mehr, werden aber trotzdem noch gelistet.

Und so sieht es im TwentySixteen-Theme aus:

Darstellung des Widgets für Schlagwörter

Und so sieht es mit einem anderen Theme aus (hier mit angedeuteter Wolke):

WordPress Schlagwörter Wolke (Widget)

Suche

Mit dem Suche-Widget erstellen Sie kinderleicht eine eigene Suchfunktion für Ihre Website. Wir empfehlen, diese im Kopfbereich oder falls nicht vorhanden, in eine Seitenleiste einzufügen. So bieten Sie den Besuchern den kürzesten Weg, um Inhalte zu finden.

WordPress Suchwidget Einstellungen

Auch hier können Sie lediglich den Titel einstellen.

Im Frontend zeigt das Widget ein Suchfeld an:

Das Suchfeld des Suchwidgets

Navigationsmenü

Mit dem Navigationsmenü-Widget (früher „Individuelle Menü“ genannt) können Sie ein Menü, welches Sie zuvor erstellt haben, auswählen. Vergeben Sie nach dem Hinzufügen zu einem Widget-Bereich einen schlüssigen Menü-Titel. Wie Sie ein eigenes Menü erstellen, erfahren Sie im Kapitel Erstellung eines individuellen Menüs.

Einstellungen für das Menü-Widget in WordPress

Die Einstellungen sind:

  • Titel
  • Wähle ein Menü
    Wählen Sie eines Ihrer erstellten Menüs aus.

So sieht es im Frontend aus:

Auflistung eines Menüs

Kategorien

Mit den Kategorien können Sie sich eine Liste oder eine ausklappbare Liste Ihrer verwendeten Kategorien anzeigen lassen. Besucher können dadurch gezielt die für sie interessanten Kategorien anwählen und erhalten alle zur Kategorie gehörenden Beiträge aufgelistet.

Mögliche Einstellungen im Kategorien-Widget

Einstellmöglichkeiten:

  • Titel
  • Als Auswahlbox darstellen
    Aktivieren Sie diesen Haken, um im Frontend eine Auswahlbox statt einer Liste darzustellen.
  • Zeige Beitrags-Zähler
    Aktivieren Sie diesen Haken, um hinter dem Kategorienamen die Anzahl der Beiträge anzuzeigen.
  • Zeige die Hierarchie an
    Kategorien können in Hierarchien angelegt werden. Hiermit stellen Sie ein, ob die Liste flach oder eben in Hierarchieform angezeigt werden soll.

Hier einige Beispiele mit den verschiedenen Optionen:

Neueste Kommentare

Über dieses Widget lassen sich die letzten Kommentare von Besuchern zu Ihren veröffentlichten Beiträgen anzeigen (Kommentare von Besuchern können nur zu Beiträgen verfasst werden). Auch hier können Sie festlegen, wie viele Kommentare aufgelistet werden sollen.

Einstellungsbereich für das Widget für letzte Kommentare

Die möglichen Einstellungen sind übersichtlich:

  • Titel
  • Anzahl der Kommentare

Und so sieht es im Theme TwentySixteen aus:

Auflistung der letzten Kommentare

RSS

Sicherlich haben Sie schon gelesen, was ein RSS-Feed ist. Zur Wiederholung: Damit lassen sich Inhalte für RSS-Applikationen aufbereiten. Aber solche Feeds lassen sich auch noch für ganz andere Dinge zweckentfremden. Zum Beispiel zum Einbinden externer Inhalte auf der eigenen Seite.

Mit dem RSS-Widget können Sie also Inhalte z.B. zu Ihrer zweiten Website, einem Feed aus der Branche oder ähnlichem darstellen.

Einstellungen des RSS-Widgets in WordPress

Die Einstellungen sind:

  • URL des RSS-Feeds
  • Titel
  • Anzahl der Einträge
    Dies ist natürlich nur eine theoretische Anzahl. Sie können nicht 20 Einträge anzeigen lassen, wenn der Feed nur 10 ausliefert.
  • Beitrags-Inhalt anzeigen?
    Ein Teil des Inhalts wird angezeigt.
  • Beitrags-Autor anzeigen?
    Der Name des Autors (falls verfügbar) wird angezeigt.
  • Beitrags-Datum

Und so sieht es aus:

Seiten

Eine Liste all Ihrer Seiten gibt Ihnen das Seiten-Widget aus.

Einstellungen im Seiten-Widget von WordPres

Mögliche Einstellungen:

  • Titel
  • Sortieren nach
    • Seitentitel
      Sortiert wird nach Seitentitel und zwar nach 1, 2, 3, A, B, C, usw.
    • Reihenfolge der Seiten
      Im Kapitel So erstellen Sie eine Seite haben Sie gelernt, dass es eine Metabox mit dem Namen „Attribute“ gibt. Dort wiederum befindet sich ein Feld mit der Bezeichnung „Reihenfolge“, in die eine Zahl eingetragen werden soll. Und genau dieses Feld ist mit „Reihenfolge der Seiten“ gemeint. WordPress nutzt die Zahl der „Reihenfolge“, um die Seiten zu sortieren.Attribute für Seiten
    • Seiten-ID
      WordPress nutzt die ID der Seite für die Sortierung. Letztlich zeigt die ID die Reihenfolge der Erstellung auf. Wie Sie an die ID einer Seite kommen, lesen Sie weiter unten.
  • Ausschließen
    Eine durch Komma getrennte Liste von IDs der Seiten, die Sie ausschließen wollen. Wie Sie an die ID einer Seite kommen, lesen Sie weiter unten.

Und so sieht’s aus:

Auflistung von Seiten mit dem WordPress-Seiten-Widget

Einfache Auflistung von Seiten

Wie finde ich eine Seiten-ID?

In WordPress hat alles eine eindeutige ID. Das gilt für Seiten genauso wie für Beiträge oder andere Dinge. Alles muss in der Datenbank letztlich über eine eindeutige Nummer auffindbar sein. Das ist praktisch. So gibt es keine Verwirrung. Aber wie findet man die ID?

Leider ist das Vorgehen zum Herausfinden einer ID etwas unschön. Eine richtige Anzeige gibt es in WordPress so leider nicht. Zumindest nicht in der Grundinstallation. Trotzdem benötigt man die ID (wie oben beschrieben) oft für diverse Dinge, wie z.B. für das Aus- oder Einschließen von Inhalten.

  1. Klicken Sie im WordPress-Backend auf den Menüpunkt „Seiten“ oder „Beiträge“.
  2. Sie erhalten dann eine Auflistung.
  3. Klicken Sie auf einen Titel, um somit den Bearbeitungsmodus zu starten (Im Detail beschrieben unter So erstellen Sie eine Seite).
  4. Nun werfen Sie einen Blick auf die Adresszeile Ihres Browsers. Dort finden Sie den Parameter „post“, gefolgt von einem Istgleichzeichen und dahinter einer Nummer. Im Bild unten ist das die Nummer 30. Und genau das ist die eindeutige ID des Beitrags (siehe Bild unten):
Adresszeile des Browsers zeigt ID einer Seite in WordPress
Die hier vorliegende Seite hat die ID 30.

Text

Über das Text-Widget können Sie normalen Text oder HTML-Code zu Ihren Widgetbereichen hinzufügen. Sinnvoll immer dann, wenn kein anderes Widget hilft.

Einstellungen:

  • Titel
  • Inhalt
    Dies kann reiner Text oder HTML-Quelltext sein. PHP funktioniert hier leider nicht.

HTML

Über das Text-Widget können Sie reinen HTML-Code zu Ihren Widgetbereichen hinzufügen. Sinnvoll immer dann, wenn kein anderes Widget hilft.

Einstellungen:

  • Titel
  • Inhalt

Oft genutzte HTML Tags

Hier möchten wir Ihnen zwei HTML-Tags vorstellen, die Sie eventuell brauchen könnten:

Links

Quellcode:

Dies ist ein Link zur <a href="http://www.tagesschau.de/">ARD Tagesschau</a>.

Ausgabe:

Dies ist ein Link zur ARD Tagesschau.

Bilder

Quellcode zur Ausgabe eines Bildes:

<img src="http://wp-kurs.local/wp-content/uploads/2014/08/wordpress-widget-text-mit-absaetzen-1024x729.jpg" alt="WordPress Widget mit Beispieltext im Frontend und Backend" width="490" height="349" />

Wichtig sind hier die folgenden Parameter:

  • src: Beinhaltet die URL zum Bild
  • alt: Ein Alternativtext, der angezeigt wird, solange das Bild geladen wird bzw. falls das Bild nicht geladen werden kann.
  • width: Die Breite des Bildes.
  • height: Die Höhe des Bildes.

Weitere HTML-Codes

Wenn Sie mehr über HTML an sich wissen wollen, empfehlen wir die Website http://de.selfhtml.org.

Bild/Galerie

Mit dem Galerie-Widget lassen sich – wieder Name schon sagt – mehrere Bilder auf einmal in ein Widget integrieren. Das Bild-Widget hingegen erlaubt nur eines.

Audio/Video

Mit dem Audio- bzw. dem Video-Widget können Sie die entsprechenden Dateien hochladen und zum Anhören/Ansehen bereitstellen. Gehen Sie noch einmal zurück zum Kapitel Videos einbinden, wenn Sie noch einmal nachsehen wollen, wie das genau funktioniert.