Zum Hauptinhalt gehen

Wie können wir dir helfen?

Ich habe bei Digistore24 bestellt

Digistore24-Warenkorb: Mehrere Produkte - ein Checkout

Der Digistore24-Warenkorb ist ein nützliches Feature, wenn du auf deiner Verkaufsseite mehrere Produkte anbietest.

Mit dem Warenkorb können Kunden erst alle Produkte, die sie interessieren, auswählen und „sammeln“ - und anschließend in einem gemeinsamen Checkout abschließen.

Das hat Vorteile für deine Kunden:

  • Einfachheit: Erst alles auswählen, dann in einem Schritt bezahlen - statt mehrere separate Bestellvorgänge durchlaufen zu müssen.
  • Übersichtlichkeit: alle ausgewählten Produkte auf einen Blick im Checkout.

Und es hat Vorteile für dich:

  • Einfacherer Kaufprozess bei mehreren Produkten kann die Hürde senken und dadurch zu mehr Abschlüssen (höherer Conversion) führen.
  • Du kannst auf der Verkaufsseite verwandte Produkte strategisch platzieren, die Kunden dann direkt mitkaufen können.

Den Digistore24-Warenkorb bindest du in deine Verkaufsseite ein. Dafür gibt es verschiedene Möglichkeiten (JavaScript oder über das WordPress-Plugin von Digistore24) - und du kannst den Warenkorb bei Bedarf umfangreich konfigurieren. Wie das funktioniert, erfährst du in diesem Artikel.

So läuft der Kauf mit Warenkorb ab

Sobald der Digistore24-Warenkorb in deine Verkaufsseite eingebunden ist, läuft der Kauf für deine Kunden so ab:

  1. Der Kunde öffnet deine Verkaufsseite.
  2. Der Kunde klickt bei einem Produkt auf den Kaufen-Button.
    Das Produkt wird in den Warenkorb gelegt. Direkt danach sieht der Kunde eine kurze Bestätigung - mit:
    • Hinweis, dass das Produkt wurde zum Warenkorb hinzugefügt wurde
    • Zwischensumme und Anzahl der ausgewählten Produkte
    • Button Weiter einkaufen
    • Button Zur Kasse gehen
  3. Optional: Der Kunde öffnet den Warenkorb auf deiner Seite.
    Du kannst dafür einen Link oder Button einbauen, der den Warenkorb als Fenster einblendet.
  4. Der Kunde geht zur Kasse.
    Klickt er auf Zur Kasse gehen, wird er zum Digistore24-Bestellformular weitergeleitet.
  5. Im Bestellformular bezahlt der Kunde alles zusammen.
    Dort sind alle ausgewählten Produkte aufgelistet - und der Kunde schließt den Kauf in einem Vorgang ab.

Digistore24-Warenkorb auf deiner Verkaufsseite einbauen

Damit deine Kunden den Digistore24-Warenkorb nutzen können, musst du ihn einmal auf deiner Verkaufsseite einbauen. Das geht je nach Website auf zwei Arten: entweder mit einem kleinen JavaScript-Code oder - wenn du WordPress nutzt - mit dem Digistore24-WordPress-Plugin und einem Shortcode.

Warenkorb einbetten

Damit der Warenkorb auf deiner Verkaufsseite verfügbar ist, musst du ihn einmal einbetten.

Wähle dafür eine der folgenden Varianten:

Warenkorb einbetten via JavaScript

  1. Füge diesen Code in den Quelltext deiner Verkaufsseite ein (z. B. in den Bereich, in dem auch andere Skripte eingebunden werden).

    <script src="https://www.digistore24-scripts.com/service/digistore.js"></script> <script> digistoreCart("theme=v2"); </script>

  2. Speichere / veröffentliche die Seite.

Der Warenkorb ist auf deiner Seite eingebettet und kann genutzt werden.

Warenkorb einbetten via WordPress (Plugin + Shortcode)

