Suche
Suche
Close this search box.
WordPress Templates

WP Grundlagen – Templates

tl;dr: WP Grundlagen – Templates gibt es in WordPress schon immer. Aber mit dem FSE (Full Site Editing) ist es möglich diese mit den selben Werkzeugen zu bearbeiten wie die Inhalte. Damit kann man bei sehr vielen Projekten auf kostenpflichtige Themes und Erweiterungen verzichten.

Templates bieten die Vorlagen, die alle Seiten und Beiträge für ihr Layout verwenden. Bestimmte Template-Teile können wiederum in verschiedenen Templates eingesetzt werden. Dadurch wird Website-Layout einfach und konsistent.

Templates verstehen

Der Begriff Template wird oft verwendet, leider nicht immer mit der selben Bedeutung. Im Zeitalter der Blockthemes ist ein Template eine Vorlage in der festgelegt wird, welcher Block oder welche Gruppe von Blöcken wo auftauchen soll. Es ist also eine Art Musterseite auf der man Platzhalter unterbringt, welche dann von den echten Inhalten ausgefüllt werden. 

Die Blöcke, die man in Templates (auch) verwendet unterscheiden sich also von „normalen“ Blöcken dadurch, dass sie keine eigenen Inhalte haben sondern den Platz für die eigentliche Inhalte reservieren.

Jede einzelnen Seite, jeder Beitrag und jedes Archiv nutzt ein Template für seine Darstellung. Dieses Template kann geändert werden wodurch sich die Darstellung der Seite ändert, nicht aber deren Inhalt. 

Um ein Template einer Seite zuzuweisen gibt es in der rechten Seitenleiste unter Seite den Bereich Template. In einer Standardinstallation von WordPress mit dem Theme Twenty Twenty-Four können hier 4 Einstellungen getroffen werden. Um die Änderungen besser sichtbar zu machen wurde in dem Beispiel die Beispielseite verwendet und ein Beitragsbild gesetzt. 

Wer keine Änderung vornimmt hat das Standard-Template zugewiesen. Dieses heisst einfach Seite. 

Zusätzlich gibt es 3 weitere Templates: Seite mit Seitenleiste, Seite mit breitem Bild und Seite ohne Titel.

Die Namen der Templates lassen die Designs schon erahnen. 

An dieser Stelle schadet es nicht zu verstehen, dass sowohl ein Beitragsbild (Besser Featured Imgage) und der Titel zwar Teile einer Seite sein können, aber nicht müssen. 

Der Inhalt einer Seite ist jener Bereich, den man mit dem Blockeditor bearbeitet. Dieser besteht bei der Beispielseite aus 5 Textblöcken untereinander.

 

WordPress Seite Template
Jede Seite kann mit verschiedenen Templates dargestellt werden.

Mit der Werkzeugleiste kann man also seinen Text formatieren. Technisch gesehen werden hier HTML-Tags angewendet die dann vom Browser interpretiert werden. Wie das aussieht hängt grundsätzlich von den Browser-Default-Einstellungen ab oder eben vom CSS, das die Website verwendet.

Wenn man die vier unterschiedlichen Darstellungen nun vergleicht erkennt man schnell: der Inhaltsbereich (Text) ist überall gleich, das Beitragsbild wird unterschiedlich dargestellt. Zusätzlich zum Seiteninhalt, den Titel und dem Bild gibt es Bereiche, die Template-Teile genannt werden. Diese können in mehreren Teilen eingebaut werden. Typisch dafür sind Kopfzeile (Header) , Fußzeile (Footer) und die Seitenleiste.

Template-Teile

Es ist natürlich sinnvoll jene Bereiche zentral zu verwalten, die in verschiedenen Templates angewandt werden. Im Theme Twenty Twenty-Four (TT4) werden 4 solche Teile angelegt:

  • Footer
  • Seitenleiste
  • Beitrags-Meta
  • Header

Um diese Teile zu gestalten muß man (warum auch immer das gerade so ist) unter den Vorlagen suchen und nicht unter den Templates:

Dashboard > Design > Website-Editor > Vorlagen > Template-Teile (unten)  oder Alle Template-Teile verwalten (ganz unten)

Im Blockeditor wird versucht diese Template-Teile durch eine violette Auszeichnug sichtbar zu machen.

Schaut man sich zB. das Template für die Standard-Seite an erkennt man, dass oben ein Header und unten ein Footer eingebunden ist. 

Wenn man jetzt den Header ändert wirkt sich das auf alle Templates aus, die dieses Template-Teil einbinden. Also auch Seite mit Seitenleiste oder die Seite mit breitem Bild, nicht aber die Seite ohne Titel. 

Template Seite
Das Template für die Seite in der Listenansicht: oben und unten die Template-Teile
Template Teile WordPress Seite
Die beiden Template Teile des Templates Seite werden violett ausgezeichnet.

