1. Home
  2. Produktverkauf
  3. Verkaufsfördernde Features
  4. Digistore24-Warenkorb auf Ihrer Webseite einbinden

Digistore24-Warenkorb auf Ihrer Webseite einbinden

Wenn Sie den Warenkorb von Digistore24 auf Ihrer Webseite einbinden, können Ihre Kunden mehrere Produkte in einen Warenkorb legen, bevor sie „zur Kasse gehen“. Alle Produkte im Warenkorb können mit einer Bestellung über das Digistore24 Bestellformular bezahlt werden.

Im Folgenden erhalten Sie eine Übersicht zur Funktionsweise inklusive einer Installations-Anleitung, lernen die Einstellungsmöglichkeiten kennen und bekommen Tipps für eine flüssige Funktionalität des Warenkorb Features auf Ihrer Webseite.

1. Die Funktionsweise des Digistore24-Warenkorbs

​Schritt 1: Kunde klickt auf einen Ihrer Kaufen-Buttons

​Beim Klick auf den Kaufen-Button erscheint die Bestätigungsmeldung, dass das Produkt zum Einkaufswagen hinzugefügt wurde. Es wird die Zwischensumme und Anzahl aller sich derzeit im Warenkorb befindenden Produkte angezeigt. Der Kunde kann das Fenster schließen mit einem Klick auf den Button "Weiter einkaufen" oder auf das Kreuz in der rechten oberen Ecke. Er kann nun weitere Produkte nach dem selben Ablauf in den Warenkorb legen. Klickt der Kunde auf den Button mit der Aufschrift "Zur Kasse gehen", wird er zum Digistore24-Bestellformular weitergeleitet.

Schritt 2: Warenkorb im Kauf-Prozess anzeigen lassen

​Sie können einen Warenkorb-Link (z.B. in Ihrem Menü oder als Warenkorb-Icon) auf Ihrer Seite einbauen. Wenn der Kunde dann mit der Maus über diesen Link (oder dieses Icon) fährt, erscheint automatisch die Detail-Ansicht des Warenkorbs. Kunden, die ein Smartphone oder Tablet benutzen, müssen den Warenkorb-Link nur einmal mit ihrem Finger antippen.

Schritt 3: Bezahlen per Klick auf "Zur Kasse gehen"

Nach dem Klick auf den Button "Zur Kasse gehen" erscheint das Digistore24-Bestellformular. Dieses enthält alle vom Kunden in den Warenkorb gelegten Produkte. Der Kunde kann diese Produkte mit nur einem Vorgang bezahlen.

ZURÜCK NACH OBEN

2. Die Installation des Digistore24-Warenkorbs

Schritt 1: Den Warenkorb auf Ihrer Webseite einbauen

Sie können den Warenkorb per Javascript oder WordPress-Shortcode auf Ihrer Webseite einbinden. Der WordPress-Shortcode funktioniert nur in Verbindung mit WordPress und dem installierten Digistore24-Plugin (Version 2.17 oder höher). Andernfalls greifen Sie auf den Javascript Code zurück.

Digistore24 WordPress Plugin - Shortcode
[digistore_cart]

JavaScript Code (imBereich der Seite einfügen)

<script src="https://www.digistore24.com/service/digistore.js"></script>

<script>
digistoreCart();
</script>

Schritt 2: Kaufen-Buttons einrichten

Bitte verwenden Sie immer nur das klassische HTML-a-Tag für den Kaufen-Link, den Sie hinter Ihrem Kaufen-Button hinterlegen möchten. Andernfalls erkennt Digistore24 den Kaufen-Button nicht korrekt.

Die Kaufen-URL für den Warenkorb lautet https://www.digistore24.com/add/123. Bitte tauschen Sie 123 gegen die Produkt-ID aus.

Bauen Sie den Link bitte korrekt ein, wie an den folgenden Beispielen sichtbar:

Code für einen Text-Link:
<a href="https://www.digistore24.com/add/123">Link Text</a>

Code für einen Bild-Link:
<a href="https://www.digistore24.com/add/123"><img src="url-zum-button-bild"/></a>

