WordPress: Templates vs. Vorlagen

Wo ist eigentlich der Unterschied?

Das ist eine berechtigte Frage, denn im deutschen WordPress-Dashboard geht es sprachlich manchmal etwas durcheinander. Seit der Einführung des Full Site Editing (FSE) haben beide Begriffe eine sehr spezifische Bedeutung.

Kurz gesagt: Ein Template bestimmt das Layout einer ganzen Seite (den Rahmen), während eine Vorlage (Pattern) ein vorgefertigtes Design-Element innerhalb einer Seite ist.

1. Templates (Die Struktur)

Ein Template ist die architektonische Blaupause für deine Website. Es legt fest, wie bestimmte Seitentypen (z. B. ein einzelner Blogbeitrag, die Startseite oder eine 404-Fehlerseite) grundsätzlich aufgebaut sind.

Ebene: Global / Seiten-Niveau.
Was es steuert: Wo befindet sich der Header? Wo ist der Footer? Wo wird der eigentliche Inhalt (Content) ausgespuckt?
Bearbeitung: Im Site-Editor (Design > Editor > Templates).
Beispiel: Ein “Single Post”-Template sorgt dafür, dass jeder deiner Blogartikel automatisch das gleiche Layout hat.

2. Vorlagen / Patterns (Die Bausteine)

Vorlagen (im Englischen “Patterns”) sind Sammlungen von Blöcken, die bereits fertig gestaltet sind. Du kannst sie einfach in eine Seite oder ein Template einfügen, um Zeit zu sparen.

Ebene: Lokal / Inhalts-Niveau.
Was es steuert: Die Anordnung von Text, Bildern, Buttons oder Spalten für einen bestimmten Bereich.
Bearbeitung: Direkt im Beitrags- oder Seiteneditor über das „+“-Icon (Tab „Vorlagen“).
Beispiel: Eine fertige „Über mich“-Sektion mit einem Bild links und Text rechts oder eine Preistabelle.

Der direkte Vergleich

Merkmal	Template	Vorlage (Pattern)
Zweck	Definiert das gesamte Seitenlayout.	Bietet fertige Design-Schnipsel.
Anwendung	Wird automatisch vom System zugewiesen.	Wird manuell vom Nutzer eingefügt.
Umfang	Header, Content-Bereich, Sidebar, Footer.	Buttons, Galerien, Call-to-Action Boxen.
Flexibilität	Ändert man das Template, ändert es sich überall.	Kann nach dem Einfügen individuell angepasst werden.

Ein kleiner Tipp zur Unterscheidung: Wenn du dich fragst: „Wo soll das Logo hin?“, arbeitest du am Template. Wenn du dich fragst: „Wie soll mein Kontaktformular in diesem Artikel aussehen?“, benutzt du eine Vorlage.

Wie man eigene Vorlage (Pattern) erstellst, um sie auf mehreren Seiten wiederzuverwenden

Eigene Vorlagen (Patterns) zu erstellen ist einer der besten Wege, um beim Arbeiten mit WordPress Zeit zu sparen und ein einheitliches Design zu behalten.

Seit den neueren WordPress-Versionen ist das Erstellen direkt im Editor möglich, ohne dass du eine einzige Zeile Code schreiben musst.

Schritt-für-Schritt: So erstellst du eine Vorlage

Design entwerfen: Erstelle in einem Beitrag oder auf einer Seite die Block-Kombination, die du speichern möchtest (z. B. eine Kombination aus einem Bild, einer Überschrift und einem Button).
Blöcke gruppieren: Markiere alle Blöcke, die zur Vorlage gehören sollen. Klicke in der Werkzeugleiste auf die drei Punkte (⋮) und wähle „Gruppieren“.
Zur Vorlage machen: Klicke erneut auf die drei Punkte der Gruppe und wähle „Vorlage erstellen“ (oder „Zu Vorlagen hinzufügen“).
Einstellungen festlegen:
- Name: Gib der Vorlage einen klaren Namen (z. B. “Mein Call-to-Action”).
- Kategorie: Du kannst sie einer Kategorie wie “Banner” zuordnen, damit du sie schneller wiederfindest.
- Synchronisiert (Wichtig!): * An: Wenn du die Vorlage später änderst, wird sie überall auf der Website aktualisiert, wo sie eingebaut wurde.
  - Aus: Die Vorlage dient nur als Startpunkt. Wenn du sie einfügst, kannst du sie auf jeder Seite individuell anpassen, ohne dass andere Seiten davon beeinflusst werden.

Wo findest du deine Vorlagen wieder?

