Modul SmartCheckout¶

Mit dem Modul SmartCheckout legen Sie Warenkorb, Kundendaten, Versandart, Zahlungsart und Zusammenfassung auf eine einzige Seite. Ihre Kunden sehen alle Schritte der Bestellung auf einen Blick und schließen sie ohne Seitenwechsel ab. Jede Änderung, etwa an der Menge, dem Lieferland oder der Versandart, schickt der Browser an den Shop, der mit der regulären Kalkulation neu rechnet. Die Zusammenfassung zeigt deshalb immer die richtigen Preise, Versandkosten und Steuern.

Der SmartCheckout ersetzt das frühere Modul EinSeitenCheckout.

Voraussetzungen¶

Ein Browser mit aktiviertem JavaScript.
Das Modul ist Bestandteil von wpShopGermany und benötigt keine eigene Lizenz.

Einrichten¶

Öffnen Sie wpShopGermany → Konfiguration → Module und wählen Sie in der Gruppe „Bestellung“ das Modul SmartCheckout.
Stellen Sie Modul aktiviert auf „Ja“.
Wählen Sie bei Seite für den EinSeitenCheckout den Eintrag „Neu anlegen und zuordnen“ und klicken Sie auf Einstellungen speichern. Der Shop legt dann die Seite „Kasse“ an und bindet den Checkout dort ein.

Alternativ ordnen Sie eine bestehende Seite zu. Der Checkout wird automatisch in diese Seite eingebunden, ein Shortcode ist nicht nötig.

Einstellungen¶

Einstellung	Beschreibung
Seite für den EinSeitenCheckout	Die Seite, auf der der Checkout angezeigt wird. „Neu anlegen und zuordnen“ erstellt sie beim Speichern.
Aufteilung	Zweispaltig: Eingaben links, die Zusammenfassung läuft rechts mit (Standard). Einspaltig: Die Zusammenfassung steht unterhalb der Eingaben. Auf schmalen Bildschirmen wie Smartphone oder Tablet im Hochformat wird der Checkout immer einspaltig dargestellt.
Produktbilder im Warenkorb anzeigen	Zeigt zu jeder Warenkorbposition das Produktbild an (Standard: aktiv).

Solange das Modul aktiv ist, leitet der Shop die Warenkorbseite und die bisherigen Schritte Kasse, Versand/Zahlung und Zusammenfassung auf den SmartCheckout um. Links auf den Warenkorb in Menüs oder Widgets müssen Sie nicht ändern. Deaktivieren Sie das Modul, gilt sofort wieder der klassische Bestellablauf.

Der Checkout im Shop¶

Warenkorb¶

Im ersten Abschnitt sieht der Kunde alle Produkte im Warenkorb:

Menge ändern: über die Schaltflächen – und + oder durch direkte Eingabe. Der Preis der Position und die Zusammenfassung werden sofort aktualisiert. Bei mehr als einem Stück steht zusätzlich der Stückpreis unter dem Gesamtpreis.
Entfernen: nimmt die Position aus dem Warenkorb.
Gutscheincode: Das Feld erscheint, wenn das Modul Gutscheine aktiv ist. Eingelöste Gutscheine werden darunter aufgelistet und können wieder entfernt werden. Deckt ein Wertgutschein nur einen Teil ab, zeigt die Zusammenfassung zusätzlich den Betrag „Zu zahlen“.

Angaben anderer Module wie Lieferzeit, Füllmenge, Gewicht, Produktvariablen, das GARAN-Gewährleistungslabel oder der Link „Vertrag widerrufen“ (Widerrufsformular) erscheinen direkt an der jeweiligen Position.

Sind die Module Zubehörprodukte oder Warenkorbteaser aktiv, zeigt der SmartCheckout die vorgeschlagenen Produkte als kompakte Liste unter den Warenkorbpositionen. Mit „Hinzufügen“ legt der Kunde sie ohne Seitenwechsel in den Warenkorb.

Kundendaten¶

Im Abschnitt „Ihre Daten“ gibt der Kunde seine Anschrift ein. Welche Felder erscheinen und welche davon Pflicht sind, legen Sie wie gewohnt unter wpShopGermany → Konfiguration → Einstellungen → Kundendaten fest. Pflichtfelder sind mit einem * gekennzeichnet, auch eigene Kundenfelder werden übernommen.

Ändert der Kunde das Land, berechnet der Shop Versandkosten und Steuern sofort neu.

Weitere Module fügen sich an passender Stelle ein:

Kundenverwaltung: Anmeldung für Stammkunden und Anlegen eines Kundenkontos.
wpNewsletterGermany und Trusted Shops: Zustimmungen innerhalb der Kundendaten.
Lieferadresse und Bestellvariablen: eigener Abschnitt unter den Kundendaten.

Versandart und Zahlungsart¶

In den Abschnitten „Versandart“ und „Zahlungsart“ stehen alle Versand- und Zahlungsarten, die für den aktuellen Warenkorb und das gewählte Land verfügbar sind, jeweils mit Logo, Hinweistext und Gebühr. Die Auswahl wird sofort in die Zusammenfassung übernommen.

Zahlungsarten mit eigenen Eingabefeldern, zum Beispiel Kreditkarte oder Bankeinzug, zeigen ihre Felder direkt in der Auswahl an.