Voraussetzung: Der Shortcode funktioniert nur mit WordPress und dem Digistore24-Plugin (Version 2.17 oder höher).

  1. Installiere das Digistore24-Plugin (falls noch nicht geschehen).
  2. Öffne die Seite, auf der deine Verkaufsseite liegt, im WordPress-Editor.

  3. Füge an einer passenden Stelle den Shortcode ein.

    [digistore_cart theme=v2]

  4. Speichere / aktualisiere die Seite.

Der Warenkorb ist auf deiner WordPress-Seite eingebettet und kann genutzt werden.

Kaufen-Buttons so verlinken, dass Produkte im Warenkorb landen

Damit ein Produkt beim Klick auf Kaufen im Warenkorb landet, muss dein Kaufen-Button auf eine bestimmte Digistore24-Adresse verlinken. Der Kunde bleibt dabei auf deiner Verkaufsseite - das Produkt wird einfach zum Warenkorb hinzugefügt.

So funktioniert's

Kaufen-URL (Grundprinzip)

Die Kaufen-URL für den Warenkorb lautet:

https://www.digistore24.com/add/PRODUKT-ID

Ersetze PRODUKT-ID durch die Produkt-ID deines Produkts. Du findest sie z. B. unter Produkteinrichtung > Produkt-Konfiguration in der Zeile des Produkts.

Wichtig: Nur klassische HTML-Links verwenden

Verwende für den Kaufen-Button einen normalen HTML-Link im Format:

<a href="LINK">LINK-TEXT</a>

Andernfalls kann Digistore24 den Kaufen-Button unter Umständen nicht korrekt erkennen.

Beispiele

Beispiel: Text-Link

<a href="https://www.digistore24.com/add/PRODUKT-ID">Jetzt kaufen</a>

Beispiel: Bild-Link

<a href="https://www.digistore24.com/add/PRODUKT-ID"><img src="URL-ZUM-BILD" /></a>

Warenkorb-Link oder -Button einbinden

Damit deine Kunden jederzeit sehen können, was schon im Warenkorb liegt, solltest du auf deiner Verkaufsseite einen Warenkorb-Link oder Warenkorb-Button einbauen. Darüber kann der Kunde den Warenkorb öffnen und anschließend den Kauf abschließen.

So funktioniert's

Warenkorb-URL

https://www.digistore24.com/cart

Beispiele

Beispiel: Text-Link

<a href="https://www.digistore24.com/cart">Warenkorb anzeigen</a>

Beispiel: Bild-Link

<a href="https://www.digistore24.com/cart"><img src="URL-ZUM-BILD" /></a>

Optional: Direkter Link zur Kasse (Checkout)

Wenn du möchtest, kannst du zusätzlich einen direkten Link zur Kasse einbauen. Damit kann der Kunde direkt zum Bestellformular wechseln.

https://www.digistore24.com/checkout

Beispiel: Text-Link

<a href="https://www.digistore24.com/checkout">Zur Kasse</a>

Beispiel: Bild-Link

<a href="https://www.digistore24.com/checkout"><img src="URL-ZUM-BILD" /></a>

Checkout festlegen: Standard oder eigene Domain

In den meisten Fällen reicht der Checkout auf Digistore24. Für bestimmte Tracking-Setups kann es aber sinnvoll sein, den Checkout auf deiner eigenen Domain zu nutzen.

Checkout auf Digistore24 (Standard)

In der Standard-Variante brauchst du nichts weiter zu tun. Wenn ein Kunde im Warenkorb auf Zur Kasse gehen klickt, wird er zum Digistore24-Bestellformular weitergeleitet.

Optional: Eigenes Bestellformular festlegen (orderform_id)

Wenn du ein bestimmtes Bestellformular verwenden möchtest, kannst du dessen ID in der Warenkorb-Einbettung angeben. Ersetze dafür 4321 durch deine Bestellformular-ID.

JavaScript

<script src="https://www.digistore24-scripts.com/service/digistore.js"></script> <script> digistoreCart("theme=v2 orderform_id=4321"); </script>

WordPress-Shortcode

[digistore_cart theme=v2 orderform_id=4321]

Checkout auf eigener Domain (z. B. Tracking / iOS)

Wenn du den Checkout auf deiner eigenen Domain einbinden möchtest (z. B. für bestimmte Tracking-Setups wie Facebook Ads mit iOS-Geräten), gehst du in drei Schritten vor:

