# So fügst du E-Commerce zu jeder Website hinzu (ohne die Plattform zu wechseln)

> Drei Integrationsmuster, um Commerce zu einer bestehenden Website hinzuzufügen. Wann welches sinnvoll ist, was sich auf deiner Website ändert und wann ein Plattformwechsel tatsächlich lohnt.

Ryan Badger - 2. Juni 2023 - 4 Min. Lesezeit

## Was Leute mit "E-Commerce integrieren" wirklich meinen

Du hast eine Website. Eine Marketing-Seite, ein Portfolio, einen Blog, vielleicht einen Webflow- oder Squarespace-Aufbau. Sie funktioniert. Sie sieht so aus, wie du es willst. Aber jetzt musst du darüber etwas verkaufen.

Der falsche Schritt ist, sie wegzuwerfen und auf Shopify neu zu bauen. Der richtige Schritt hängt von drei Dingen ab:

1. **Was du verkaufst.** Ein Produkt oder einen Katalog? Physisch oder digital? Abo oder einmalig?
2. **Worauf deine Website läuft.** Überall dort, wo du ein Script-Tag einfügen kannst, stehen dir die Optionen offen.
3. **Wie viel vom Checkout-Erlebnis du selbst besitzen willst.**

Dieser Beitrag zeigt, wie "Integration" im Jahr 2026 für jede dieser Achsen wirklich aussieht. Ein Plattformwechsel ist nicht nötig, wenn du richtig wählst.

## Die drei echten Integrationsmuster

### Muster 1: Weiterleitung zu einem gehosteten Checkout

Das Einfachste. Deine Website hat Kaufen-Buttons. Ein Klick, und der Kunde verlässt deine Website Richtung Checkout (Stripe Payment Links, Gumroad, Payhip, Lemonsqueezy). Die Zahlung läuft auf deren Domain, danach kehrt er zu deiner Dankeseite zurück.

**Vorteile:** keine JS-Integration, funktioniert wortwörtlich auf jeder Website, wenig Wartung. **Nachteile:** Der Bruch im Erlebnis (die Website zu verlassen) schadet der Conversion. Das Branding ist uneinheitlich. Abläufe bei Warenkorbabbrüchen und Analytics werden schwieriger.

Passt gut für: Kreative mit einem einzelnen Produkt, geringes Volumen, technische Abneigung dagegen, irgendetwas einzubetten.

### Muster 2: Ein Widget in die Seite einbetten

Ein eingebettetes Widget läuft innerhalb deiner Website. Der Kunde verlässt sie nie. Warenkorb, Produktdetails und Checkout werden alle in deinen Seiten dargestellt.

Das bieten Shoprocket, Snipcart, Ecwid und ähnliche Plattformen.

Typische Integration:

```
<!-- EXAMPLE ONLY. Grab your real snippet from Sales channels → Embeds in your dashboard -->
<script src="https://cdn.shoprocket.io/loader.js" data-pk="pk_yourkey"></script>
<div data-shoprocket="catalog" data-embed-id="emb_xxx"></div>
```

Eine Zeile, einmal einfügen, fertig. Das Widget synchronisiert sich automatisch mit deinem Dashboard: Produkte, Preise, Bilder, Steuerregeln, Versandoptionen, Zahlungsmethoden. Kunden bleiben von "Stöbern" bis "Danke für deine Bestellung" auf deiner Domain.

**Vorteile:** einheitliches Erlebnis, Kontrolle über die Marke, weniger Conversion-Lecks. **Nachteile:** Deine Website hat jetzt eine JS-Abhängigkeit. Die meisten sind leichtgewichtig (~20-50KB), aber nicht null.

Passt gut für: jede Website, die einen echten Shop will, ohne die Plattform zu wechseln.

### Muster 3: Headless-Integration (API)

Du baust die Oberfläche selbst und rufst für die Commerce-Mechanik eine Commerce-API auf (Stripe API, Shopify Storefront API, BigCommerce, Commercetools). Vollständig individuell, vollständig deins.

