Ein Shopify JSON Template bildet die Grundlage für den strukturellen Aufbau moderner Shopify-Seiten und ermöglicht eine flexible Steuerung von Inhalten und Layouts. Mit der Einführung von Shopify Online Store 2.0 wurde dieses System eingeführt, um Seiten modular aufzubauen und einfacher verwalten zu können.
Statt statischer Templates können Inhalte heute über strukturierte Templates und Sections organisiert werden. Dadurch lassen sich individuelle Layouts für Produkte, Landingpages oder Inhaltsseiten umsetzen, ohne die Funktionslogik verändern zu müssen. Das sorgt für mehr Flexibilität und eine bessere Skalierbarkeit des gesamten Shops.
In diesem Beitrag erfahren Sie, was ein Shopify JSON Template ist, wie es funktioniert, wie Sie eigene Templates erstellen und worauf Sie bei der Umsetzung achten sollten.
Kurzzusammenfassung
- JSON-Templates bilden die strukturelle Grundlage moderner Shopify-Shops und legen fest, welche Sections auf einer Seite angezeigt werden, während Design und Funktion separat in Liquid Sections umgesetzt werden.
- Sie werden für Produktseiten, Kategorien, Inhaltsseiten, die Startseite und Blogartikel verwendet und ermöglichen individuelle Layouts je nach Anwendungsfall.
- Die Erstellung erfolgt direkt im Theme im Templates-Ordner, wo neue JSON-Templates angelegt, mit Sections verbunden und anschließend einzelnen Produkten oder Seiten zugewiesen werden können.
- Durch eine saubere Struktur und klare Best Practices lassen sich flexible und skalierbare Layouts erstellen, die einfach erweitert und langfristig verwaltet werden können.
Gründer & Ihr Ansprechpartner
Unsere Full-Service-Agentur kann Ihnen bei Fragen und der Umsetzung zur Seite stehen. Zögern Sie nicht, uns zu kontaktieren. Wir freuen uns darauf, von Ihnen zu hören.
Jetzt einfach Kontakt aufnehmenWas ist ein JSON-Template in Shopify?
Mit der Einführung von Shopify Online Store 2.0 wurde das System zur Steuerung von Seitenlayouts grundlegend modernisiert. JSON-Templates bilden dabei die Grundlage für den strukturellen Aufbau von Seiten und ermöglichen eine deutlich flexiblere Verwaltung von Inhalten.
Definition und Funktion
Ein JSON-Template in Shopify ist eine Strukturdatei, die festlegt, welche Sections auf einer Seite angezeigt werden. Es definiert den grundlegenden Aufbau und organisiert die einzelnen Inhaltsbereiche.
Dabei übernimmt das JSON-Template ausschließlich die Struktur. Design und Funktionalität werden separat in den sogenannten Liquid Sections umgesetzt. Diese klare Trennung sorgt dafür, dass Layout und Funktion unabhängig voneinander verwaltet und einfacher angepasst werden können.
Unterschied zwischen JSON-Templates und Liquid-Templates
Früher verwendete Shopify Templates mit der Dateiendung .liquid, die Struktur, Design und Logik in einer Datei kombinierten. Diese waren meist fest aufgebaut und weniger flexibel anpassbar.
Mit der Einführung von .json Templates wurde dieses System verbessert. JSON-Templates ermöglichen eine modularere Seitenstruktur und geben Shopbetreibern mehr Flexibilität bei der Verwaltung und Anpassung ihrer Inhalte, ohne direkt in die Funktionslogik eingreifen zu müssen.
Aufbau eines Shopify JSON-Templates
Ein Shopify JSON-Template definiert die Struktur einer Seite, indem es festlegt, welche Sections verwendet werden und in welcher Reihenfolge sie angezeigt werden. Es besteht aus einer klaren, standardisierten Struktur, die Shopify automatisch auslesen und im Theme Editor darstellen kann.
Ein einfaches Beispiel für ein JSON-Template sieht so aus:
Dieses Beispiel zeigt die grundlegenden Bestandteile eines JSON-Templates.
sections
Der Bereich sections enthält alle Sections, die auf der Seite verwendet werden. Jede Section erhält eine eindeutige Bezeichnung, wie zum Beispiel main. Diese Bezeichnung dient als interne Referenz innerhalb des Templates.
Innerhalb jeder Section wird definiert, welcher Section-Typ geladen werden soll. Diese Sections enthalten später die eigentlichen Inhalte und Funktionen.
type
Der Wert type gibt an, welche Section verwendet wird. Er verweist auf eine entsprechende .liquid Datei im Sections-Ordner des Themes, zum Beispiel:
/sections/main-product.liquid
Diese Datei enthält die Logik und Darstellung für diesen Inhaltsbereich.
settings
Der Bereich settings enthält optionale Einstellungen für die jeweilige Section. Hier können beispielsweise Anzeigeoptionen, Texte oder andere Konfigurationswerte übergeben werden. In vielen Fällen ist dieser Bereich zunächst leer und wird erst über den Theme Editor gefüllt.
order
Der Bereich order definiert die Reihenfolge, in der die Sections auf der Seite angezeigt werden. Jede Section, die im Bereich sections definiert wurde, muss hier aufgeführt werden. Shopify verwendet diese Reihenfolge, um die Inhalte korrekt darzustellen.
Zusammenfassung: Ein Shopify JSON-Template besteht aus wenigen, aber wichtigen Bestandteilen. Es definiert die verwendeten Sections, verweist auf deren Funktion und legt die Reihenfolge der Anzeige fest. Dadurch entsteht eine flexible Struktur, die es ermöglicht, Seiten individuell aufzubauen und jederzeit anzupassen.
Wo Shopify JSON-Templates verwendet werden
JSON-Templates werden in Shopify verwendet, um den Aufbau verschiedener Seitentypen im Shop zu definieren. Für jede zentrale Seitenart existiert ein eigenes Template, das festlegt, welche Inhalte und Sections dort angezeigt werden.
Diese Templates befinden sich im Ordner /templates eines Shopify Themes und sind jeweils einem bestimmten Seitentyp zugeordnet.
Die wichtigsten JSON-Templates sind:
Produktseiten (product.json)
Dieses Template steuert den Aufbau von Produktseiten. Es definiert, wie Produktinformationen wie Bilder, Preis, Beschreibung oder Zusatzinhalte strukturiert dargestellt werden.
Kategorieseiten (collection.json)
Das Collection-Template wird für Kategorie- und Übersichtsseiten verwendet. Es legt fest, wie Produktlisten, Filter oder zusätzliche Inhalte innerhalb einer Kategorie angezeigt werden.
Inhaltsseiten (page.json)
Dieses Template wird für klassische Inhaltsseiten genutzt, zum Beispiel „Über uns“, „Kontakt“ oder individuelle Landingpages. Es ermöglicht eine flexible Struktur für Texte, Bilder und andere Inhalte.
Startseite (index.json)
Die Startseite verwendet ein eigenes JSON-Template, das den grundlegenden Aufbau der Homepage definiert. Hier werden typischerweise verschiedene Inhaltsbereiche kombiniert, um Besuchern einen Überblick über den Shop zu geben.
Blogartikel (article.json)
Dieses Template steuert die Darstellung einzelner Blogbeiträge. Es definiert, wie Inhalte, Bilder und weitere Elemente innerhalb eines Artikels angezeigt werden.
Individuelle Templates
Zusätzlich können eigene JSON-Templates erstellt werden, um spezielle Layouts für bestimmte Produkte, Seiten oder Kategorien zu verwenden. Dadurch lassen sich beispielsweise individuelle Landingpages oder spezielle Produktlayouts umsetzen.
JSON-Templates bilden damit die strukturelle Grundlage für nahezu alle Seitentypen in Shopify und ermöglichen eine flexible und einheitliche Verwaltung des gesamten Shops.
Gründer & Ihr Ansprechpartner
Unsere Full-Service-Agentur kann Ihnen bei Fragen und der Umsetzung zur Seite stehen. Zögern Sie nicht, uns zu kontaktieren. Wir freuen uns darauf, von Ihnen zu hören.
Jetzt einfach Kontakt aufnehmenShopify JSON-Template erstellen – Schritt-für-Schritt Anleitung
Schritt 1: Theme-Code öffnen
Gehe in Shopify auf Online-Shop → Themes und klicke beim aktiven Theme auf … → Code bearbeiten. Dort findest Du alle Dateien, die Dein Theme steuern.
Schritt 2: Templates-Ordner finden
Links im Dateibaum findest Du den Ordner Templates. In modernen Themes liegen die Dateien dort als .json vor (zum Beispiel product.json, page.json oder collection.json).
Schritt 3: Neues JSON-Template anlegen
Lege ein neues Template an, indem Du im Templates-Ordner auf „Neues Template hinzufügen“ klickst. Wähle den passenden Seitentyp (z. B. Produkt, Seite, Collection) und gib dem Template einen Namen, zum Beispiel:
- product.custom
- page.landing
- collection.sale
Shopify erstellt daraus eine Datei wie product.custom.json.
Schritt 4: Template mit Sections füllen
Jetzt definierst Du, welche Sections auf dieser Seite erscheinen sollen. Das passiert über die Bereiche sections und order.
Beispiel für ein eigenes Produkt-Template mit zusätzlichem Bereich:
Wichtig: Die type-Angaben müssen zu Sections passen, die im Theme wirklich existieren (im Ordner /sections).
Schritt 5: Template einer Seite zuweisen
Damit das Template verwendet wird, musst Du es im Shopify-Admin zuweisen:
- Bei Produkten: Produkt öffnen → Theme-Template auswählen
- Bei Seiten: Seite öffnen → Theme-Template auswählen
- Bei Collections: Collection öffnen → Theme-Template auswählen
Anschließend speichern.
Schritt 6: Im Theme Editor testen und anpassen
Öffne den Theme Editor (Anpassen) und wechsle auf die Seite, die das neue Template nutzt. Dort kannst Du die Sections wie gewohnt bearbeiten, Inhalte pflegen und bei vielen Themes auch zusätzliche Sections hinzufügen oder Reihenfolgen ändern.
Damit hast Du ein eigenes JSON-Template erstellt, zugewiesen und direkt so aufgebaut, dass es sauber im Shopify-Editor weiter gepflegt werden kann.
Verbindung zwischen JSON-Templates und Sections
JSON-Templates und Sections arbeiten in Shopify direkt zusammen und erfüllen unterschiedliche Aufgaben. Das JSON-Template definiert die Struktur einer Seite, während die Sections die eigentlichen Inhalte, das Design und die Funktionalität enthalten.
Das JSON-Template legt fest, welche Sections auf einer Seite geladen werden sollen. Jede Section wird dabei über ihren Namen referenziert. Shopify lädt anschließend automatisch die passende .liquid Datei aus dem Sections-Ordner des Themes.
Dieser Ordner befindet sich hier:
/sections
Dort liegen zum Beispiel Dateien wie:
main-product.liquid
image-banner.liquid
rich-text.liquid
featured-collection.liquid
Wenn ein JSON-Template beispielsweise den Typ main-product verwendet, greift Shopify auf die Datei main-product.liquid zu und zeigt deren Inhalt auf der Seite an.
Das JSON-Template selbst enthält keine Darstellung oder Logik. Es fungiert ausschließlich als Verknüpfung und Strukturdefinition. Die Section-Dateien übernehmen hingegen die Anzeige, enthalten den HTML-Aufbau, Liquid-Code und die Einstellungen, die im Theme Editor angepasst werden können.
Durch diese Trennung entsteht ein modulares System. Das JSON-Template bestimmt, welche Bausteine verwendet werden, und die Sections definieren, wie diese Bausteine aussehen und funktionieren. Dadurch lassen sich Seiten flexibel aufbauen und einfacher verwalten.
Vorteile von Shopify JSON-Templates
Shopify JSON-Templates bieten eine moderne und flexible Möglichkeit, Seitenlayouts zu steuern. Durch die klare Trennung von Struktur und Funktion lassen sich Shops einfacher verwalten, erweitern und individuell anpassen.
Die wichtigsten Vorteile im Überblick:
- Flexible Seitenstruktur: Inhalte können modular aufgebaut und jederzeit angepasst werden, ohne die gesamte Seite neu erstellen zu müssen.
- Einfache Anpassung über den Theme Editor: Viele Änderungen lassen sich direkt im Shopify Theme Editor vornehmen, ohne den Code bearbeiten zu müssen.
- Klare Trennung zwischen Struktur und Funktion: Das JSON-Template definiert die Struktur, während Sections Design und Logik übernehmen. Das sorgt für eine bessere Übersicht und einfachere Wartung.
- Individuelle Templates für verschiedene Anwendungsfälle: Es können eigene Templates für bestimmte Produkte, Landingpages oder Kategorien erstellt werden, zum Beispiel für SEO-Seiten oder spezielle Produktlayouts.
- Bessere Skalierbarkeit für größere Shops: Neue Seitenlayouts lassen sich schnell erstellen und wiederverwenden, ohne bestehende Templates zu verändern.
- Kompatibilität mit Shopify Online Store 2.0: JSON-Templates sind der aktuelle Standard und vollständig auf moderne Shopify-Funktionen ausgelegt.
- Weniger Risiko bei Anpassungen: Änderungen am Layout können vorgenommen werden, ohne die eigentliche Funktion oder andere Seiten unbeabsichtigt zu beeinflussen.
- Saubere und strukturierte Organisation des Themes: Durch die klare Aufteilung in Templates und Sections bleibt der Theme-Code übersichtlich und leichter verständlich.
JSON-Templates bilden damit die Grundlage für flexible, moderne und zukunftssichere Shopify-Shops.
Gründer & Ihr Ansprechpartner
Unsere Full-Service-Agentur kann Ihnen bei Fragen und der Umsetzung zur Seite stehen. Zögern Sie nicht, uns zu kontaktieren. Wir freuen uns darauf, von Ihnen zu hören.
Jetzt einfach Kontakt aufnehmenHäufige Fehler beim Schreiben von Shopify JSON-Templates
Beim Erstellen oder Bearbeiten von Shopify JSON-Templates können bereits kleine Fehler dazu führen, dass das Template nicht funktioniert oder Inhalte nicht angezeigt werden. Da JSON eine strikt strukturierte Syntax verwendet, ist sauberes und genaues Arbeiten besonders wichtig.
Die häufigsten Fehler sind:
- Syntaxfehler im JSON-Code: Fehlende Kommas, falsche Anführungszeichen oder vergessene Klammern führen dazu, dass Shopify das Template nicht lesen kann. Schon ein kleiner Syntaxfehler kann dazu führen, dass das Template nicht geladen wird.
- Verwendung einer nicht existierenden Section: Wenn im Template ein type angegeben wird, für den es keine passende .liquid Datei im /sections Ordner gibt, kann Shopify diese Section nicht anzeigen.
- Section in „sections“, aber nicht in „order“ aufgeführt: Jede Section muss zusätzlich im Bereich order aufgeführt werden. Andernfalls existiert sie zwar im Template, wird aber nicht angezeigt.
- Falsche Schreibweise des Section-Namens: Die Angabe im type muss exakt mit dem Dateinamen der Section übereinstimmen. Schon kleine Abweichungen oder Tippfehler verhindern das Laden der Section.
- Template wird keiner Seite zugewiesen: Ein JSON-Template funktioniert erst, wenn es einem Produkt, einer Seite oder einer Collection zugewiesen wurde. Andernfalls bleibt es ungenutzt.
- Bearbeitung eines Templates, das nicht aktiv verwendet wird: Änderungen haben nur Auswirkungen, wenn das bearbeitete Template tatsächlich der entsprechenden Seite zugeordnet ist.
- Ungültige JSON-Struktur durch manuelle Änderungen: Besonders beim Kopieren und Einfügen von Code können leicht Fehler entstehen, die die gesamte Datei unbrauchbar machen.
Wenn ein JSON-Template nicht funktioniert, liegt die Ursache in den meisten Fällen an einem dieser Punkte. Eine sorgfältige Prüfung der Syntax und der verwendeten Sections hilft, Probleme schnell zu identifizieren und zu beheben.
Erweiterte Nutzung: Dynamische Templates und individuelle Layouts
Ein großer Vorteil von Shopify JSON-Templates ist die Möglichkeit, mehrere Templates für denselben Seitentyp zu erstellen und so unterschiedliche Layouts gezielt einzusetzen. Dadurch lassen sich Seiten individuell an verschiedene Anforderungen anpassen, ohne das Standard-Template verändern zu müssen.
So können beispielsweise eigene Templates für bestimmte Produkttypen, Landingpages oder Marketingkampagnen erstellt werden. Jedes dieser Templates definiert eine eigene Struktur und kann unabhängig verwendet werden.
Typische Beispiele sind:
- eigenes Template für SEO-optimierte Produktseiten
- separates Template für Landingpages aus Werbekampagnen
- spezielles Layout für Bundles oder Sets
- individuelles Template für Highlight- oder Bestseller-Produkte
Diese Templates werden als eigene Dateien im Templates-Ordner angelegt, zum Beispiel:
product.seo.json
product.landing.json
product.bundle.json
page.landing.json
Anschließend kann das gewünschte Template direkt im Shopify-Admin einem Produkt oder einer Seite zugewiesen werden. Dadurch verwendet nur diese Seite das spezielle Layout, während alle anderen Seiten unverändert bleiben.
Diese Vorgehensweise ermöglicht eine sehr gezielte Steuerung des Layouts. Statt ein Template für alle Seiten zu verwenden, können verschiedene Templates parallel existieren und je nach Anwendungsfall eingesetzt werden.
Das ist besonders hilfreich für:
- Conversion-optimierte Landingpages
- unterschiedliche Layouts je nach Produkttyp
- individuelle Marketingseiten
- strukturierte und skalierbare Shop-Architekturen
Durch diese Flexibilität lassen sich Shopify-Shops deutlich individueller gestalten und besser an unterschiedliche Anforderungen anpassen.
Best Practices für Shopify JSON-Templates
Damit Deine JSON-Templates übersichtlich bleiben und sauber funktionieren, helfen ein paar einfache Grundregeln:
- Klare Namen verwenden: Zum Beispiel product.seo.json, product.landing.json oder page.custom.json.
- Templates schlank halten: Nur Sections einbauen, die Du wirklich brauchst. Das macht Wartung und Fehlersuche leichter.
- Eigene Templates für spezielle Fälle nutzen: Lieber ein zusätzliches Template für Bundles, Landingpages oder SEO-Seiten erstellen, statt das Standard-Template zu verbiegen.
- Vorlagen kopieren statt neu bauen: Ein bestehendes Template duplizieren und anpassen reduziert Fehler.
- Nach Änderungen immer kurz testen: Im Theme Editor prüfen, ob alle Sections geladen werden und die Seite wie gewünscht aussieht.
- Syntax penibel prüfen: JSON verzeiht keine kleinen Fehler (Kommas, Klammern, Anführungszeichen).
Gründer & Ihr Ansprechpartner
Unsere Full-Service-Agentur kann Ihnen bei Fragen und der Umsetzung zur Seite stehen. Zögern Sie nicht, uns zu kontaktieren. Wir freuen uns darauf, von Ihnen zu hören.
Jetzt einfach Kontakt aufnehmenJSON-Template mit der Unicorn Factory umsetzen
Die Erstellung und Strukturierung von Shopify JSON-Templates erfordert ein sauberes Verständnis der Theme-Architektur und der Zusammenhänge zwischen Templates, Sections und Seiten. Fehler oder eine unklare Struktur können schnell dazu führen, dass Layouts nicht wie gewünscht funktionieren oder später nur schwer erweiterbar sind.
Die Unicorn Factory unterstützt Sie dabei, individuelle JSON-Templates professionell umzusetzen und optimal auf Ihren Shop abzustimmen. Dabei analysieren wir zunächst die bestehende Theme-Struktur und definieren, welche Templates sinnvoll sind, zum Beispiel für spezielle Produktlayouts, Landingpages oder SEO-optimierte Seiten.
Anschließend erstellen wir strukturierte, saubere Templates, die vollständig kompatibel mit Shopify Online Store 2.0 sind. Dabei achten wir besonders darauf, dass die Templates flexibel erweiterbar bleiben und problemlos im Theme Editor verwendet werden können.
Typische Anwendungsfälle sind:
- individuelle Produktlayouts für bestimmte Produkttypen
- spezielle Landingpages für Marketingkampagnen
- SEO-optimierte Seitenstrukturen
- Conversion-optimierte Layouts für wichtige Produkte
Zusätzlich sorgen wir dafür, dass Ihr Theme übersichtlich strukturiert bleibt und zukünftige Erweiterungen problemlos möglich sind. So entsteht eine saubere technische Grundlage, auf der Ihr Shopify-Shop langfristig wachsen und flexibel angepasst werden kann.
Das sind die nächsten Schritte
Wenn Sie eigene Shopify JSON-Templates erstellen oder bestehende Templates anpassen möchten, empfiehlt es sich, strukturiert vorzugehen und zunächst die aktuelle Theme-Struktur zu prüfen.
So stellen Sie sicher, dass neue Templates sauber integriert werden und keine bestehenden Funktionen beeinträchtigt werden.
- Bestehende Templates analysieren: Prüfen Sie im Templates-Ordner, welche JSON-Templates bereits vorhanden sind und wie diese aufgebaut sind.
- Anwendungsfall definieren: Überlegen Sie, für welche Seiten ein eigenes Template sinnvoll ist, zum Beispiel für spezielle Produkte, Landingpages oder individuelle Layouts.
- Neues Template erstellen und zuweisen: Legen Sie ein neues JSON-Template an und weisen Sie es dem gewünschten Produkt, der Seite oder der Collection zu.
- Optional: Umsetzung mit der Unicorn Factory
Wenn Sie ein sauberes, skalierbares Setup möchten (z. B. mehrere Templates für verschiedene Produkttypen oder Landingpages), unterstützen wir Sie gerne bei Struktur, Umsetzung und Tests, damit alles sauber im Theme Editor funktioniert.
- Optional: Umsetzung mit der Unicorn Factory
- Im Theme Editor prüfen und anpassen: Kontrollieren Sie, ob alle Inhalte korrekt angezeigt werden, und ergänzen Sie bei Bedarf weitere Sections.
Gründer & Ihr Ansprechpartner
Unsere Full-Service-Agentur kann Ihnen bei Fragen und der Umsetzung zur Seite stehen. Zögern Sie nicht, uns zu kontaktieren. Wir freuen uns darauf, von Ihnen zu hören.
Jetzt einfach Kontakt aufnehmenHäufig gestellte Fragen zum JSON-Template
Ein JSON-Template ist eine Strukturdatei, die festlegt, welche Sections auf einer Seite angezeigt werden. Es definiert den grundlegenden Aufbau der Seite, während Design und Funktionalität in den jeweiligen Section-Dateien umgesetzt werden.
JSON-Templates werden verwendet, um den Aufbau von Produktseiten, Inhaltsseiten, Kategorien, der Startseite und Blogartikeln zu steuern. Sie ermöglichen es, unterschiedliche Layouts für verschiedene Seiten und Anwendungsfälle zu erstellen.
Liquid-Templates kombinierten früher Struktur, Design und Logik in einer Datei. JSON-Templates trennen diese Bereiche. Das JSON-Template definiert die Struktur, während die Sections die Darstellung und Funktion übernehmen. Dadurch ist das System flexibler und einfacher zu verwalten.
Ja, Sie können beliebig viele JSON-Templates erstellen. Diese können zum Beispiel für spezielle Produktlayouts, Landingpages oder unterschiedliche Seitentypen verwendet und gezielt einzelnen Produkten oder Seiten zugewiesen werden.
JSON-Templates befinden sich im Shopify Theme im Ordner „Templates“. Dort finden Sie Dateien wie „product.json“, „page.json“ oder „collection.json“, die den Aufbau der jeweiligen Seiten definieren.
Grundlegende Kenntnisse sind hilfreich, insbesondere beim Bearbeiten oder Erstellen neuer Templates. Viele Anpassungen können jedoch auch über den Shopify Theme Editor vorgenommen werden, ohne direkt den Code bearbeiten zu müssen.
Ja, die Unicorn Factory unterstützt Sie bei der Erstellung, Strukturierung und Optimierung Ihrer Shopify JSON-Templates. Dadurch erhalten Sie saubere, flexible und skalierbare Templates, die optimal auf Ihren Shop und Ihre Anforderungen abgestimmt sind.