Sie können auf Ihrer Webseite einen Warenkorb-Link oder -Button einbauen, über den der Kunde seinen aktuellen Warenkorb-Status abrufen kann. Fährt er mit der Maus darüber (oder tippt den Link auf einem Smartphone/Tablet an), erscheint das Warenkorb-Fenster.  Für diesen Link ist eine weitere URL nötig: https://www.digistore24.com/cart

Bauen Sie auch diesen Link bitte korrekt ein, wie an den folgenden Beispielen sichtbar:

Code für einen Text-Link:
<a href="https://www.digistore24.com/cart">Link Text</a>

Code für einen Bild-Link:
<a href="https://www.digistore24.com/cart"><img src="url-zum-button-bild"/></a>

ZURÜCK NACH OBEN

3. Die Einstellungsmöglichkeiten des Digistore24-Warenkorbs

​Der Warenkorb von Digistore24 hat mehrere Einstellungsmöglichkeiten. Um eine Einstellung zum Warenkorb hinzufügen zu können, müssen Sie den Javascript-Code oder WordPress-Shortcode um zusätzliche Optionen erweitern.

Im Javascript Code: digistoreCart("Option1 Option2");

Im WordPress Shortcode: [digistore_cart Option1 Option2]

Mögliche Einstellungen und dazugehörige Optionen

Option Erklärung der Einstellung
info_position

Legt fest, wo Info-Meldung „Zum Warenkorb hinzugefügt“ angezeigt wird. Mögliche Werte:

  • top (Standard) – die Meldung wird ganz oben im Browserfenster angezeigt
  • bottom – die Meldung wird ganz unten im Browserfenster angezeigt
  • Zahl (z.B. 50) – die Meldung wird dieser Zahl an Pixel unterhalb des oberen Rand das Browserfensters angezeigt.
brutto Alle Preise im Warenkorb werden inklusive Mehrwertsteuer angezeigt. Wenn im Code bzw. Shortcode nicht explizit definiert, wird als Standard die Einstellung des ersten Produkts im Warenkorb für alle weiteren Produkte übernommen.
netto Alle Preise im Warenkorb werden angezeigt als Netto-Preis zzgl. Mehrwertsteuer. Wenn im Code bzw. Shortcode nicht explizit definiert, wird als Standard die Einstellung des ersten Produkts im Warenkorb für alle weiteren Produkte übernommen.
orderform_id=321 Wählt das Bestellformular aus, welches nach dem Klick auf „Zur Kasse gehen“ angezeigt werden soll. Wenn im Code bzw. Shortcode nicht explizit definiert, wird als Standard die Einstellung des ersten Produkts im Warenkorb für alle weiteren Produkte übernommen.
return_url=https://xyz Definiert, wohin der Kunde weitergeleitet wird, wenn er auf dem Bestellformular auf den Link „Weiter einkaufen“ klickt. Als Standard wird der HTTP-Referrer genutzt, also auf die zuletzt aufgerufene Seite zurückgeleitet.
no_return_button Der Link „Weiter einkaufen“ wird auf dem Bestellformular ausgeblendet.
currency_symbol Auf dem Bestellformular wird statt der Währungsabkürzung das Währungssymbol angezeigt (z.B. EUR → €).
upsell=XXX

Definiert, ob und wie Upsells im Bestellverlauf angezeigt werden sollen.

Wichtig: Für alle aufgeführten Produkte muss der freie Upsell-Verlauf aktiviert sein. Gehen Sie dazu in den Produkt-Eigenschaften auf den Tab Upsells und stellen Sie die Optionen ein:

  • Freien Upsellverlauf aktivieren: JA
  • Initialverkauf startet freien Upsellflow: JA
  • Kauf beendet freien Upsellflow: NEIN

Es folgen mehrere Beispiele für Anwendungsmöglichkeiten:

