Erstelle einen E‑Commerce‑Shop mit Shopify

Nutze Lovable + Shopify, um mühelos neue Onlineshops von Grund auf zu erstellen und zu veröffentlichen

Von physischen Produkten bis hin zu digitalen Downloads hilft dir Lovable, deinen neuen Shop mithilfe natürlicher Sprache zu erstellen, anzupassen und weiterzuentwickeln, während Shopify sich um Zahlungen, Lagerbestand und Logistik kümmert, sobald dein Shop live ist.

​

Anwendungsfälle

Mit Lovable + Shopify kannst du echte Online-Shops erstellen und starten für:

• Physische Produkte: verkaufe Kleidung, Gadgets, Accessoires oder Haushaltswaren
• Digitale Produkte: biete E‑Books, Kurse, Musik oder Software-Downloads an
• Nischenmarken: setze schnell Shops für limitierte Merch-Artikel, lokale Produkte, Dropshipping oder Nebenprojekte auf
• Kleinunternehmen: präsentiere Bäckereien, Cafés oder Handwerksbetriebe und nimm Bestellungen online an
• Testen neuer Produktideen: füge ein paar Produkte hinzu und bewerte ihren Erfolg, bevor du in großem Maßstab produzierst
• Geschäftserweiterung: führe neue Kollektionen, saisonale Kampagnen oder Bundles nur mithilfe einer Eingabeaufforderung ein

​

Bevor du beginnst

Bevor du mit dem Aufbau deines E‑Commerce‑Shops mit Lovable + Shopify startest, gibt es ein paar wichtige Dinge zu beachten:

• Nur für neue Shopify-Shops
  Die Lovable + Shopify-Integration ist dafür ausgelegt, nur neue Shopify-Shops zu erstellen und zu starten. Bestehende Shops können über diese Integration nicht verbunden oder verwaltet werden.
• Sandbox-Shop – keine Shopify-Kosten
  Lovable erstellt automatisch einen Sandbox-Shop, damit du sicher und ohne Shopify-Kosten bauen und experimentieren kannst. Diese Umgebung ist ideal für Einrichtung und Tests, aber sie verarbeitet keine echten Zahlungen.
• Deinen Shop beanspruchen
  Wenn du bereit bist, deinen Shop zu starten, musst du deinen Shop beanspruchen. Dadurch wird er in dein Shopify-Konto migriert und es beginnt eine 30-tägige kostenlose Shopify-Testphase. In Shopify musst du Zahlungen aktivieren und die Einrichtung deines Shops abschließen, um echte Zahlungen von deinen Kunden akzeptieren zu können.
• Erforderliches Shopify-Abonnement
  Nach dem Testzeitraum benötigst du einen kostenpflichtigen Shopify-Tarif, um weiterhin Produkte online zu verkaufen. Dieses Abonnement wird direkt über Shopify verwaltet und ist von den Lovable-Preisen unabhängig.
• Einhaltung der Shopify-Richtlinien für Bewertungen
  Bevor du deinen Shop veröffentlichst, stelle sicher, dass alle Bewertungen authentisch, unvoreingenommen und im Einklang mit Shopifys Richtlinie für Bewertungen sind.

​

Aktivieren der Shopify-Integration

Standardmäßig ist die Shopify-Integration in deinem Arbeitsbereich aktiviert. Du kannst das Verhalten der Shopify-Integration sowie zugehörige Shopify-Einstellungen für deine Projekte in deinen Benutzereinstellungen verwalten: Settings → Integrations → Shopify → User preferences.

​

Benutzerpräferenzen

Die Standardeinstellung für die Shopify-Integration ist Jedes Mal nachfragen, d. h. du entscheidest für jedes Projekt, ob die Shopify-Integration aktiviert oder deaktiviert werden soll. Du kannst deine Präferenz jederzeit unter Settings → Integrations → Shopify → User preferences ändern.

Lovable fordert dich auf, wenn eine Shopify-Integration benötigt wird. Du hast drei Optionen:

• Erlauben: aktiviert die Integration für das aktuelle Projekt.
• Ablehnen: lehnt die Integration für diese Anfrage ab (du wirst möglicherweise später erneut gefragt).
• Präferenzen anpassen: ändert das Standardverhalten für zukünftige Projekte (betrifft nicht das aktuelle Projekt).

​

Shopify-Integrationsablauf

Du kannst wie folgt starten:

• Erstelle ein neues Projekt.
• Remixe ein bestehendes Projekt, siehe Lovable + Shopify-Vorlagen.

​

1. Erstelle deinen Store

Wenn du ein neues Projekt von Grund auf erstellst, sag Lovable, welche Art von Store du erstellen möchtest, und gib Shopify an.

Erstelle einen E-Commerce-Store mit Shopify zum Verkauf handgefertigter Duftkerzen.

Wenn du ein bestehendes Projekt remixt, gib Lovable eine Eingabeaufforderung, in der du Shopify integrieren und Beispieldaten entfernen lässt. Es ist wichtig, eine gute, umfassende Eingabeaufforderung zu verwenden. Zum Beispiel:

Ich möchte die Produkte in diesem Store durch meine eigenen Produkte ersetzen und meinen Shopify-Store erstellen. Bitte gehe wie folgt vor:

1. Verbinde dich mit Shopify.
2. Entferne alle Beispiel-Produktdaten aus dem Store und erstelle X neue Produkte mit Produktbildern.
3. Aktualisiere die Produktkarten und die Produktdetailseite, damit sie die neuen Produktinformationen verwenden.
4. Aktualisiere die URL der Produktdetailseite, damit sie zum neuen Produkt passt.
5. Aktualisiere die „Zur Wunschliste hinzufügen“-Komponente und die Logik, damit sie zu dieser Änderung passt.
6. Aktualisiere meinen Warenkorb, den „Jetzt kaufen“-CTA und alle zugehörigen Checkout-Aktionen auf allen Seiten, damit sie die Shopify-Store-Integration widerspiegeln.

Lovable fordert dich auf, die Shopify-Verbindung zu aktivieren – klicke einfach auf Allow. Dein Sandbox-Store ist bereit für die Einrichtung.

​

2. Produkte und Produktbilder hinzufügen

Beginne, indem du Produkte mit Namen, Beschreibung und Preis hinzufügst. Zum Beispiel:

Füge ein Produkt mit dem Namen Lavender Breeze Candle hinzu, Beschreibung: „A calming handmade soy candle infused with lavender essential oils“, Preis: 25 $.

Du kannst die Details später bearbeiten. Wenn dein Produkt nicht angezeigt wird, gib folgende Eingabeaufforderung ein:

Display the products on the website.

Erweitere dann deine Produktauflistungen mit Bildern über eine der folgenden Optionen. Verwende immer repräsentative Bilder.

KI-Bilder generieren

Add an AI-generated image to the product Lavender Breeze Candle.

Eigenes Bild hochladen oder anhängen

Add the attached image to the product Lavender Breeze Candle.

Bild über URL hinzufügen

Add image from URL to the product Lavender Breeze Candle.

​

3. Verwalte deinen Shop

Verwalte deine Produkte und optimiere deinen Shop, ohne Lovable zu verlassen. Zum Beispiel kannst du Lovable Folgendes sagen:

• Produktnamen, Beschreibungen oder Preise aktualisieren
• Produkte entfernen
• Alle Produkte anzeigen
• Produktfilterfunktionen hinzufügen und Kollektionen auf Basis verschiedener Kategorien erstellen
• Bewertungsfunktionen für Produkte hinzufügen und Bewertungen nur bei verifizierten Käufen zulassen
• prozentuale oder feste (USD-)Rabattcodes hinzufügen und den Gültigkeitszeitraum angeben
• Wunschlistenfunktion hinzufügen und das Teilen der Wunschliste ermöglichen