Beim Bearbeiten des Headers sieht man die komplexe Konstruktion: Eine Gruppe mit Zeilen, darinnen die Blöcke Website-Logo, Website-Titel und Navigation

Im Header wird also kein Bild als Logo platziert sondern die Referenz auf jene Datei gesetzt, die die Website also Logo kennt. Statt einer Überschrift mit dem Titel wird ein spezieller Block Website-Titel verwendet. Diese beiden Blöcke suchen sich aus den Einstellungen der Website die Informationen, sind sind also dynamisch.

WordPress Header bearbeiten
Wenn man den Header bearbeitet wird der Rest der Seite ausgeblendet.

Also: im Unterschied zu den aus der Arbeit an Seiten und Beiträgen bekannten Blöcke gibt es für Templates Blöcke, die nicht nur einfach ihre Inhalte formatiert darstellen sondern sich die Inhalte erst holen. 

WordPress sortiert diese Blöcke in ein Fach mit den Namen Theme. Wenn. man den Block-Inserter (also das + im blauen Button links oben) auswählt findet man diese Art von Blöcken. 

Ins Auge stechen die 5 violetten Icons: neben den 4 oben besprochenen gibt es auch noch den Block Template-Teil. Damit kann man eigene Template-Teile auf Templates unterbringen. 

Je nach Template wird man unterschiedliche Blöcke benötigen. Im Header haben wir schon die Navigation, das Website-Logo, den Website-Titel und ev. auch den Website-Untertitel gesehen. 

Bei Archivseiten wird die Abfrage-Loop oder eine Liste der Beiträge verwendet werden.

Auf Beitrag-Templates wird man Titel, Beitragsbild, Autor, Datum etc. verwenden. Und natürlich den Block Inhalt. Dieser Block fügt in das Template den ganzen Bereich ein, den man  in Seiten und Beiträgen erstellt.  Zusätzlich gibt es Blöcke für Kommentare, Suchergebnistitel etc. 

Es gibt für alle Bestandteile einer Website einen passenden Block, sonst könnte man ja gar kein Full-Site-Editing betreiben. Genau das ist der wichtigste Unterschied zu den klassischen Themes.

 

WordPress Theme Blocks
Die Theme Blocks dienen dazu, dynamisch Inhalte in Templates unterzubringen

Template Arten

Man kann die vom Theme vorgegebenen Templates bearbeiten und man kann eigene Templates erstellen. Zur Übersicht gelangt man über 

Dashboard > Design > Website-Editor > Templates

wo 11 Templates installiert wurden.

Je nach Art und Anwendung wurden die passenden Theme-Blöcke verwendet. Funktional lassen sich diese Templates gruppieren.

Archive. Alle Templates die Übersichten zeigen:

Alle Archive. Zeigt jedes Archiv an, inklusive Beiträge eines einzelnen Autors, einer Kategorie, eines Schlagworts, einer Taxonomie, eines individuellen Inhaltstyps und eines Datums. 

Blog-Startseite. Die Beitragsseite als Homepage oder Blogseite. Nach Datum.

Index: Fallback für Archive.

Suchergebnisse: für genau diese.

Seiten

Seiten, Seite mit breitem Bild, Seite mit Seitenleiste und Seite ohne Titel sind unterschiedliche Layouts. Seite: 404 ist jenes Template, dass für die Darstellung verwendet wird falls der gesuchte Inhalt nicht vorhanden ist.

Beiträge.

Einzelne Beiträge und Einzelbeitrag mit Seitenleiste sind 2 Layouts für Beiträge. 

TT4 Template Arten
Die 11 Templates die mit Twenty Twenty-Four installiert wurden

Fazit

Immer dann, wenn man nicht einen konkreten Inhalt sondern eine Layout für einen Inhalt bearbeiten will muß man sich das passende Template suchen. Dieses wird im Normalfall aus Template-Teilen wie Header und Footer und dynamischen Theme-Blöcken bestehen. 

Archive werden mit dem Abfrage-Loop Block gestaltet. 

Template-Teile für Header und Footer sind der zentrale Gestaltungsbereich für fast alle Websites.

Veröffentlicht am: 30. Januar 2024

Letztes Update: 4. Juni 2024

Datenschutz
, Inhaber: Ing. Harald Martin (Firmensitz: Österreich), verarbeitet zum Betrieb dieser Website personenbezogene Daten nur im technisch unbedingt notwendigen Umfang. Alle Details dazu in der Datenschutzerklärung.
Datenschutz
, Inhaber: Ing. Harald Martin (Firmensitz: Österreich), verarbeitet zum Betrieb dieser Website personenbezogene Daten nur im technisch unbedingt notwendigen Umfang. Alle Details dazu in der Datenschutzerklärung.