Wenn du an einer neuen Seite arbeitest, kannst du deine gespeicherten Vorlagen ganz einfach abrufen:

Klicke oben links auf das blaue „+“ (Block-Inserter).
Wechsle zum Tab „Vorlagen“.
Dort findest du unter „Meine Vorlagen“ alles, was du selbst erstellt hast.

Der Profi-Weg: Die zentrale Verwaltung

Wenn du viele Vorlagen hast und diese zentral löschen oder umbenennen willst, gehe im Dashboard zu: Design > Editor > Vorlagen.

Dort hast du eine Übersicht wie in einer Bibliothek und kannst sogar Vorlagen aus- und importieren (als JSON-Datei), falls du sie auf einer anderen Website nutzen möchtest.

Kleiner Tipp: Nutze die “Synchronisiert”-Funktion für Dinge wie Newsletter-Anmeldungen. Wenn du den Text im Formular änderst, musst du es nur an einer Stelle tun, statt 50 Blogartikel einzeln zu bearbeiten.

Eine Vorlage exportieren, um sie auf einer anderen WordPress-Seite zu verwenden

Das ist extrem praktisch, wenn du ein Design-Element (wie einen schicken “Über mich”-Block oder eine Preistabelle) einmal perfekt gebaut hast und es auf eine andere Website übertragen willst.

Hier ist der schnellste Weg, um deine Vorlagen zu exportieren und woanders wieder zu importieren:

1. Vorlage exportieren (Die Quelle)

Gehe auf der Website, auf der die Vorlage bereits existiert, wie folgt vor:

Navigiere im Dashboard zu Design > Editor.
Klicke im linken Menü auf Vorlagen (Patterns).
Suche die Vorlage, die du übertragen möchtest (meistens unter “Meine Vorlagen”).
Klicke auf die Vorlage, um die Detailansicht zu öffnen.
Klicke oben rechts auf die drei Punkte (⋮) neben dem Such-Icon oder dem Bearbeiten-Stift.
Wähle „Als JSON exportieren“.
- Ergebnis: Du erhältst eine kleine Datei auf deinem Computer (z. B. mein-tolles-layout.json).

2. Vorlage importieren (Das Ziel)

Gehe nun auf die neue Website, auf der du das Design nutzen möchtest:

Navigiere auch hier zu Design > Editor > Vorlagen.
Klicke oben rechts auf das kleine „+“ Plus-Icon (neben der Lupe oder dem Wort “Vorlagen”).
Wähle die Option „Vorlage aus JSON importieren“.
Wähle die Datei aus, die du gerade gespeichert hast.
Fertig! Die Vorlage erscheint nun in deiner Bibliothek und kann sofort in Beiträgen oder Seiten verwendet werden.

Ein wichtiger Hinweis zu Bildern

Wenn deine Vorlage Bilder enthält, passiert beim Import Folgendes:

Das System versucht, das Bild von der ursprünglichen Website zu laden.
Besser: Lade die Bilder manuell in die Mediathek der neuen Seite hoch und ersetze sie in der importierten Vorlage einmal kurz. So verhinderst du, dass Bilder verschwinden, falls die alte Website mal offline geht.

Bonus: Mehrere Vorlagen auf einmal?

Falls du ein ganzes Set an Vorlagen übertragen willst, kannst du im Vorlagen-Menü auch alle markieren (Checkboxen) und gesammelt exportieren. WordPress packt diese dann meist in eine ZIP-Datei.

Eine Vorlage so einstellst, dass sie sich automatisch auf allen Seiten aktualisiert, wenn du sie an einer Stelle änderst?

Das Stichwort hierfür ist „Synchronisierte Vorlagen“

Das ist im WordPress-Alltag ein echter „Gamechanger“, besonders für Elemente wie Call-to-Action-Boxen, Newsletter-Anmeldungen oder Kontakt-Hinweise.

Synchronisierte Vorlagen (früher „Wiederverwendbare Blöcke“) funktionieren wie ein Spiegel: Änderst du das Design oder den Text an einer Stelle, ändert sich die Vorlage auf der gesamten Website gleichzeitig.

So erstellst du eine synchronisierte Vorlage

Wenn du einen Block oder eine Gruppe von Blöcken erstellt hast:

Klicke auf die drei Punkte (⋮) in der Werkzeugleiste des Blocks.
Wähle „Vorlage erstellen“.
Im nun erscheinenden Fenster siehst du den Schalter „Synchronisiert“.
Stelle sicher, dass dieser Schalter aktiviert (blau) ist.
Klicke auf „Erstellen“.

