Pixelflow
Fortgeschrittene Funktionen

Webflow-eCommerce-Events automatisch tracken

Übersicht

PixelFlow kann automatisch Produkt- und Transaktionsdaten von Ihren Webflow-eCommerce-Checkout- und Bestellbestätigungsseiten extrahieren und angereicherte Event-Daten an Meta senden. Dies macht die manuelle Konfiguration von Event-Parametern überflüssig und gewährleistet ein genaues Tracking Ihrer eCommerce-Conversions.

Wenn Sie die automatische Datenextraktion für „Initiate Checkout“- oder „Purchase“-Events aktivieren, erfasst PixelFlow automatisch die Währung, die Anzahl der Artikel, den Transaktionswert und andere eCommerce-Daten direkt aus Ihrem Webflow-Checkout-Prozess.

Webflow eCommerce verfügt über ein integriertes Event-Tracking, das jedoch nur clientseitig erfolgt, was bedeutet, dass bis zu 30-40 % der Ereignisse nicht erfasst werden. Das Webflow-eCommerce-Event-Tracking von PixelFlow kombiniert Client- und Serverseite für eine bessere Datengenauigkeit in Ihren Facebook-Anzeigen.

Voraussetzungen

  • PixelFlow ist auf Ihrer Webflow-Seite installiert und konfiguriert (siehe Webflow-Einrichtung)

  • Aktiver Webflow-eCommerce-Plan mit aktiviertem Checkout

  • Standard-Webflow-eCommerce-Checkout-Seiten (kein eigenständig entwickelter Checkout)

Kompatibilität

Diese Funktion funktioniert mit:

  • Webflow eCommerce: Nur Standard-Checkout- und Bestellbestätigungsseiten

  • Unterstützte Events: „Initiate Checkout“ und „Purchase“ Events

  • URL-Anforderungen: URLs müssen /checkout (für Initiate Checkout) oder /order-confirmation (für Purchase) enthalten

Nur Standardseiten: Die automatische Datenextraktion ist für den Standard-eCommerce-Checkout-Flow von Webflow konzipiert. Benutzerdefinierte Checkout-Seiten unterstützen diese Funktion nicht.

Welche Daten werden automatisch extrahiert?

Je nachdem, welches Event Sie tracken, extrahiert PixelFlow unterschiedliche Daten:

Für Initiate Checkout Events

Wenn jemand den Checkout-Prozess beginnt, erfasst PixelFlow automatisch:

  • currency — Der Währungscode (z. B. USD, EUR, GBP)

  • num_items — Gesamtzahl der Artikel im Warenkorb

  • value — Gesamtwert des Warenkorbs

Für Purchase Events

Wenn jemand einen Kauf abschließt, erfasst PixelFlow automatisch:

  • content_type — Art des gekauften Inhalts (product)

  • currency — Der Währungscode

  • num_items — Gesamtzahl der gekauften Artikel

  • value — Gesamter Transaktionswert

Höhere Event-Match-Qualität: Angereicherte Events mit genauen Transaktionsdaten verbessern Ihren Score für die Event-Match-Qualität im Meta Events Manager, was zu einer besseren Anzeigenoptimierung und Attribution führt.

So aktivieren Sie die automatische Datenextraktion in Webflow

Schritt 1: Navigieren Sie zu Ihrem PixelFlow-Dashboard

  1. Melden Sie sich in Ihrem PixelFlow-Dashboard an

  2. Navigieren Sie zur Seite Overview (dies sollte Ihre Standard-Startseite sein)

  3. Suchen Sie den Abschnitt Events URLs auf dem Dashboard

Schritt 2: Eine Event-URL hinzufügen

  1. Klicken Sie im Abschnitt „Events URLs“ auf die Schaltfläche + Add URL

  2. Geben Sie im erscheinenden Modal „Add Event URL“ Ihre Checkout- oder Bestellbestätigungs-URL ein:

    • Für das Checkout-Tracking: Geben Sie Ihre Checkout-Seiten-URL ein (z. B. yoursite.com/checkout)

    • Für das Kauf-Tracking: Geben Sie Ihre Bestellbestätigungs-Seiten-URL ein (z. B. yoursite.com/order-confirmation)

