Kostenloses Tool
Shopify Section Schema Generator
Füg die Einstellungen und Blöcke hinzu, die deine Section braucht, und erhalte einen gültigen {% schema %}-Block zum Einfügen in dein Theme – oder eine .liquid-Startdatei, deren Markup bereits jede Einstellung ausliest. Alles läuft in deinem Browser; nichts, was du eingibst, wird irgendwohin gesendet.
Section
Einstellungen
Blöcke
{% schema %}
{
"name": "Feature highlights",
"tag": "section",
"class": "feature-highlights",
"max_blocks": 6,
"settings": [
{ "type": "header", "content": "Content" },
{ "type": "text", "id": "heading", "label": "Heading", "default": "Why customers switch" },
{ "type": "richtext", "id": "intro", "label": "Intro", "default": "<p>Three reasons, in plain words.</p>" },
{ "type": "header", "content": "Style" },
{ "type": "color", "id": "accent", "label": "Accent colour", "default": "#5d4787" },
{ "type": "range", "id": "columns", "label": "Columns on desktop", "min": 2, "max": 4, "step": 1, "default": 3 },
{ "type": "select", "id": "layout", "label": "Layout", "options": [{"value": "grid", "label": "Grid"},{"value": "carousel", "label": "Carousel"}], "default": "grid" },
{ "type": "checkbox", "id": "show_border", "label": "Show card borders", "default": true }
],
"blocks": [
{
"type": "feature",
"name": "Feature",
"settings": [
{ "type": "image_picker", "id": "icon", "label": "Icon" },
{ "type": "text", "id": "title", "label": "Title", "default": "Ships in 24 hours" },
{ "type": "textarea", "id": "text", "label": "Text", "default": "Order by 3pm and it leaves the same day." }
]
}
],
"presets": [
{ "name": "Feature highlights", "blocks": [{"type": "feature"}] }
]
}
{% endschema %}Was ein Section-Schema macht
Jede Shopify-Section endet mit einem {% schema %}-Tag, das ein JSON-Objekt enthält. Daraus weiß der Theme-Editor, was er anzeigen soll: den Namen der Section, die Einstellungen, die Händler ändern können, die Blöcke, die sie hinzufügen und umsortieren können, und das Preset, das die Section in die Liste unter „Abschnitt hinzufügen“ bringt.
Das Liquid über dem Schema liest diese Werte aus – section.settings.heading, block.settings.image –, das Schema ist also der Vertrag zwischen dem Code und der Person, die den Shop bearbeitet. Ist es fehlerhaft, weigert sich Shopify, die Datei zu speichern.
Einstellungstypen im Überblick
text- Eine einzelne Textzeile – Überschriften, Button-Beschriftungen.
textarea- Reiner Text über mehrere Zeilen.
richtext- Formatierter Text mit Fett, Kursiv und Links. Der Standardwert muss in <p> stehen.
inline_richtext- Formatierung ohne Absätze – für eine Überschrift mit einem fetten Wort.
image_picker- Ein Bild aus den Dateien des Shops. Kann keinen Standardwert haben.
url- Ein Link zu einem Produkt, einer Kollektion, einer Seite oder einer beliebigen Webadresse.
checkbox- Ein An/Aus-Schalter. Der Standardwert ist true oder false.
number- Eine Zahl, die in ein Feld eingegeben wird.
range- Ein Schieberegler mit Min, Max und Schritt – höchstens 101 Schritte.
select- Ein Dropdown mit Optionen, die du festlegst.
color- Ein Farbwähler.
font_picker- Eine Schrift aus der Bibliothek von Shopify. Ein Standardwert ist Pflicht.
product / collection- Ein Produkt oder eine Kollektion auswählen und die Daten in Liquid auslesen.
header / paragraph- Keine Einstellungen – Überschriften und Hinweise, die die Seitenleiste gliedern.
Warum Shopify ein Schema ablehnt
Die Meldungen, die der Theme-Editor zeigt, wenn sich eine Section nicht speichern lässt, und ihre Ursachen:
Invalid JSON in tag 'schema'
Ungültiges JSON: ein Komma am Ende, ein einfaches Anführungszeichen oder eine fehlende Klammer. Das Schema ist striktes JSON – und darf kein Liquid enthalten.
Setting IDs must be unique
Zwei Einstellungen teilen sich eine ID. Block-Einstellungen müssen nur innerhalb ihres Blocks eindeutig sein.
Invalid default value
Der Standardwert passt nicht zum Typ – etwa ein Range-Standardwert außerhalb von Min und Max oder ein Select-Standardwert, der keine der Optionen ist.
The section doesn't appear under Add section
Die Section erscheint nicht unter „Abschnitt hinzufügen“, weil sie keine Presets hat. Eine Section ohne Preset lässt sich nur per Code einbinden.
Häufige Fragen
Was ist {% schema %} in Shopify?
Das Tag am Ende einer Section-Datei, das ein JSON-Objekt mit der Beschreibung der Section enthält – Name, Einstellungen, Blöcke und Presets. Der Theme-Editor liest es aus, um die Seitenleiste zu bauen, mit der Händler die Section anpassen.
Wo füge ich das Schema ein?
Ganz unten in der .liquid-Datei der Section im sections-Ordner deines Themes, nach dem Markup. Eine Section kann nur ein {% schema %}-Tag haben.
Warum wird meine Section im Theme-Editor nicht angezeigt?
Fast immer, weil das Schema keine Presets hat. Füg ein Preset mit dem Namen der Section hinzu, dann erscheint sie unter „Abschnitt hinzufügen“. In einem Vintage-Theme lassen sich Sections nur zur Startseite hinzufügen.
Ist dieser Generator kostenlos?
Ja, und ohne Konto. Er läuft komplett in deinem Browser, und nichts, was du eingibst, verlässt dein Gerät.
Kann er auch den Rest der Section schreiben?
Die Startdatei liefert dir Markup, das jede Einstellung ausliest. Für eine fertige, gestylte Section – Layout, CSS, JavaScript und alles – beschreib sie Klorr, und Klorr schreibt die ganze Datei.
Lieber die ganze Section statt nur das Schema?
Beschreib eine Section und erhalte Shopify-Liquid-Code, ein vollständiges Schema und Theme-Editor-Einstellungen. Für jedes Online Store 2.0 Theme, ohne App.
Liquid-Code-Generator →