Zum Hauptinhalt springen
Dieser Artikel erklärt, wie Sie konforme A/B-Tests im Shopify Plus-Checkout mit Kameleoon-Web-Experimenten, Shopify Cart-Attributen und Checkout UI Extensions durchführen.

Schritt 1: Eine Variation über ein Kameleoon-Web-Experiment zuweisen

Verwenden Sie auf Ihrer Warenkorbseite Kameleoon, um eine Variation zuzuweisen (zum Beispiel Variation A oder Variation B) und die Zuweisung in einem Cart-Attribut wie kameleoon-checkout-variant zu persistieren. Diese Zuweisung stellt sicher, dass der Checkout auf die Variation reagieren kann. Verwenden Sie den folgenden JavaScript-Code, um die Variation zuzuweisen und die Cart-Attribute zu aktualisieren:
const experimentId = 12345;
Kameleoon.API.Experiments.trigger(experimentId);
const experiment = Kameleoon.API.Experiments.getById(experimentId);
const variationName = experiment?.associatedVariation?.name;

if (variationName) {
    fetch('/cart/update.js', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({ attributes: { 'kameleoon-checkout-variant': variationName } }),
    });
}

Schritt 2: Verwenden Sie eine Shopify Checkout UI Extension

Verwenden Sie in Ihrer Shopify Plus Checkout UI Extension die React-API, um das Attribut kameleoon-checkout-variant zu lesen. Anschließend können Sie eine bedingte Komponente, wie z. B. ein Banner, nur für bestimmte Variations rendern.
const attributes = useAttributes();
const variant = attributes['kameleoon-checkout-variant'];

if (variant === 'Variation B') {
  return <Banner title="You unlocked free express shipping!" />;
}

Conversions auf der Dankeseite verfolgen

Um Conversions für Benutzer im Experiment auf der Bestellbestätigungsseite zu verfolgen, lesen Sie die Anleitung zu Shopify Checkout Conversions.

Zusammenfassung

  • Weisen Sie auf der Warenkorbseite eine Variation mit einem Kameleoon-Web-Experiment zu.
  • Aktualisieren Sie die Shopify Cart-Attribute, um die zugewiesene Variation zu persistieren.
  • Verwenden Sie eine Shopify Checkout UI Extension, um die Variation zu lesen und dynamische Inhalte zu rendern.
  • Verfolgen Sie Conversions auf der Dankeseite, indem Sie der Conversions-Anleitung folgen.
Diese Konfiguration entspricht den Richtlinien von Shopify Plus und ermöglicht valide Experimente im gesamten Checkout-Ablauf.