Webflows Standard-URL-Struktur: Standardmäßig verwendet Webflow /checkout für die Checkout-Seite und /order-confirmation für die Bestellbestätigungsseite. Dies sind reservierte Slugs in Webflow eCommerce.

Schritt 3: Wählen Sie Ihr Event aus

  1. Klicken Sie im Modal auf das Dropdown-Menü Event

  2. Wählen Sie entweder:

    • Initiate Checkout — Für Ihre Checkout-Seite (/checkout)

    • Purchase — Für Ihre Bestellbestätigungsseite (/order-confirmation)

Schritt 4: Automatische Datenextraktion aktivieren

  1. Sobald Sie eine gültige URL eingegeben und ein Event ausgewählt haben, erscheint der Schalter "Extract data automatically?"

  2. Stellen Sie den Schalter "Extract data automatically?" auf ON (nach rechts geschaltet)

Schalter erscheint automatisch: Die Option „Extract data automatically?“ erscheint nur, wenn Sie eine URL eingegeben haben, die /checkout oder /order-confirmation enthält, und den entsprechenden Event-Typ ausgewählt haben.

Schritt 5: Webflows integriertes Tracking blockieren (Empfohlen)

Wenn Sie die automatische Datenextraktion aktivieren, erscheint ein zweiter Schalter: "Block external tracking?"

  1. Stellen Sie sicher, dass "Block external tracking?" auf ON geschaltet ist (dies ist die Standardeinstellung)

Doppelte Events verhindern: Webflow eCommerce verfügt über ein integriertes Meta-Event-Tracking-System, das dieselben Events clientseitig sendet. Wenn „Block external tracking?“ aktiviert bleibt, wird verhindert, dass doppelte Events an Meta gesendet werden. Wenn Sie diesen Schalter deaktivieren, sehen Sie doppelte Purchase- und Initiate Checkout-Events im Meta Events Manager.

Schritt 6: Konfiguration speichern

  1. Klicken Sie unten rechts im Modal auf die Schaltfläche Add URL, um zu speichern

  2. Ihre Event-URL wird der Tabelle „Events URLs“ hinzugefügt

Automatische Skript-Updates: Nachdem Sie Ihr Skript hinzugefügt haben, wird es automatisch aktualisiert, um neue Änderungen zu übernehmen. Neue Website-Besucher erhalten das Update sofort, bestehende Besucher innerhalb von bis zu 5 Minuten (wenn der Skript-Cache ungültig wird). Von Ihrer Seite ist keine weitere Aktion erforderlich. Wenn Sie Ihr Skript jedoch vor dem 27. November 2024 hinzugefügt haben, müssen Sie es ein letztes Mal auf die neueste Version aktualisieren, die sich künftig selbst aktualisiert.

Einrichtung abgeschlossen! PixelFlow extrahiert nun automatisch eCommerce-Daten von Ihren Webflow-Checkout- und Bestellbestätigungsseiten und sendet angereicherte Events an Meta.

Einrichtung überprüfen

Testen Sie nach der Veröffentlichung Ihrer Website die automatische Datenextraktion:

  1. Öffnen Sie Ihre Live-Website in einem neuen Browserfenster oder im Inkognito-Modus

  2. Legen Sie ein Produkt in den Warenkorb und fahren Sie mit dem Checkout fort (für das Initiate Checkout Event)

  3. Schließen Sie einen Testkauf ab (für das Purchase Event)

  4. Überprüfen Sie Ihr PixelFlow-Dashboard unter Events oder Analytics innerhalb von 2-3 Minuten

  5. Überprüfen Sie, ob das Event die extrahierten Daten enthält:

    • Stellen Sie sicher, dass currency, num_items und value befüllt sind

    • Prüfen Sie bei Purchase-Events, ob auch content_type enthalten ist

  6. Öffnen Sie den Facebook Events Manager und bestätigen Sie, dass die Events mit angereicherten Daten erscheinen

