Das Wichtigste in Kürze
- Shopify hat keinen speziellen „Landingpage“-Button – du erstellst sie als Standardseiten und passt das Layout an.
- Die schnellste No-Code-Methode ist die Nutzung des Theme-Editors, um eine Seite aus verschiedenen Abschnitten (Sections) aufzubauen.
- Für ein wirklich individuelles Layout ohne Code ist ein KI-Tool wie Fudge die schnellste Option.
- Eine gute Landingpage hat ein Angebot, einen CTA und verzichtet auf alles, was von der Conversion ablenkt.
Shopify ist rund um Produktseiten und Kategorien (Collections) aufgebaut. Landingpages – fokussierte Seiten mit einem einzelnen Zweck, die für eine Kampagne oder Ad gebaut werden – sind keine Standardfunktion. Aber du kannst sie natürlich trotzdem problemlos erstellen.
Dieser Guide zeigt dir drei Wege, wie das geht: vom einfachsten bis zum leistungsstärksten.
Warum Sie uns vertrauen können
Jacques verfügt über mehr als 15 Jahre Erfahrung in der Shopify-Entwicklung und hat Hunderten von Marken dabei geholfen, Landingpages für Produktlaunches, Paid-Kampagnen und saisonale Aktionen zu erstellen. Wir haben auch Fudge entwickelt – einen KI-Storefront-Editor, der von Hunderten von Shopify-Stores genutzt wird und im Shopify App Store mit 5,0 bewertet ist.
Ist Shopify gut für Landingpages geeignet?
Ja – mit dem richtigen Ansatz.
Die Stärke von Shopify ist die native Integration. Eine innerhalb von Shopify erstellte Landing Page übernimmt automatisch den Checkout Ihres Shops, die Produktdaten und das Styling Ihres Themes. Sie benötigen kein separates Landing-Page-Tool, das über eine API verbunden werden muss.
Theoretisch gibt Shopify Ihnen standardmäßig keine komplett leere Leinwand vor. Jede neue Seite nutzt das Standard-Template Ihres Themes, das Ihnen meist nur einen Textbereich bietet. Um ein individuelles Layout zu erhalten, müssen Sie Abschnitte (Sections) hinzufügen.
Passend dazu: Fudge Page Builder.
Passend dazu: Individuelles Template in Shopify hinzufügen.
Passend dazu: Neue Seite in Shopify erstellen.
Die 3 Wege, eine Landingpage in Shopify zu erstellen
1. Theme Editor – sektionsbasierte Seiten (No-Code)
Mit dem integrierten Theme Editor von Shopify können Sie Seiten aus fertigen Abschnitten (Sections) bauen – Hero-Banner, Bildraster, Testimonials, Countdown-Timer und mehr.
Bestens geeignet für: Einfache Kampagnenseiten, die die vorhandene Sektionsbibliothek Ihres Themes nutzen.
Einschränkung: Sie sind auf das beschränkt, was Ihr Theme bietet. Wenn der benötigte Sektionstyp nicht existiert, können Sie ihn ohne Code nicht hinzufügen.
2. Code-Editor – benutzerdefinierte Templates (Entwickler-Skills erforderlich)
Sie können im Code-Editor (Onlineshop → Themes → Aktionen → Code bearbeiten) ein individuelles Seitentemplate erstellen und es mit Liquid, HTML und CSS exakt nach Ihren Wünschen gestalten.
Bestens geeignet für: Teams mit einem Entwickler oder Händler, die mit der Shopify-Templatesprache vertraut sind.
Einschränkung: Fehler können Ihren Shop lahmlegen. Duplizieren Sie Ihr Theme immer, bevor Sie den Code bearbeiten.
3. Fudge – KI-generierte individuelle Seiten (No-Code, maximale Flexibilität)
Fudge ermöglicht es Ihnen, die gewünschte Seite einfach auf Englisch oder Deutsch zu beschreiben, und generiert den Liquid-Code für Sie – direkt in Ihrem Theme.
„Erstelle eine Landingpage für unseren Summer Sale – Hero-Banner mit Countdown-Timer, drei Produkt-Feature-Blöcke und ein einzelner Add-to-Cart-CTA.“
Fudge erstellt einen Entwurf der Seite zur Überprüfung. Nichts geht live, bevor Sie es freigeben.
Bestens geeignet für: Individuelle Layouts, ohne Code zu schreiben oder durch die Sektionsbibliothek Ihres Themes eingeschränkt zu sein.
Du schaust lieber Videos? Hier ist ein Live-Walkthrough, wie man eine Shopify Landingpage mit Fudge baut:
So erstellen Sie eine Shopify Landing Page mit dem Theme-Editor
Schritt 1 – Seite erstellen. Gehen Sie zu Onlineshop → Seiten → Seite hinzufügen. Geben Sie ihr einen Titel und lassen Sie den Inhaltsbereich vorerst leer.
Schritt 2 – Template zuweisen. Wenn Ihr Theme ein Seiten-Template mit voller Sektionsunterstützung hat (die meisten Online Store 2.0 Themes haben das), lässt Shopify Sie dieses mit Abschnitten anpassen. Speichern Sie die Seite zuerst.
Schritt 3 – Theme-Editor öffnen. Gehen Sie zu Onlineshop → Themes → Anpassen. Navigieren Sie über die Seitenauswahl oben zu der soeben erstellten Seite.
Schritt 4 – Mit Sections aufbauen. Fügen Sie Abschnitte über die linke Seitenleiste hinzu – Hero-Bilder, Feature-Blöcke, Testimonials, CTAs. Ordnen Sie diese per Drag-and-Drop neu an. Entfernen Sie Header oder Footer, wenn Sie eine wirklich fokussierte Seite wünschen.
Schritt 5 – Veröffentlichen. Sobald Sie mit dem Layout zufrieden sind, ist die Seite unter ihrshop.de/pages/ihr-seiten-slug live.
So erstellen Sie eine Shopify Landing Page mit Fudge
Öffnen Sie Fudge und beschreiben Sie, was Sie möchten:
- „Erstelle eine Landing Page für unseren Black Friday Sale mit einem Full-Width Hero, Urgency-Countdown, den Top 3 Produkten und einem Sticky Add-to-Cart Button.“
- „Erstelle eine Landing Page für unsere neue Hautpflegeserie – cleanes, minimales Layout mit Inhaltsstoff-Highlights und Vorher-Nachher-Fotos.“
Fudge generiert die Seite als Entwurf direkt in Ihrem Theme. Sie prüfen sie, fordern Änderungen an und veröffentlichen sie, wenn alles passt.
Der Vorteil gegenüber dem Theme-Editor: Sie sind nicht auf die Section-Library Ihres Themes beschränkt. Fudge kann jedes Layout erstellen, das Sie beschreiben, und nutzt dafür nativen Shopify Liquid Code.
Um die Ergebnisse zu messen, siehe Conversions in Shopify tracken.
Was macht eine gute Shopify Landing Page aus?
Unabhängig davon, welche Methode Sie verwenden, haben Landing Pages mit hoher Conversion-Rate einige Gemeinsamkeiten:
- Ein klares Ziel. Jedes Element auf der Seite sollte auf eine einzige Aktion hinarbeiten – kaufen, anmelden oder ein Angebot beanspruchen. Mehrere CTAs verwässern die Aufmerksamkeit.
- Above-the-fold Hook. Der Hero-Bereich sollte sofort beantworten: Was ist das und warum sollte es mich interessieren?
- Ablenkungen durch Navigation entfernen. Überlegen Sie, den Header und Footer Ihrer Website auf Kampagnenseiten auszublenden, damit Besucher nicht wegnavigieren können, bevor sie konvertieren.
- Social Proof in der Nähe des CTA. Bewertungen, Sterne-Ratings oder Trust-Badges direkt beim Kauf-Button reduzieren Zweifel.
- Mobile-first. Der Großteil des Shopify-Traffics ist mobil. Prüfen Sie Ihre Seite auf dem Smartphone, bevor Sie sie veröffentlichen.
Was ist der Unterschied zwischen einer Landing Page und einer normalen Webseite?
Eine Webseite (wie Ihre Homepage oder die Über-uns-Seite) ist für allgemeines Browsing gedacht. Sie soll Ihre Marke vorstellen und Besuchern helfen, das Gesuchte zu finden.
Eine Landing Page ist für eine spezifische Zielgruppe konzipiert, die über eine bestimmte Quelle kommt – eine Anzeige, eine E-Mail, einen Social-Post. Sie hat nur einen Job: Diesen Traffic in einen Kauf, eine Anmeldung oder einen Lead zu verwandeln.
Der praktische Unterschied in Shopify: Eine Landing Page hat meist ein strafferes Layout, weniger Navigation und einen einzelnen CTA. Sie ist oft mit einem speziellen Produkt oder einer Aktion verknüpft, statt mit Ihrem gesamten Katalog.
Wie tracke ich die Performance meiner Shopify Landing Page?
Verbinden Sie Google Analytics 4 über den Google Tag Manager, um die Performance der Landing Page zu messen. Wichtige Kennzahlen: Conversion-Rate, Absprungrate und durchschnittliche Sitzungsdauer. Fügen Sie bei bezahlten Kampagnen UTM-Parameter zu Ihren Anzeigen-URLs hinzu (z. B. ?utm_source=meta&utm_campaign=summer-sale), damit Sie den Landing-Page-Traffic in GA4 isolieren und sehen können, welche Kampagnen konvertieren.
Wie füge ich eine Landingpage zur Shopify-Navigation hinzu?
Normalerweise gar nicht – Landingpages sind dafür gedacht, direkten Traffic über Anzeigen oder E-Mails zu erhalten, nicht um aktiv gesucht zu werden. Sie in die Hauptnavigation aufzunehmen, verwässert das fokussierte Erlebnis. Verlinken Sie stattdessen direkt aus Ihrer Anzeige, E-Mail oder Ihrem Social-Media-Post auf die Landingpage. Falls sie dennoch vom Store aus erreichbar sein muss, fügen Sie sie lieber als Footer-Link statt im Hauptmenü hinzu.
