Template Parts in der theme.json
ermöglichen es, wiederverwendbare Layout-Bausteine wie Header, Footer, Sidebars oder beliebige andere Bereiche zu definieren. Diese modularen Elemente können im gesamten Theme eingesetzt und im Site Editor einfach angepasst werden, um die Flexibilität und Konsistenz des Layouts zu erhöhen.
Die theme.json
-Datei ermöglicht es, ein WordPress-Theme umfassend und strukturiert anzupassen. Dabei werden nicht nur Stile festgelegt, sondern auch bestimmt, welche Optionen im Editor zur Verfügung stehen.
Die Grundstruktur der theme.json-Datei besteht aus mehreren Hauptbereichen:
{
// Gibt die verwendete API-Version an. Hier Version 2.
"version": 2,
// Definiert, welche Optionen im Editor ausgewählt werden können.
"settings": {},
// Setzt die CSS-Stile für die Webseite.
"styles": {},
// Legt benutzerdefinierte Vorlagen für spezifische Inhalte fest.
"customTemplates": [],
// Definiert Template-Teile, wie z. B. Header oder Footer, für wiederverwendbare Layout-Bereiche.
"templateParts": []
}
Die Struktur der theme.json: Optionen und Stile im Überblick
1. Settings
In diesem Abschnitt werden die Optionen definiert, die im Editor zur Verfügung stehen. Dazu gehören Farbpaletten, Typografie, Layouts und Abstände, sowohl global als auch block-spezifisch.
2. Styles
Hier werden die CSS-Stile festgelegt, die das Aussehen der Webseite bestimmen. Die Stile können sowohl global als auch block-spezifisch definiert werden
3. Custom Templates
Ermöglicht das Hinzufügen von benutzerdefinierten Vorlagen für spezielle Inhalte und Seitentypen, um das Design flexibel anpassen zu können
4. Template Parts
Definiert wiederverwendbare Layout-Bereiche wie Header oder Footer, die in verschiedenen Templates genutzt werden können.
templateParts
"templateParts": [
{
"name": "header",
"title": "Standard Header",
"description": "Ein Standard-Header für das Theme",
"area": "header"
},
{
"name": "footer",
"title": "Standard Footer",
"description": "Ein einfacher Footer mit Links",
"area": "footer"
},
{
"name": "sidebar",
"title": "Rechte Seitenleiste",
"description": "Eine Seitenleiste auf der rechten Seite des Layouts",
"area": "sidebar"
}
]
name
: Der eindeutige Name des Template Parts.title
: Der benutzerfreundliche Name, der im WordPress-Editor angezeigt wird.description
: Eine Beschreibung, die im Editor angezeigt wird und den Zweck des Template Parts beschreibt.area
: Hier wird der Bereich definiert, in dem das Template Part verwendet werden soll. Gängige Bereiche sindheader
,footer
, undsidebar
.