✨ Neu: One-Page-Checkout - Beim Technik-Template kostenfrei enthalten! Mehr erfahren

One-Page-Checkout – Einrichtung und Schnellstart

Auf dieser Seite

Dieser Artikel führt Sie nach der Installation Schritt für Schritt durch die wichtigsten Einrichtungsschritte, inklusive der Anleitungen für den optionalen Google-Schlüssel und für Cloudflare Turnstile.

Schnellstart-Checkliste

  1. Plugin aktivieren: Tab „Einstellungen" → Gruppe „Plugin-Einstellungen" → „Plugin aktiv" auf „An" (oder zunächst „Nur für eingeloggte Admins (Testbetrieb)", siehe Artikel „Überblick und Installation").
  2. Darstellung prüfen: Tab „Darstellung" öffnen und Farben, Radien, Schriftart und Logo-Position an Ihr Corporate Design anpassen, oder die Auslieferungswerte belassen.
  3. Zahlungsarten prüfen: Tab „PayPal-Status" öffnen, um zu sehen, ob PayPal Commerce erkannt wurde. Für Klarna, Mollie, VR Payment, Amazon Pay oder DHL Wunschpaket die jeweiligen Plugins installieren und konfigurieren, sofern gewünscht.
  4. Footer-Selektoren prüfen: Nach der Installation den Checkout einmal aufrufen. Ist der ursprüngliche Theme-Footer noch sichtbar, die CSS-Selektoren unter „CSS-Selektoren zum Ausblenden (Footer)" an Ihr Theme anpassen.
  5. Standard-Versandart wählen (optional): Unter „Standard-Versandart im Checkout" eine bevorzugte Versandart vorauswählen lassen, sobald sie zulässig ist.
  6. Google-Adress-Vervollständigung einrichten (optional): siehe Anleitung unten.
  7. Kontaktformular und Cloudflare Turnstile einrichten (optional, auch Voraussetzung für die Einwilligungs-Checkbox der Warenkorb-Erinnerung bei Gästen): siehe Anleitung unten.
  8. Warenkorb-Erinnerung einrichten (optional): Tab „Einstellungen" → Gruppe „Erinnerungs-Einstellungen" → „Warenkorb-Erinnerungen aktivieren" auf „An"; Details im Artikel „Warenkorb-Erinnerung".
  9. Checkout-Statistik prüfen: Die Aufzeichnung ist ab Werk eingeschaltet (Einstellung „Checkout-Statistik aufzeichnen"); nach einigen Tagen zeigt der Tab „Checkout-Statistik" erste Auswertungen.
  10. KI-Zugang einrichten (optional): Tab „Einstellungen" → Gruppe „Plugin-Einstellungen" → „KI-Auswertungs-API" auf „An", danach im Tab „KI-Zugang" einen Schlüssel erzeugen; Details im Artikel „KI-Zugang".

Google-Adress-Vervollständigung einrichten (optional)

Diese Funktion lässt Google beim Tippen im Straßenfeld passende Adressen vorschlagen und optional die eingegebene Adresse gegen Google prüfen. Ohne Schlüssel bleibt das Straßenfeld ein normales Eingabefeld; der Checkout funktioniert auch ohne diese Funktion vollständig.

  1. Bei Google anmelden: https://console.cloud.google.com/ öffnen und mit einem Google-Konto anmelden.
  2. Ein Projekt anlegen: Oben neben „Google Cloud" auf die Projektauswahl, dann „Neues Projekt" klicken, einen Namen vergeben (z. B. den Namen Ihres Shops) und „Erstellen" klicken.
  3. Zahlungsart hinterlegen: Links unter „Abrechnung" (Billing) eine Zahlungsart hinterlegen. Google verlangt das einmalig, auch wenn im Rahmen des monatlichen Gratis-Kontingents in der Regel keine Kosten entstehen.
  4. Benötigte Dienste einschalten: Unter „APIs und Dienste → Bibliothek" nacheinander „Maps JavaScript API", „Places API" und – nur bei Nutzung der Adressprüfung – „Address Validation API" aktivieren. Weitere Dienste werden nicht benötigt.
  5. Schlüssel erstellen: Unter „APIs und Dienste → Anmeldedaten" auf „Anmeldedaten erstellen" und „API-Schlüssel" klicken; den angezeigten Schlüssel kopieren.
  6. Schlüssel absichern: Im neuen Schlüssel unter „Anwendungseinschränkungen" die Option „Websites" wählen und die eigene(n) Domain(s) eintragen, z. B. https://www.ihr-shop.de/*. Unter „API-Einschränkungen" die Option „Schlüssel einschränken" wählen und nur die in Schritt 4 aktivierten Dienste ankreuzen. Speichern.
  7. Schlüssel im Shop eintragen: Im JTL-Backend unter „Plugins → SALEPIX One-Page-Checkout → Einstellungen" den Schlüssel in das Feld „Google Maps API-Schlüssel" eintragen und „Adresse als Google-Suchfeld" und/oder „Adressen gegen Google prüfen" auf „An" stellen. Speichern.

Google stellt monatlich ein Gratis-Kontingent bereit, das für kleine und mittlere Shops in der Regel ausreicht. Ein zusätzliches Tageslimit lässt sich in der Cloud Console unter „APIs und Dienste → Kontingente" festlegen, damit keine unerwartet hohen Kosten entstehen können.

Ohne aktiven JTL-Consent-Manager im Shop bleiben die Google-Adressdienste vollständig aus, auch wenn die Plugin-Einstellungen sie erlauben; Details dazu und zur datenschutzrechtlichen Einordnung stehen im Artikel „Darstellung und Zahlungsarten".

Kontaktformular und Cloudflare Turnstile einrichten (optional)

Das Kontaktformular im Checkout sowie die Einwilligungs-Checkbox der Warenkorb-Erinnerung bei Gästen setzen beide dieselben Cloudflare-Turnstile-Schlüssel voraus.

  1. Auf https://dash.cloudflare.com/sign-up ein kostenloses Cloudflare-Konto anlegen und die E-Mail-Adresse bestätigen.
  2. Im Cloudflare-Dashboard links auf „Turnstile" klicken, dann „Add Widget".
  3. Einen Widget-Namen vergeben (frei wählbar), die Domain(s) des Shops als „Hostnames" eintragen und als Widget-Modus „Managed (Recommended)" wählen. „Pre-Clearance" kann auf „Off" bleiben.
  4. Auf „Create" klicken. Cloudflare zeigt einen öffentlichen „Site Key" und einen geheimen „Secret Key" (beide beginnen mit 0x4AAAAAA…). Beide sofort kopieren – der Secret Key lässt sich später nur neu erzeugen, nicht erneut anzeigen.
  5. Im JTL-Backend unter „Plugins → SALEPIX One-Page-Checkout → Einstellungen" die beiden Schlüssel in „Cloudflare Turnstile: Site Key" und „Cloudflare Turnstile: Secret Key" eintragen.
  6. Nach Bedarf „Kontaktformular bei Checkout-Sackgasse" und/oder „Hilfe-/Kontakt-Link immer anzeigen" auf „An" stellen, optional Telefon- und/oder WhatsApp-Nummer hinterlegen, und speichern.

Am Server muss ausgehendes HTTPS zu challenges.cloudflare.com erlaubt sein, und in der php.ini muss allow_url_fopen = On gesetzt sein (bei den meisten Hostern Standard). Zum Testen: Footer-Link aktivieren, Checkout aufrufen, auf den Link „Frage zur Bestellung? Wir helfen gern." klicken, das Formular inklusive Turnstile-Widget ausfüllen und absenden – die Nachricht sollte danach an die im JTL-Kontaktformular hinterlegte Adresse gehen.

Bleibt das Captcha-Feld leer, meldet das Plugin die Ursache in der Entwicklerkonsole des Browsers mit dem Präfix [salepix_opc]. Typische Ursachen sind ein durch Werbeblocker oder Firewall blockiertes Turnstile-Skript, ein für die Domain nicht freigegebener oder falscher Site Key, oder eine vorübergehend gescheiterte Prüfung bei Cloudflare. Der eigentliche Bestellablauf läuft in jedem Fall unverändert weiter; betroffen sind ausschließlich Kontaktformular und die Einwilligungs-Checkbox der Warenkorb-Erinnerung.

Frage nicht beantwortet?

Unser Support hilft Ihnen gerne weiter – bitte nennen Sie Plugin- bzw. Template-Version und Ihre JTL-Shop-Version.