Aktualisiere den Preis der Lavender Breeze Candle auf $28.
Ändere die Beschreibung der Vanilla Bean Candle, um den Holzdocht hervorzuheben.
Entferne das Produkt Cinnamon Spice Candle.
Zeige alle Produkte an.
Erstelle ein Bewertungssystem für Produkte und erlaube Bewertungen nur bei verifizierten Käufen.
Erstelle einen 15%-Rabattcode für das Produkt Lavender Breeze Candle. Der Code soll LAVANDER15 lauten und bis Ende November 2025 gültig sein.
Erlaube mir, Produkte zu einer Wunschliste hinzuzufügen und sie zu teilen.

​

4. Beanspruche deinen Store

Wenn du bereit bist, deinen Store zu beanspruchen und zu starten, bereite dich darauf vor, deinen Store zu entsperren sowie Zahlungen einzurichten und zu aktivieren, indem du den KYC-Prozess (Know Your Customer) durchläufst. Das kann einige Zeit dauern.

1. Gib „Claim the store“ ein. Lovable fordert dich auf, den Store zu beanspruchen. Klicke auf Claim. Dadurch wird Shopify in einem neuen Tab geöffnet, wo du dich anmelden und dann den Claim-Prozess abschließen kannst. Du kannst außerdem eine E-Mail-Einladung erhalten, um deinen Store zu beanspruchen.
2. Akzeptiere den Claim store-Link von Shopify. Dadurch gelangst du zurück zu deinem Lovable-Projekt.
3. Gehe in den Shopify-Adminbereich, um die Einrichtung deines Stores abzuschließen und Zahlungen zu aktivieren, damit du mit dem Verkauf beginnen kannst. Siehe Shopify payments für weitere Informationen.

Wenn du deinen Store beanspruchst, weist Shopify deinem Shop eine permanente Domain zu – keine Sorge, das ist nur dein Backend. Die eigentliche Store-URL wird deine lovable.app oder deine benutzerdefinierte Domain sein.

Beanspruche deinen Store nur, wenn du wirklich bereit für den Launch bist, da du nach der 30-tägigen kostenlosen Testphase ein kostenpflichtiges Shopify-Abonnement benötigst, um weiterhin Produkte online zu verkaufen.

​

5. Starte deinen Shop

Sobald du deinen Shop beansprucht und dein Setup abgeschlossen hast, veröffentliche dein Lovable-Projekt und teile deinen Shop mit der Welt!

Du kannst jederzeit direkt in Lovable:

• Produkte erstellen, aktualisieren und löschen
• Preise und Beschreibungen verwalten
• Neue Kollektionen, Aktionen oder Bundles starten

​

FAQ

Ich habe meine Produkte zu einem remixten Projekt hinzugefügt, aber der Link zur Produktseite funktioniert nicht. Wie behebe ich das?

Kein Problem – unser Agent lernt noch über deinen neuen Store, und du musst ihm nur einmal eine Eingabeaufforderung geben, um das dauerhaft zu beheben! Formuliere dazu folgende Eingabeaufforderung:

Bitte aktualisiere die Logik der Produkt-URLs, um sicherzustellen, dass alle neuen und zukünftigen Produkte im Store korrekt ihre jeweiligen Produktdetailseiten anzeigen.

Dadurch solltest du in Zukunft keine Probleme mehr haben. Für alle anderen Probleme kannst du auf die Schaltfläche „Try to Fix“ klicken, damit der Agent das Problem erkennt und behebt. 

Ich sehe in meinem remixten Projekt immer noch einige Beispielprodukte. Wie kann ich sie entfernen?

Gib dem Agenten eine Eingabeaufforderung, die Seiten zu aktualisieren, auf denen du diese Produkte gesehen hast, zum Beispiel:

Entferne alle vorhandenen Produkte aus dem Store auf allen Seiten, außer denen, die ich zu meinem Shopify-Store hinzugefügt habe.