upsell=any Digistore24 wählt die Upsells vom ersten Produkt im Warenkorb, das Upsells hat. Dies ist die Standardeinstellung.
upsell=1234 Zeigt nach dem Initialkauf die Upsells von Produkt 1234 an.
upsell=12,34,56,78,12 Zeigt nach dem Initialkauf die Upsells von Produkt 12 an, falls es im Warenkorb ist. Sonst werden die Upsells von Produkt 34 angezeigt, falls es im Warenkorb ist. Sonst wird erneut das nächste Produkt aus der Auflistung herangezogen. Falls keines der aufgezählten Produkte vom Kunden in den Warenkorb gelegt wurde, werden die Upsells der letzten Produkt-ID der Aufzählung angezeigt (in diesem Beispiel die Produkt-ID „12“. Diese ID darf eine doppelte ID sein, muss es aber nicht).
upsell=123,any,456 Zeigt die Upsells von Produkt 123 nach dem Initialkauf an, sofern Produkt 123 vom Kunden in den Warenkorb gelegt wurde. Sonst die Upsell von irgendeinem anderen Produkt im Warenkorb (sofern Upsells vorhanden sind). Sonst die Upsells von Produkt 456 (selbst, wenn das Produkt 456 nicht im Warenkorb liegt, werden dessen Upsells nach dem Initialkauf angezeigt).
upsell=123,456,none Falls das Produkt 123 im Warenkorb ist, werden nach dem Initialkauf die Upsells von Produkt 123 angezeigt. Sonst falls das Produkt 456 im Warenkorb ist, werden nach dem Initialkauf die Upsells von Produkt 456 angezeigt. Falls keines der aufgelisteten Produkte Upsells hat, werden nach dem Initialkauf keine Upsells angezeigt und der Kunde wird direkt zur Dankeseite weiter geleitet.
upsell=none Deaktiviert das Anzeigen von Upsells komplett, unabhängig ob Produkte im Warenkorb Upsells haben oder nicht.
upsell=first Zeigt nur die Upsells des ersten Produkts im Warenkorb an. Dies 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 sind aktuell: en (Englisch) und de (Deutsch)
orderform_as_popup Wenn der Käufer auf die Schaltfläche Zur Kasse gehen klickt, öffnet sich das Digistore24-Bestellformular im neuen Fenster.
tracking=dein_tracking_key
oder
tracking='Dein Tracking-Key‘

Fügt den angegebenen Tracking-Key zum Kauf hinzu (genauso wie es sonst der GET-Paramter ds24tr macht).

Falls der Tracking-Key Leerzeichen enthält, verwenden Sie bitte Anführungszeichen (also tracking='mein Key‘).

currency=USD Im Warenkorb wird die angegebene Währung verwendet. Mögliche Werte sind: EUR, USD und CHF

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

Beispiele

Im Javascript Code:
<script src="https://www.digistore24.com/service/digistore.js"></script>
<script>
digistoreCart("language=en netto tracking='kampagne 1'");
</script>

Im WordPress Shortcode:
[digistore_cart language=en netto tracking="kampagne 1"]

ZURÜCK NACH OBEN

4. Tipps und Tricks zum Digistore24-Warenkorb

Tipp 1: Zahlungspläne aller Produkte aneinander anpassen

Falls Sie Abo-Produkte oder Ratenzahlung-Produkte haben, sollten alle Produkte die gleichen Abrechnungsintervalle haben, z.B. monatlich und jährlich (unter Konto-Produkte in den Produkt-Details im Tab "Zahlungspläne" einstellbar).

Bei allen Produkten sollte gleich eingestellt sein, ob die MwSt. im Preis enthalten ist oder nicht. Entweder Sie legen das über die Warenkorb-Einstellungen fest (wie weiter oben erklärt), oder Sie ändern diese Einstellung manuell bei all Ihren Produkten unter Konto > Produkte > in den Produkt-Details > im Tab "Zahlungspläne". Dort finden Sie diese Einstellung unter "Alle Preise sind ...".

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

Falls Ihr Web-Designer den Warenkorb gestalten wird, möchte er die diversen Fenster dauerhaft anzeigen lassen, um sie besser umgestalten zu können. Dazu kann er zu der URL, auf welcher der Warenkorb eingebaut wurde, folgende Option hinzufügen: ?ds24debug, z.B. https://www.domain.com?ds24debug.

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

Wenn Sie Ihre Webseite flexibler gestalten möchten, kann man mit der Javascript-Funktion ds24cart_add() Produkte zum Warenkorb hinzufügen, z. B.:

  • 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

Um den Warenkorb anzuzeigen, verwenden Sie ds24cart_show( button ).

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

ZURÜCK NACH OBEN

Aktualisiert am 8. März 2018

War dieser Artikel hilfreich?

Relevante Artikel