So funktioniert's

  1. Checkout auf deiner Domain einbetten
    Füge auf deiner Checkout-Seite (auf deiner Domain) einen der folgenden Codes ein:

    • JavaScript

      <style> body { margin:0; } </style> <script src='https://www.digistore24.com/service/js/orderform_widget.js'></script> <iframe class='ds24_payIFrame' style='overflow: hidden; width: 100%; height: 100%; border: none; margin:0; padding: 0; background: transparent;' src='https://www.digistore24.com/checkout?iframe=1'></iframe>

    • WordPress-Shortcode

      [digistore_cart_checkout]

  2. Deine Checkout-URL beim Warenkorb angeben
    Übergib die URL deiner eigenen Checkout-Seite in der Warenkorb-Einbindung.

    • JavaScript

      <script src="https://www.digistore24-scripts.com/service/digistore.js"></script> <script> digistoreCart("theme=v2 checkout_url=https://www.mydomain.com/my-checkout_url"); </script>

    • WordPress-Shortcode

      [digistore_cart theme=v2 checkout_url=https://www.mydomain.com/my-checkout_url]

  1. Platzhalter ersetzen
    Ersetze https://www.mydomain.com/my-checkout_url durch die URL deiner Checkout-Seite aus Schritt 1.

Hinweis

Du kannst die Check-out-URL und das Bestellformular gleichzeitig angeben:

JavaScript

<script src="https://www.digistore24-scripts.com/service/digistore.js"></script> <script> digistoreCart("theme=v2 orderform_id=4321 checkout_url=https://www.mydomain.com/my-checkout_url"); </script>

WordPress-Shortcode

[digistore_cart theme=v2 orderform_id=4321 checkout_url=https://www.mydomain.com/my-checkout_url]

Einstellungen und Konfiguration des Digistore24-Warenkorbs

Du kannst das Verhalten des Digistore24-Warenkorbs über zusätzliche Optionen anpassen - zum Beispiel Sprache, MwSt.-Anzeige oder das Ziel nach dem Kauf. Die Optionen fügst du einfach in den Code bzw. Shortcode ein, den du bereits für den Warenkorb verwendest.

Standard in diesem Artikel: Wir verwenden in allen Beispielen theme=v2. Wenn du weitere Einstellungen nutzen möchtest, hängst du sie einfach dahinter.

So fügst du Einstellungen hinzu (Grundprinzip)

JavaScript

digistoreCart("theme=v2 OPTION1 OPTION2");

WordPress

[digistore_cart theme=v2 OPTION1 OPTION2]

Beispiel

digistoreCart("theme=v2 language=en netto");
[digistore_cart theme=v2 language=en netto]

Häufige Einstellungen (empfohlen)

Diese Optionen werden am häufigsten genutzt. Du kannst sie je nach Bedarf kombinieren.

Sprache

Stelle die Sprache des Warenkorbs ein.

  • language=de (Deutsch)
  • language=en (Englisch)

Beispiel:
digistoreCart("theme=v2 language=en");
[digistore_cart theme=v2 language=en]

Preise inklusive oder exklusive MwSt.

  • brutto - Preise inkl. Mehrwertsteuer
  • netto - Preise als Nettopreise zzgl. Mehrwertsteuer

Beispiel:
digistoreCart("theme=v2 brutto");
[digistore_cart theme=v2 brutto]

Nach dem Kauf / Zurück zur Seite

  • thankyou_url=https://xyz - Zielseite nach dem Kauf
  • return_url=https://xyz - Ziel, wenn der Käufer im Bestellformular auf „Weiter einkaufen“ klickt
  • no_return_button - blendet „Weiter einkaufen“ im Bestellformular aus

Gutschein & Tracking

  • voucher=some_voucher_code - fügt einen Gutscheincode hinzu
  • tracking='Dein Tracking-Key' - fügt einen Tracking-Key zum Kauf hinzu
    Hinweis: Wenn dein Tracking-Key Leerzeichen enthält, nutze Anführungszeichen.

Checkout-Verhalten

  • orderform_id=4321 - verwendet ein bestimmtes Bestellformular
  • orderform_as_popup - öffnet das Bestellformular in einem neuen Fenster

Upsells steuern (mit Beispielen)

Mit upsell=... legst du fest, ob und wie Upsells im Bestellverlauf angezeigt werden.

Gängige Varianten

  • upsell=any - Digistore24 wählt die Upsells vom ersten Produkt im Warenkorb, das Upsells hat (Standard)
  • upsell=none - deaktiviert Upsells komplett
  • upsell=first - zeigt nur die Upsells des ersten Produkts im Warenkorb
  • upsell=1234 - zeigt nach dem Initialkauf die Upsells von Produkt 1234

Reihenfolge-Regeln (Beispiele)

Du kannst mehrere Produkt-IDs in einer Reihenfolge angeben. Digistore24 prüft dann der Reihe nach, welche Produkte im Warenkorb liegen.

  • upsell=12,34,56,78,12 - prüft nacheinander, ob Produkt 12/34/56/78 im Warenkorb ist (Details siehe bestehende Logik)
  • upsell=123,any,456 - bevorzugt 123, sonst irgendein anderes Produkt im Warenkorb, sonst 456
  • upsell=123,456,none - bevorzugt 123, sonst 456, sonst keine Upsells

Beispiel:
digistoreCart("theme=v2 upsell=none");
[digistore_cart theme=v2 upsell=none]

Für Entwickler: Werte anzeigen & Events nutzen

Diese Optionen sind hilfreich, wenn du den Warenkorb stärker in deine Seite integrieren möchtest (z. B. Warenkorbwert anzeigen oder auf Änderungen reagieren).

Warenkorbwert auf der Seite anzeigen

show_total_amount=some_name zeigt den Warenkorbwert in einem HTML-Element mit der angegebenen ID oder CSS-Klasse (oder entsprechendem Namen) an.

Beispiel:
digistoreCart("theme=v2 show_total_amount=total_amount");
[digistore_cart theme=v2 show_total_amount=total_amount]

Warenkorbinhalt auf der Seite anzeigen

show_cart_items=some_name zeigt den Inhalt des Warenkorbs in einem HTML-Element mit der angegebenen ID oder CSS-Klasse (oder entsprechendem Namen) an.

Beispiel:
digistoreCart("theme=v2 show_cart_items=cart_items");
[digistore_cart theme=v2 show_cart_items=cart_items]

Auf Änderungen reagieren

on_cart_change=some_js_function ruft eine JavaScript-Funktion bei jeder Änderung des Warenkorbs auf. Die Funktion erhält ein cart-Objekt (u. a. Brutto-/Nettobeträge, Währung und Positionen).

Eigene Meldungen behandeln

on_message=some_alert_function ruft eine JavaScript-Funktion auf, wenn dem Nutzer eine Nachricht angezeigt werden soll. msg_type ist error, warning oder info.

Alle Einstellungen (Nachschlagetabelle)

In dieser Tabelle findest du alle verfügbaren Optionen als Nachschlagewerk. (Die Beispiele im Artikel nutzen standardmäßig theme=v2.)

Option

Erklärung

info_position Legt fest, wo die Info-Meldung „Zum Warenkorb hinzugefügt“ angezeigt wird.
  • top (Standard) - ganz oben im Browserfenster
  • bottom - ganz unten im Browserfenster
  • Zahl (z. B. 50) - so viele Pixel unterhalb des oberen Randes
info_sticky Wenn angegeben, wird die Warenkorb-Zusammenfassung immer angezeigt und am Fensterrand „angeheftet“.
brutto Preise im Warenkorb werden inklusive Mehrwertsteuer angezeigt. Wenn nicht explizit definiert, wird als Standard die Einstellung des ersten Produkts im Warenkorb für alle weiteren Produkte übernommen.
netto Preise im Warenkorb werden als Nettopreis zzgl. Mehrwertsteuer angezeigt. Wenn nicht explizit definiert, wird als Standard die Einstellung des ersten Produkts im Warenkorb für alle weiteren Produkte übernommen.
orderform_id=4321 Wählt das Bestellformular aus, das nach dem Klick auf „Zur Kasse gehen“ angezeigt wird. Wenn nicht explizit definiert, wird als Standard die Einstellung des ersten Produkts im Warenkorb für alle weiteren Produkte übernommen.
checkout_url=https://xyz Legt fest, welche Checkout-URL verwendet wird (z. B. wenn du den Checkout auf deiner eigenen Domain eingebunden hast).
return_url=https://xyz Definiert, wohin der Käufer weitergeleitet wird, wenn er im Bestellformular auf „Weiter einkaufen“ klickt. Standard ist der HTTP-Referrer (also die zuletzt aufgerufene Seite).
thankyou_url=https://xyz Nach dem Kauf wird der Käufer auf diese Seite weitergeleitet.
no_return_button Der Link „Weiter einkaufen“ wird im Bestellformular ausgeblendet.
currency_symbol Auf dem Bestellformular wird statt der Währungsabkürzung das Währungssymbol angezeigt (z. B. EUR → €).
currency=USD Im Warenkorb wird die angegebene Währung verwendet (z. B. EUR oder USD).
upsell=XXX Definiert, ob und wie Upsells im Bestellverlauf angezeigt werden (siehe folgende Varianten).
upsell=any Digistore24 wählt die Upsells vom ersten Produkt im Warenkorb, das Upsells hat. (Standard)
upsell=1234 Zeigt nach dem Initialkauf die Upsells von Produkt 1234 an.
upsell=12,34,56,78,12 Prüft die Liste der Reihe nach: Wenn Produkt 12 im Warenkorb ist, werden dessen Upsells gezeigt. Sonst 34, sonst 56, sonst 78. Wenn keines dieser Produkte im Warenkorb liegt, werden die Upsells der letzten Produkt-ID der Liste angezeigt (hier: 12; doppelte ID möglich, aber nicht empfohlen).
upsell=123,any,456 Zeigt Upsells von Produkt 123, wenn es im Warenkorb liegt; sonst Upsells von irgendeinem anderen Produkt im Warenkorb (falls vorhanden); sonst Upsells von Produkt 456 (auch wenn 456 nicht im Warenkorb liegt).
upsell=123,456,none Zeigt Upsells von Produkt 123, wenn es im Warenkorb liegt; sonst Upsells von Produkt 456, wenn es im Warenkorb liegt; sonst keine Upsells und Weiterleitung direkt zur Dankeseite.
upsell=none Deaktiviert das Anzeigen von Upsells komplett - unabhängig davon, ob Produkte im Warenkorb Upsells haben oder nicht.
upsell=first Zeigt nur die Upsells des ersten Produkts im Warenkorb an. Das ist das Standard-Verhalten bei Verkäufen, die nicht über einen Warenkorb erfolgen.
language=en Stellt die Sprache auf Englisch um. Standardmäßig wird die Sprache des ersten Produkts verwendet, das in den Warenkorb gelegt wird. Mögliche Sprachen: en und de.
orderform_as_popup Wenn der Käufer auf „Zur Kasse gehen“ klickt, öffnet sich das Digistore24-Bestellformular in einem neuen Fenster.
tracking=dein_tracking_key
tracking='Dein Tracking-Key' 		Fügt den angegebenen Tracking-Key zum Kauf hinzu (wie sonst der GET-Parameter ds24tr). Wenn der Tracking-Key Leerzeichen enthält, verwende Anführungszeichen (z. B. tracking='mein Key').
quantity_readonly Auf dem Bestellformular kann die Anzahl nicht geändert werden. Es können auch keine Produkte entfernt werden.
show_total_amount=some_name Zeigt den Warenkorbwert in dem HTML-Element mit der angegebenen ID oder CSS-Klasse (oder entsprechendem Namen) an. Wenn sich der Warenkorb ändert, wird der Betrag automatisch aktualisiert.
show_cart_items=some_name Zeigt den Inhalt des Warenkorbs in dem HTML-Element mit der angegebenen ID oder CSS-Klasse (oder entsprechendem Namen) an.
on_cart_change=some_js_function Ruft die JavaScript-Funktion some_js_function(cart) bei jeder Änderung des Warenkorbs auf.

cart enthält u. a.:

  • gross_amount, net_amount
  • gross_amount_msg, net_amount_msg
  • currency
  • items (Array), je Item u. a.: product_id, gross_amount, vat_amount, can_show_price, max_quantity, quantity, is_quantity_readonly
on_message=some_alert_function Ruft die JavaScript-Funktion some_alert_function(msg_type, msg_text) auf, wenn eine Nachricht angezeigt werden soll. msg_type ist error, warning oder info.
voucher=some_voucher_code Fügt den Gutscheincode zur Bestellung hinzu. Der Code wird angewendet (sofern er für das erste gekaufte Produkt gültig ist).
theme=v2
theme=modern
theme=classic 		Wählt ein Theme für den Warenkorb. In diesem Artikel verwenden wir standardmäßig theme=v2. (Für das klassische Theme kannst du theme=classic setzen; alternativ theme=modern.)

Hinweis

Wenn im Code bzw. Shortcode nicht explizit definiert, wird als Standard die Einstellung des ersten Produkts im Warenkorb für alle weiteren Produkte übernommen.

Beispiel:

[digistore_cart theme=v2 language=en netto tracking="kampagne 1"]

Tipps und Tricks zum Digistore24-Warenkorb

Hier findest du ein paar praktische Tipps aus der Praxis.

Tipp 1: Zahlungspläne deiner Produkte aufeinander abstimmen

Wenn du Produkte per Abo oder Ratenzahlung verkaufst, solltest du bei allen Produkten möglichst die gleichen Abrechnungsintervalle verwenden (z. B. monatlich oder jährlich). So entstehen für den Käufer weniger einzelne Abbuchungen - und der Bezahlvorgang bleibt übersichtlich.

Du kannst dabei Einmalzahlungen mit Abo- und Ratenzahlungsprodukten mischen. Digistore24 bietet dem Käufer dann das Abrechnungsintervall an, das zu allen ausgewählten Produkten passt.

Beispiel

  • Produkt 1: Jahreszahlung und Monatszahlung
  • Produkt 2: Jahreszahlung und Zwei-Jahres-Zahlung
  • Produkt 3: nur Einmalzahlung

Ergebnis: Der Käufer kann nur per Jahreszahlung zahlen (weil das der gemeinsame Nenner ist).

Wenn deine Produkte Testzeiträume haben, wird außerdem der kürzeste Testzeitraum der ausgewählten Produkte verwendet. Und damit Abbuchungen zusammen passen, solltest du bei allen Produkten (auch bei Einmalzahlungen) einheitlich entscheiden, ob die MwSt. im Preis enthalten sein soll oder nicht.

Beides stellst du in Digistore24 ein unter Produkteinrichtung > Produkt-Konfiguration - in den Produkt-Details im Tab „Zahlungspläne“.

Tipp 2 (für Webdesigner): Fenster dauerhaft anzeigen lassen

Wenn dein Webdesigner den Warenkorb optisch anpassen soll, ist es hilfreich, wenn die Warenkorb-Fenster dauerhaft sichtbar sind. So lassen sie sich einfacher gestalten und testen.

Hänge dafür an die URL der Seite, auf der der Warenkorb eingebaut ist, den Parameter ?ds24debug an.

Beispiel

https://www.domain.com?ds24debug

Tipp 3 (für Webentwickler): Produkte per JavaScript hinzufügen

Wenn du deine Seite flexibler gestalten möchtest (z. B. eigene Buttons, dynamische Produktlisten), kannst du Produkte auch direkt per JavaScript zum Warenkorb hinzufügen.

Produkte hinzufügen

ds24cart_add(123) - fügt das Produkt 123 zum Warenkorb hinzu
ds24cart_add(123, 3) - fügt das Produkt 123 drei Mal zum Warenkorb hinzu

Warenkorb anzeigen

Verwende ds24cart_show(button), um den Warenkorb zu öffnen.

Beispiel

<button onclick="return ds24cart_show(this);">Warenkorb anzeigen</button>