WordPress: Block-Vorlagen als .php-Datei

Symbolbild: PHP

Eine relativ neue Art Inhalte in WordPress zu gestalten ist die Nutzung von Vorlagen (“Patterns”). Mittlerweile gibt es ein recht umfangreiches Vorlagen-Verzeichnis auf wordpress.org. Das ist zum einen über den Gutenberg-Editor selbst erreichbar, zum anderen aber auch eben über die Website von wordpress.org. Hier kann man in Ruhe nach Vorlagen stöbern und sich diese dann zur eigenen Nutzung kopieren. Wie das geht, haben wir hier beschrieben: WordPress-Vorlagen-Verzeichnis(se) als Kopiervorlage

Wer nicht auf bereits bestehende Vorlagen zurückgreifen möchte, der kann sich natürlich auch eigene erstellen. Das geht zum einen als Funktion, aber es ist natürlich auch möglich ein entsprechendes Plugin zu nutzen.

Mit WordPress 6.0, oder jetzt schon mit dem Gutenberg-Plugin 12.9 oder höher, wird es noch eine weitere Möglichkeit geben, die ich euch hier beschreiben möchte.

php-Datei im patterns-Ordner

Zunächst einmal musst du im genutzten Child-Theme einen patterns-Unterordner erstellen. Das funktioniert sowohl mit “klassischen” Themes, wie auch mit Block-Themes. In diesen Ordner wiederum kommen dann die PHP-Dateien mit jeweils einer Vorlage.

Die php-Datei enthält dann im header einige Basis-Informationen zur Vorlage:

<?php
/**
 * Title: [[Titel, der im Gutenberg-Editor sichtbar ist]]
 * Slug: theme-slug/pattern-slug
 * Categories: [[Kategorie(n), in denen die Vorlage geliestet werden soll]] 
 * Description: [[Beschreibung der Vorlage]]
 * Keywords: [Stichworte, mit denen die Vorlage bei der Suche gefunden wird]]
 * Block Types: [[Enthaltene Blöcke]]
 */
?>

Die mit eckigen Klammern umfassten Inhalte müssen je nach Vorlage angepasst werden, konkret könnte das dann so aussehen:

<?php
/**
 * Title: Autoren
 * Slug: twentytwentytwo/autoren-vorlage
 * Categories: text, columns 
 * Description: Zwei Autoren und ihre aktuellsten Beiträge
 * Keywords: autor, beiträge
 * Block Types: core/image, core/heading, core/latest-posts
 */
?>

Nun muss darunter noch die eigentliche Vorlage eingefügt werden. Das funktioniert am besten, wenn ihr zunächst die Vorlage im Gutenberg-Editor erstellt und dann den Code mit Copy & Paste in die php-Daei einfügt. Am einfachsten funktioniert das Kopieren (wenn ihr keine anderen Inhalte habt) über Ansicht anpassen/Kompletten Inhalt kopieren. Es ist aber natürlich auch möglich, nur ausgewählte Blöcke zu kopieren und dann in euer Vorlagen-Dokument einzufügen.

Nun müsst ihr die Vorlagen-Dateien nur noch in den patterns-Ordner eures Child-Themes hochladen.

Die Vorlage ist im Backend verfügbar.

Image(s) licensed by Ingram Image/adpic.

Wir arbeiten seit 20 Jahren mit WordPress und bieten diverse Dienst­leistungen rund um das System an. Kontaktiere uns für weitere Informationen oder für ein Angebot.

Verwandte Beiträge:

9 Kommentare

  1. Zitat: “Die mit eckigen Klammern umfassten Inhalte müssen je nach Vorlage angepasst werden, konkret könnte das dann so aussehen:”
    – da ist leider nichts zu sehen.

  2. Man soll PHP Dateien in einem Unterordner des Themes kopieren?

    Hört sich für mich wie der Beginn einer wunderbaren Hacker-Freundschaft an.

    1. Ich sehe das Problem nicht.
      1. befinden sich bereits einige andere php-Dateien im themes-Ordner.
      2. verbindet Hacker und WordPress bereits eine langjährige Freundschaft.

  3. Sehe den Code auch nicht (bis auf php-tags). Bei Dieter hats geholfen zu kommentieren, mal schauen.

Kommentare sind geschlossen.