Zahlungsanbieter wie PayPal oder AmazonPay arbeiten im SmartCheckout wie im klassischen Ablauf: Nach dem Absenden der Bestellung wird der Kunde zur Bezahlseite des Anbieters weitergeleitet.

Beim Modul PayPal PLUS gilt: Ist dort Zahlung vor Bestellabschluss autorisieren aktiv, lautet der Bestellbutton bei gewählter PayPal-Zahlung „Mit PayPal bezahlen“. Die Zahlungsauswahl von PayPal PLUS und der Button „Direkt zu PayPal“ stehen im SmartCheckout nicht zur Verfügung, PayPal erscheint dort als normale Zahlungsart.

Zusammenfassung und Bestellabschluss¶

Die Zusammenfassung zeigt Zwischensumme, Rabatte, Gutscheine, Versandkosten, Zahlungsgebühr, Netto- und Bruttobetrag sowie die enthaltene Mehrwertsteuer. Bei Kleinunternehmern entfällt der Steuerausweis, stattdessen erscheint der entsprechende Hinweis.

Unter den Beträgen bestätigt der Kunde die AGB und die Widerrufsbelehrung. Ist das Modul Bestellbedingungen aktiv, erscheinen stattdessen Ihre eigenen Bedingungen. Bedingungen, die an bestimmten Produkten oder Versandarten hängen, blendet der SmartCheckout automatisch ein, sobald sie zutreffen.

Mit „zahlungspflichtig bestellen“ schließt der Kunde die Bestellung ab. Während die Bestellung übermittelt wird, ist der Button gesperrt, ein doppeltes Absenden ist damit ausgeschlossen. Danach folgt die gewohnte Abschlussseite bzw. die Weiterleitung zum Zahlungsanbieter.

GARAN-Gewährleistungslabel¶

Führt Ihr Shop Produkte mit GARAN-Gewährleistungslabel, zeigt der SmartCheckout den gesetzlichen Hinweis zur Gewährleistung so an, wie Sie es unter Widerruf/Gewährleistung festgelegt haben: entweder als Hinweisfenster, das der Kunde mit „Zur Kenntnis genommen“ bestätigt, oder als Label direkt über dem Bestellbutton, das sich per Klick vergrößern lässt.

Fehlende oder fehlerhafte Angaben¶

Fehlt beim Absenden eine Pflichtangabe oder ist sie fehlerhaft, bleibt der Kunde auf dem SmartCheckout. Oben erscheint ein Hinweis, das betroffene Feld ist rot markiert. Alle übrigen Eingaben bleiben erhalten. Das gilt auch für nicht bestätigte AGB oder Bestellbedingungen sowie für eine fehlende Versand- oder Zahlungsart.

Leere Pflichtfelder meldet in der Regel schon der Browser, bevor die Bestellung abgeschickt wird.

Darstellung anpassen¶

Der SmartCheckout übernimmt Schrift und Farben Ihres Themes. Für eigene Anpassungen stehen im Stylesheet CSS-Variablen auf dem Element .wpsg_smartcheckout zur Verfügung, zum Beispiel:

Variable	Bedeutung
`--sc-u`	Basisgröße, aus der alle Abstände und Schriftgrößen berechnet werden (Vorgabe `1rem`). Hilfreich bei Themes, die die Schriftgröße von `html` verändern.
`--sc-accent`	Akzentfarbe, Vorgabe ist die Textfarbe des Themes
`--sc-error`	Farbe für Fehlermarkierungen
`--sc-line`	Farbe der Rahmen und Trennlinien
`--sc-radius`	Eckenradius von Feldern und Kästen

Beispiel für das Customizer-CSS oder das Stylesheet Ihres Themes:

.wpsg_smartcheckout { --sc-accent:#0a7c3e; --sc-radius:6px; }

Das Template mods/mod_smartcheckout/checkout.phtml lässt sich wie alle wpShopGermany-Templates im Theme unter wpsg_views/ überschreiben (siehe Templates).

Häufige Fragen¶

Der Warenkorb führt nicht auf den SmartCheckout. Prüfen Sie, ob das Modul aktiv ist und in den Moduleinstellungen eine Seite zugeordnet ist. Die Umleitung greift nur beim normalen Aufruf der Warenkorbseite.

Auf der Checkout-Seite erscheint nichts oder nur ein Hinweis auf JavaScript. Der SmartCheckout benötigt JavaScript. Ist es aktiviert, prüfen Sie, ob ein Optimierungs- oder Cache-Plugin die Skripte der Seite zusammenfasst oder verzögert lädt, und nehmen Sie die Checkout-Seite davon aus.

Eine Versand- oder Zahlungsart fehlt in der Auswahl. Es werden nur Versand- und Zahlungsarten angezeigt, die für das gewählte Land und den aktuellen Warenkorb freigegeben sind. Prüfen Sie die Einstellungen der jeweiligen Versand- bzw. Zahlungsart und die erlaubten Versand- und Zahlungsarten am Produkt.

Kann ich wieder zum klassischen Bestellablauf zurück? Ja. Deaktivieren Sie das Modul SmartCheckout, dann gilt sofort wieder der klassische Ablauf mit Warenkorb, Kasse, Versand/Zahlung und Zusammenfassung.