Wichtigste Erkenntnisse
checkout.liquidist nur für Shopify Plus (und Shopify POS Pro) verfügbar. Standard-Pläne haben keinen Zugriff darauf.- Du findest die Datei unter: Onlineshop → Themes → Aktionen → Code bearbeiten →
layout/checkout.liquid.- Shopify stellt checkout.liquid zugunsten von Checkout Extensibility ein — neue Anpassungen sollten den neuen Ansatz nutzen.
- Checkout Extensibility (Checkout UI Extensions + Shopify Functions) ist der offiziell langfristig unterstützte Weg für die gesamte Shopify Plus-Checkout-Anpassung.
Der Checkout ist die wichtigste Seite in deinem Shop. Ein benutzerdefiniertes Checkout-Layout, zusätzliche Trust-Signale oder gut platzierte Upsells können deine Conversion-Rate deutlich verbessern. Mit Shopify Plus hast du die Werkzeuge, um das umzusetzen — aber die Landschaft verändert sich.
Wer hat Zugriff auf checkout.liquid?
Nur Shopify Plus-Händler. Die Datei checkout.liquid erscheint nicht im Code-Editor für Basic-, Shopify- oder Advanced-Pläne. Standard-Pläne können den Checkout nur über Settings → Checkout (begrenzte visuelle Einstellungen) und das Feld “Additional scripts” auf der “Order status page” anpassen.
Hinweis für POS Pro: checkout.liquid ist auch in Shopify POS Pro zugänglich, aber dieser Guide konzentriert sich auf die Anpassung des Online-Checkouts.
Zugriff auf checkout.liquid
- Gehen Sie zu Online-Shop → Themes → Aktionen → Code bearbeiten
- Suchen Sie nach dem Ordner
layout/ - Suchen Sie nach
checkout.liquid— diese Datei ist nur in Plus-Plänen sichtbar
Falls Sie sie nicht sehen, nutzt Ihr Shop kein Shopify Plus.
Passend dazu: Checkout-Feldbezeichnungen in Shopify ändern.
Erstellen Sie immer eine Kopie Ihres Themes, bevor Sie checkout.liquid bearbeiten. Ein Fehler in der checkout.liquid kann Ihren gesamten Checkout-Flow stören und alle Käufe verhindern.
Was Sie mit checkout.liquid anpassen können
Trust-Inhalte hinzufügen
Im Checkout ist die Kauf-Unsicherheit am größten. Das Hinzufügen von Trust-Signalen in der checkout.liquid kann die Abbruchrate senken:
<!-- Zum Checkout-Header oder Sidebar-Bereich hinzufügen -->
<div class="checkout-trust-bar">
<span>🔒 Sicherer Checkout</span>
<span>Kostenlose Rücksendung für alle Bestellungen</span>
<span>Lieferung in 2-3 Werktagen</span>
</div>Shopifys Checkout-Liquid verfügt über spezifische Zonen, in die benutzerdefinierte Inhalte eingefügt werden können: content_for_header, content_for_main und andere. Prüfen Sie die Shopify checkout.liquid Dokumentation für die aktuelle Liste der unterstützten Variablen.
Benutzerdefinierter Checkout-Header und -Footer
Standardmäßig übernimmt Ihr Checkout eine vereinfachte Version des Headers Ihres Themes (nur Logo) und einen generischen Footer. In der checkout.liquid können Sie Branding-Elemente, benutzerdefinierte Navigationslinks und Footer-Inhalte hinzufügen, die zu Ihrer Marke passen.
Passend dazu: Trust Badges zum Shopify Checkout hinzufügen.
Benutzerdefiniertes CSS hinzufügen
<!-- Im <head>-Bereich der checkout.liquid -->
<style>
.checkout-trust-bar {
display: flex;
gap: 24px;
justify-content: center;
padding: 12px;
background: #f5f5f5;
font-size: 12px;
}
</style>Warnung: checkout.liquid wird eingestellt
Shopify hat angekündigt, dass checkout.liquid im August 2024 für die Thank-you- und Order-status-Seiten eingestellt wird, und die Einstellung für andere Checkout-Seiten folgen wird. Neue Checkout-Anpassungen sollten mit Checkout Extensibility erstellt werden, nicht mehr mit checkout.liquid.
Wenn Ihr Shop checkout.liquid noch für Funktionen nutzt, wird dies bis zum spezifischen Abschaltdatum von Shopify funktionieren – aber Sie sollten die Migration planen.
Checkout Extensibility — der neue Ansatz
Checkout Extensibility ist Shopifys aktuelle Plattform für Checkout-Anpassungen. Sie besteht aus:
Checkout UI Extensions — React-basierte Komponenten, die an bestimmten Stellen im Checkout gerendert werden. Diese sind das Äquivalent zu checkout.liquid HTML, werden aber über Shopify Admin → Settings → Checkout → Customize verwaltet.
Shopify Functions — Serverseitige Logik, die während des Checkout-Prozesses ausgeführt wird (Rabattlogik, Zahlungsanpassung, Lieferanpassung).
Was Checkout Extensibility leisten kann
- Hinzufügen von benutzerdefinierten UI-Blöcken im Checkout: Informationsbanner, individueller Text, Formularfelder
- Upsell-Angebote in der Checkout-Sidebar hinzufügen
- Eigene Rabattlogik implementieren
- Anzeige der Zahlungsmethoden anpassen
- Post-purchase Upsell-Seiten hinzufügen
Zugriff auf Checkout Extensibility
Settings → Checkout → Customize — öffnet den visuellen Checkout-Editor. Hier können Sie Elemente verschieben, Abschnitte ein- und ausschalten und Erweiterungsblöcke hinzufügen.
Um eigene UI-Extensions zu entwickeln, benötigen Sie einen Entwickler und das Shopify CLI, um den Extension-Code bereitzustellen. Dies ist aufwendiger als das Bearbeiten der checkout.liquid, ist aber der unterstützte, langfristige Weg.
Was Fudge für den Checkout tut und was nicht
Fudge erstellt und modifiziert Seiten innerhalb Ihres Shopify-Themes — Produktseiten, Landingpages, Collections, benutzerdefinierte Sektionen. Die Checkout-Anpassung ist ein vom Theme getrenntes System (gesteuert durch checkout.liquid und Checkout Extensibility).
Für Conversion-Elemente vor dem Checkout — Sticky ATC-Buttons, Upsells auf Produktseiten, Warenkorb-Anpassungen, Countdown-Timer, Trust-Badges — ist Fudge das richtige Tool. Beschreiben Sie, was Sie wollen, Fudge generiert den Code als Entwurf.
Für checkout-spezifische Anpassungen bei Plus-Plänen nutzen Sie checkout.liquid (Legacy) oder Checkout Extensibility (neuer Ansatz).
Thank you page / Order status page
Die Bestellbestätigungsseite (die „Dankesseite“) ist in allen Shopify-Plänen zugänglich über:
Einstellungen → Checkout → Bestellstatus-Seite → Zusätzliche Skripte
Dieses Feld akzeptiert HTML und JavaScript und wird nach einem erfolgreichen Kauf ausgeführt. Häufige Anwendungsfälle:
- Conversion-Tracking-Pixel (für Plattformen, die keine Customer Events nutzen)
- Eingebettete Post-Purchase-Umfragen
- Aufrufe für Empfehlungsprogramme (Referrals)
- Benutzerdefinierte Dankesnachrichten
Mit der Checkout Extensibility hat Shopify die Dankesseite als echtes Extension-Target mit einem visuellen Editor unter Einstellungen → Checkout → Anpassen neu aufgebaut.
FAQ
Shopify hat checkout.liquid für die Danke- und Bestellstatus-Seiten im August 2024 eingestellt. Für die Info- und Versandseiten ist die Einstellung für August 2025 geplant, die Zahlungsseite wird danach folgen. Plane deine Migration auf Checkout Extensibility rechtzeitig vor den jeweiligen Fristen — Shopify kündigt Termine ca. 12 Monate im Voraus an.
Mit checkout.liquid hast du die volle Liquid-Template-Kontrolle über das Checkout-HTML. Checkout Extensibility ist ein eingeschränktes, aber offiziell unterstütztes Framework: Du entwickelst React-basierte UI Extensions, die in vordefinierten Zonen gerendert werden, sowie Shopify Functions für die serverseitige Logik. Das bietet zwar weniger absolute Freiheit, wird aber von Shopify unterstützt und ist zukunftssicher.
Ja — aber die Daten der Felder müssen beim Absenden verarbeitet werden (z. B. als Line Item Properties speichern, an einen Webhook senden oder in einem Customer Metafield speichern). Mit Checkout Extensibility verarbeitet die Customer Information UI Extension benutzerdefinierte Felder viel sauberer mit nativer Validierung und Datenübermittlung.
In der Vergangenheit ja — beide lagen in derselben checkout.liquid-Datei. Nach dem Ende der Unterstützung im August 2024 wird die Bestellstatus-Seite jedoch durch Checkout Extensibility und nicht mehr durch checkout.liquid gesteuert. Bestehende checkout.liquid-Anpassungen für Inhalte auf den Danke- und Bestellstatus-Seiten wurden ab diesem Datum nicht mehr angewendet.
Ja, wenn du neue Anpassungen vornimmst. Neue Funktionen auf einer veralteten Plattform aufzubauen, führt nur zu doppelter Arbeit, wenn diese endgültig abgeschaltet wird. Bestehende Anpassungen können bis zur Migrationsfrist auf checkout.liquid bleiben. Alle Neuentwicklungen sollten ab sofort mit Checkout Extensibility erfolgen.
Um Ergebnisse zu messen, siehe Tracking-Skripte zu Shopify hinzufügen.