27. Februar 2023

Eigene Vorlagen für den Gutenberg-Editor erstellen

Der Gutenberg-Editor ist heute die wohl beste Art Website-Content zu bearbeiten. Noch besser ist er, seitdem er die Möglichkeit bietet, Vorlagen zu verwenden. Eine Vorlage, oder auch „Block-Pattern“, ist eine Zusammenstellung an Blocks, wie z.B. Headline, Bild, Text und beliebigen anderen Blöcken.

So eine Vorlage lässt sich ganz einfach wie folgt erstellen.

1. Erstelle das Layout im Editor.

2. Wechsle über das 3-Punkte-Icon oben rechts in den Code-Editor.

3. Erstelle im Theme-Ordner einen Ordner „patterns“ und eine Datei namens „beispiel.php“.

4. Erstelle in der Datei einen Header nach folgendem Schema, gefolgt vom Code aus dem Editor.

<?php
/**
 * Title: Beispiel
 * Slug: name-des-themes/name-der-vorlage
 * Categories: Allgemein
 */
?>

<!-- wp:heading -->
<h2>Headline</h2>
<!-- /wp:heading -->
...Code-Sprache: HTML, XML (xml)

Nachdem die Datei gespeichert wurde ist die Vorlage über den „+“-Button oben links verfügbar.

Tipp: Mit folgendem Code in der functions.php lassen sich die Standard-Wordpress-Vorlagen deaktivieren.

remove_theme_support( 'core-block-patterns' );Code-Sprache: JavaScript (javascript)