Detaillierte Schritte zur Überprüfung finden Sie unter So testen und verifizieren Sie Ihr PixelFlow CAPI-Setup.

Fehlerbehebung

Symptom

Wahrscheinliche Ursache

Lösung

Schalter „Extract data automatically?“ erscheint nicht

URL enthält kein /checkout oder /order-confirmation oder falsches Event ausgewählt

Überprüfen Sie, ob Ihre URL den korrekten Pfad enthält und Sie entweder das Initiate Checkout- oder das Purchase-Event ausgewählt haben

Keine eCommerce-Daten im Event-Payload

Automatische Extraktion nicht aktiviert oder Skript nicht aktualisiert

Stellen Sie sicher, dass der Schalter auf ON steht, kopieren Sie das neue Skript, aktualisieren Sie den Custom Code und veröffentlichen Sie Ihre Seite neu

Doppelte Purchase- oder Initiate Checkout-Events in Meta

Schalter „Block external tracking?“ ist auf OFF

Aktivieren Sie „Block external tracking?“ im Event-URL-Modal erneut, kopieren Sie das aktualisierte Skript und veröffentlichen Sie neu

Events werden getrackt, aber Währung/Wert sind falsch

Währungseinstellungen in Webflow entsprechen nicht Ihrer Shop-Konfiguration

Überprüfen Sie Ihre Webflow-eCommerce-Einstellungen und stellen Sie sicher, dass die richtige Währung für Ihre Produkte eingestellt ist

Events erscheinen nicht im PixelFlow-Dashboard

Skript nicht aktualisiert oder Seite nicht neu veröffentlicht

Überprüfen Sie, ob das aktualisierte Skript im Bereich Custom Code > Head Code von Webflow steht, und veröffentlichen Sie Ihre Seite neu

Einschränkungen

  • Nur Standard-Checkout: Die automatische Extraktion funktioniert ausschließlich mit den Standard-eCommerce-Checkout-Seiten von Webflow, nicht mit benutzerdefinierten Checkout-Flows

  • Nur zwei Events: Die Funktion ist nur für Initiate Checkout- und Purchase-Events verfügbar – andere Events (Add to Cart, View Content usw.) unterstützen keine automatische Extraktion

  • Anforderungen an den URL-Pfad: URLs müssen /checkout für Initiate Checkout oder /order-confirmation für Purchase enthalten, um die Funktion zu aktivieren

  • Alles-oder-nichts-Extraktion: Sie können nicht manuell auswählen, welche Datenfelder extrahiert werden – das Aktivieren des Schalters extrahiert automatisch alle verfügbaren eCommerce-Daten

Nächste Schritte

Nachdem Sie das automatische eCommerce-Tracking eingerichtet haben, können Sie:

Hilfe erhalten

Wenn Sie Probleme mit dem automatischen eCommerce-Tracking haben:

  • Stellen Sie sicher, dass Sie die Standard-Checkout-Seiten von Webflow verwenden (kein Custom Checkout)

  • Bestätigen Sie, dass der Schalter „Extract data automatically?“ erscheint und aktiviert ist

  • Überprüfen Sie, ob Sie das Skript im Custom Code aktualisiert und Ihre Seite neu veröffentlicht haben

  • Verwenden Sie die Browser-Entwicklertools (F12), um zu prüfen, ob das PixelFlow-Skript korrekt geladen wird

Für zusätzlichen Support:

Wenn Sie den Support kontaktieren, geben Sie bitte Folgendes an:

  • Ihre Webflow-Website-URL

  • Screenshots Ihrer Event-URL-Konfiguration in der PixelFlow-App

  • Ob der Schalter „Extract data automatically?“ sichtbar und aktiviert ist

  • Beispiel-Event-Payloads aus dem PixelFlow-Dashboard oder dem Facebook Events Manager

War das hilfreich?