Woran erkenne ich sie? Im Editor werden synchronisierte Vorlagen meist mit einem lila Symbol (statt des üblichen schwarzen/weißen Block-Icons) markiert. Das ist ein Warnsignal: „Vorsicht, was du hier änderst, ändert sich überall!“

Den “Globalen Effekt” nutzen (und stoppen)

Es gibt zwei Wege, mit diesen Vorlagen zu arbeiten:

A) Die globale Änderung (Standard)

Du fügst die Vorlage in Seite A ein und merkst später: „Ich möchte die Hintergrundfarbe von Blau auf Rot ändern.“

Du änderst die Farbe direkt in Seite A.
Ergebnis: Auf Seite B, C und D, wo die Vorlage ebenfalls eingebaut ist, wird der Hintergrund automatisch auch rot.

B) Von der Synchronisierung lösen (Die Ausnahme)

Manchmal möchtest du das Grundgerüst einer Vorlage nutzen, aber den Text für eine spezifische Seite anpassen, ohne die anderen Seiten zu beeinflussen.

Klicke auf die eingefügte Vorlage.
Wähle in der Werkzeugleiste die drei Punkte (⋮).
Klicke auf „In normale Blöcke umwandeln“ (oder „Detach“).
Ergebnis: Die Verbindung zur „Mutter-Vorlage“ wird gekappt. Du kannst jetzt alles ändern, ohne dass es Auswirkungen auf den Rest der Website hat.

Ein Profi-Tipp: “Inhaltsüberschreibungen” (Content Overrides)

Seit WordPress 6.5 gibt es ein geniales Feature: Du kannst eine Vorlage synchronisieren (das Design bleibt überall gleich), aber bestimmte Felder (wie einen Namen oder ein Bild) für jede Seite individuell freigeben.

Dafür musst du im Vorlagen-Editor die einzelnen Blöcke anklicken und in den Einstellungen unter „Fortgeschritten“ die „Überschreibungen zulassen“ aktivieren.

Wie du diese „Überschreibungen“ einrichtest, damit das Design starr bleibt, aber der Text variabel?

Das ist die “Königsdisziplin” der WordPress-Vorlagen. Man nennt sie “Content Overrides”.

Stell dir vor, du hast ein Team-Mitglied-Layout (Bild, Name, Position). Das Design (Schriftart, Abstände, Rahmen) soll auf der ganzen Website identisch bleiben. Aber auf Seite A soll “Max” stehen und auf Seite B “Erika”.

Bisher musstest du die Synchronisierung aufheben, aber dann hat sich das Design nicht mehr mit aktualisiert. Mit Overrides löst du dieses Problem.

So richtest du Inhaltsüberschreibungen (Overrides) ein

Vorlage bearbeiten: Gehe zu Design > Editor > Vorlagen und klicke auf die Vorlage, die du bearbeiten möchtest (sie muss synchronisiert sein).
Block auswählen: Klicke innerhalb der Vorlage auf einen Block, dessen Inhalt variabel sein soll (z. B. einen Überschrift-Block oder einen Bild-Block).
Einstellungen öffnen: Öffne die rechte Seitenleiste (Einstellungen) und scrolle ganz nach unten zum Bereich “Erweitert”.
Überschreibungen aktivieren: Klicke auf den Button “Überschreibungen zulassen”.
Name vergeben: Gib dem Feld einen logischen Namen (z. B. “Name des Mitarbeiters”). Dies hilft dir später im Editor zu wissen, was du gerade ausfüllst.
Speichern: Klicke oben rechts auf “Speichern”.

Wie du die Vorlage dann im Alltag nutzt

Wenn du diese Vorlage nun auf einer Seite einfügst, passiert etwas Magisches:

Das Design ist gesperrt: Du kannst die Schriftgröße oder die Farbe in der Vorlage auf dieser speziellen Seite nicht versehentlich ändern. Das sorgt für ein sauberes Markendesign.
Der Inhalt ist frei: Du kannst einfach in den Text klicken und den Namen ändern. In der rechten Seitenleiste siehst du nun einen Bereich “Inhaltsüberschreibungen”, wo du auch Bilder direkt austauschen kannst.

Warum ist das so genial?

Wenn du dich in drei Monaten entscheidest, dass alle Team-Bilder plötzlich runde Ecken haben sollen:

Du gehst in die zentrale Vorlage.
Du änderst die Ecken auf “rund”.
Zack: Überall auf deiner Website sind die Team-Bilder nun rund, aber die individuellen Namen (“Max”, “Erika”) bleiben exakt so stehen, wie du sie eingetippt hast.

Wichtig: Aktuell funktionieren Overrides nur für bestimmte Blöcke wie Überschriften, Absätze, Bilder und Buttons.