**Vorteile:** vollständige Kontrolle, keine visuellen Kompromisse, skaliert auf individuelle Abläufe. **Nachteile:** echte Entwicklungsarbeit. Du baust Checkout, Warenkorb-Zustand, Steuerberechnung, Bestandssynchronisierung und Webhooks. Monate an Zeit, keine Minuten.

Passt gut für: Teams mit einem Entwickler, der sich in Vollzeit um Commerce kümmert, oder Produkte, die in kein fertiges Widget passen würden.

## Der Entscheidungsbaum

Beginne mit "Soll dein Kunde deine Website verlassen?":

- **Ja**: Muster 1 (Link zu gehostetem Checkout). Stripe Payment Links oder Gumroad, in 10 Minuten eingerichtet.
- **Nein**: weiter zur nächsten Frage.

Willst du eigenen Code schreiben?

- **Ja, wir haben Entwicklerkapazität**: Muster 3 (Headless).
- **Nein, wir wollen etwas Fertiges**: Muster 2 (eingebettetes Widget). Hier landen die meisten Websites.

Bei Muster 2 ist die nächste Entscheidung die Wahl der Plattform. Das behandelt unser separater Beitrag: [einbettbare Warenkorb-Plattformen im Vergleich](https://v3.shoprocket.io/de/blog/einbettbare-warenkorb-plattformen-vergleich-snipcart-ecwid-gumroad-payhip-shoprocket.md).

## So sieht eine echte Integration nach Muster 2 auf gängigen Plattformen aus

### WordPress

Füge den Embed-Snippet in einen Block "Individuelles HTML" (Block-Editor) oder ein Text-Widget (klassische Seitenleiste) ein. Keine Plugin-Installation nötig.

### Squarespace

Füge auf einer beliebigen Seite einen Code-Block hinzu. Einfügen. Das Widget respektiert Breite und Abstände deines Squarespace-Themes.

### Webflow

Embed-Element → einfügen. Webflows statischer Export enthält das Embed beim Veröffentlichen weiterhin.

### Framer

Embed-Element → einfügen. Mit Framers Entwicklerwerkzeugen lässt sich der Snippet leicht in einem bestimmten Abschnitt platzieren.

### Carrd

Komponente für eigenen Code (Funktion des bezahlten Tarifs). Einseitige Websites mit einem Shop-Tab, unkompliziert.

### Notion

Nutze eine öffentliche Notion-Seite als deine Website, binde sie über einen Dienst wie Super oder Potion ein und füge den Snippet ein. Wird zu einem echten Shop.

### Statisches HTML / Jekyll / Hugo / 11ty

Füge den Snippet in die Vorlage ein, die deine Shop-Seite rendert. Mehr nicht.

## Was sich nach der Integration auf deiner Website ändert

Weniger, als du denkst.

- Deine bestehenden Seiten bleiben, wie sie sind. Keine Theme-Änderungen nötig.
- Das Skript lädt asynchron, die Seitengeschwindigkeit bleibt also praktisch unverändert (die Lighthouse-Werte halten sich).
- Produkte, Preise und Bestand liegen in deinem Commerce-Dashboard, nicht in deinem CMS.
- Kundendaten (Bestellungen, E-Mail-Adressen, Adressen) fließen zur Commerce-Plattform. Dein CMS muss nichts davon verarbeiten.

Was du NICHT tun musst:

- Deine Website neu bauen
- Ein CMS-Plugin installieren
- Inhalte migrieren
- Einen Entwickler einstellen
- Eine neue Domain kaufen

> **Tipp:** Teste das Widget zuerst auf einer Staging-Seite. Es sollte mit nichts in Konflikt geraten, aber es lohnt sich, es mit deinem konkreten Theme zu prüfen, bevor du es auf eine Shop-Seite in der Produktion bringst.

## Wann du wirklich die Plattform wechseln solltest

Manchmal IST die Antwort "auf eine vollständige Commerce-Plattform umziehen". Anzeichen:

- Du machst 100k $+ im Monat, und die Kernaufgabe deiner Website ist das Verkaufen geworden, nicht die Marke.
- Du brauchst eine POS-Anbindung (stationärer Handel + online).
- Dein Produktkatalog hat >1.000 SKUs mit ständigen Aktualisierungen.

In dieser Größenordnung beginnt sich Shopify Plus oder Ähnliches auszuzahlen. Für die meisten unabhängigen Websites unter dieser Schwelle ist Einbetten günstiger, schneller und lässt dir die Website, die du schon hast.

## TL;DR

- **Link zu gehostetem Checkout**: am schnellsten, bricht das Erlebnis bei der Zahlung. Gut für einzelne Produkte.
- **Eingebettetes Widget**: hält den Kunden auf deiner Website, kein Plattformwechsel. Ein guter Standard.
- **Headless-API**: Eigenbau, Monate an Arbeit. Lohnt sich nur bei großem Maßstab.

[Probiere Shoprockets Embed auf deiner bestehenden Website aus](https://app-v3.shoprocket.io/signup). Kostenlose Testphase, keine Karte nötig. Preise: [ab 29 $](https://v3.shoprocket.io/de/preise.md), null Transaktionsgebühren in jedem Tarif.

---

- HTML version: https://v3.shoprocket.io/de/blog/ecommerce-zu-jeder-website-hinzufuegen-ohne-plattformwechsel
- Language: Deutsch (de)
- Also in: [العربية](https://v3.shoprocket.io/ar/blog/how-to-add-ecommerce-to-any-website-without-replatforming.md), [Ελληνικά](https://v3.shoprocket.io/el/blog/how-to-add-ecommerce-to-any-website-without-replatforming.md), [English](https://v3.shoprocket.io/blog/how-to-add-ecommerce-to-any-website-without-replatforming.md), [Español](https://v3.shoprocket.io/es/blog/anadir-ecommerce-a-cualquier-web-sin-cambiar-de-plataforma.md), [Français](https://v3.shoprocket.io/fr/blog/ajouter-ecommerce-a-un-site-sans-changer-de-plateforme.md), [עברית](https://v3.shoprocket.io/he/blog/how-to-add-ecommerce-to-any-website-without-replatforming.md), [हिन्दी](https://v3.shoprocket.io/hi/blog/how-to-add-ecommerce-to-any-website-without-replatforming.md), [Bahasa Indonesia](https://v3.shoprocket.io/id/blog/cara-menambahkan-ecommerce-ke-situs-web-mana-pun-tanpa-ganti-platform.md), [Italiano](https://v3.shoprocket.io/it/blog/aggiungere-ecommerce-a-qualsiasi-sito-senza-cambiare-piattaforma.md), [日本語](https://v3.shoprocket.io/ja/blog/how-to-add-ecommerce-to-any-website-without-replatforming.md), [Lietuvių](https://v3.shoprocket.io/lt/tinklarastis/kaip-prideti-el-prekyba-prie-bet-kurios-svetaines-nekeiciant-platformos.md), [Norsk](https://v3.shoprocket.io/nb/blogg/legg-nettbutikk-til-et-hvilket-som-helst-nettsted-uten-a-bytte-plattform.md), [Nederlands](https://v3.shoprocket.io/nl/blog/webshop-toevoegen-aan-elke-website-zonder-te-verhuizen.md), [Polski](https://v3.shoprocket.io/pl/blog/jak-dodac-e-commerce-do-dowolnej-strony-bez-zmiany-platformy.md), [Português](https://v3.shoprocket.io/pt/blog/como-adicionar-ecommerce-a-qualquer-site-sem-trocar-de-plataforma.md), [Română](https://v3.shoprocket.io/ro/blog/cum-adaugi-ecommerce-pe-orice-site-fara-sa-schimbi-platforma.md), [Русский](https://v3.shoprocket.io/ru/blog/how-to-add-ecommerce-to-any-website-without-replatforming.md), [ไทย](https://v3.shoprocket.io/th/blog/how-to-add-ecommerce-to-any-website-without-replatforming.md), [Türkçe](https://v3.shoprocket.io/tr/blog/platform-degistirmeden-web-sitesine-eticaret-ekleme.md), [中文](https://v3.shoprocket.io/zh/blog/how-to-add-ecommerce-to-any-website-without-replatforming.md)