Snippets

Snippets sind wiederverwendbare HTML-/Template-Bausteine. Sie können im Editor als Kopie eingefügt oder per {% include "name" %} referenziert werden (dann wirken Änderungen sofort überall).

Snippet-Objekt

{
  "id": 1,
  "name": "header",
  "description": "Hauptnavigation",
  "content": "<header>{% for p in nav() %}<a href=\"{{ p.path }}\">{{ p.title }}</a>{% endfor %}</header>",
  "created_at": 1791191665,
  "updated_at": 1791191665,
  "assets": [{ "asset_id": 3, "name": "header", "kind": "css" }],
  "schema": null,
  "page_layout": null
}

schema: Baustein-Schema für den Seitenbaukasten (null = kein Baustein). PUT ohne schema lässt es unverändert; Hinweise zu Slots kommen als warnings in der Antwort.

page_layout: { "label": "Inhaltsseite", "description": "…", "default": true } bietet das Snippet beim Anlegen neuer Seiten als Seitenlayout an (null = nicht). label leer = Snippet-Name; Bezeichnung höchstens 200, Beschreibung 2000 Zeichen (400 snippet.layoutTooLong). PUT ohne page_layout lässt es unverändert, "page_layout": null entfernt es.

assets: CSS/JS-Dateien des Snippets in Ladereihenfolge (beim Schreiben genügt asset_id; nicht vorhandene IDs werden übergangen). Sie werden nur auf Seiten geladen, die das Snippet beim Rendern ausführen (include, Komponente, extends; Makro-Snippets beim import) – im Seiteninhalt oder Head-Feld, nicht im SEO-Titel/der Beschreibung. CSS kommt in den <head>, JS vor </body>, jeweils hinter die Dateien der Seite und ohne Doppelte. JS-Dateien mit ES-Modul-Syntax (import/export auf oberster Ebene, import.meta) werden – wie bei Seiten – als <script type="module"> eingebunden.

name ist eindeutig und darf Buchstaben, Ziffern, ., _, - und / enthalten (z. B. cards/teaser). Er muss mit Buchstabe oder Ziffer beginnen.

GET /snippets 🔑 · GET /snippets/{id} 🔑

Liste (inkl. content) bzw. einzelnes Snippet.

POST /snippets ✏️

{ "name": "footer", "description": "", "content": "<footer>© {{ page.title }}</footer>", "assets": [{ "asset_id": 3 }] }

201, 409 wenn der Name vergeben ist. Optional folder (Ordner in der Admin-Liste); ohne Angabe ergibt er sich aus einem Präfix im Namen (teile/footer → teile).

PUT /snippets/{id} ✏️ · DELETE /snippets/{id} ✏️

Merge-Update bzw. Löschen; ohne assets im Body bleibt die Zuordnung unverändert, "assets": [] entfernt alle. Achtung: Seiten, die ein gelöschtes Snippet per include einbinden, erzeugen danach einen Render-Fehler.

GET /page-layouts 🔑

Die Seitenlayouts – Snippets mit page_layout, sortiert nach Bezeichnung. Der Admin-Dialog Neue Seite und Integrationen (IllusionPublish) bieten sie zur Auswahl an:

[
  { "id": 12, "name": "layouts/inhaltsseite", "label": "Inhaltsseite", "description": "Kopf, Titel, Blöcke, Fuß",
    "default": true, "has_blocks": true, "html": "{% extends \"layouts/inhaltsseite\" %}\n" },
  { "id": 14, "name": "layouts/kontakt", "label": "Kontakt", "description": "Anschrift und Formular",
    "default": false, "has_blocks": false, "html": "{% extends \"layouts/kontakt\" %}\n" }
]

• has_blocks: Gibt das Layout einen Blockbereich für die Seite aus ({% blocks page.blocks %}) – auch über extends, include und Komponenten? Ausgewertet wird der Template-Code (Kommentare und verbatim zählen nicht, überschriebene blocks beim extends samt block.super schon; Snippet-Namen aus Variablen lassen sich nicht verfolgen). false heißt statischer Inhalt – ein gewollter Fall für Seiten mit festem Inhalt; IllusionCMS fügt nie selbst Blöcke ein.
• default: im Dialog vorausgewählt (gibt es mehrere, gilt das erste).
• html: das HTML, das eine neue Seite mit diesem Layout bekommt (POST /pages mit layout_id).

Die Liste steht auch in GET /schema (page_layouts); ändert sie sich – auch has_blocks durch Änderungen an eingebundenen Snippets –, meldet der Webhook schema.changed mit kind: page_layout.

---