Shopify-Integration

Integrieren Sie Zenovay mit Ihrem Shopify-Shop für umfassende E-Commerce-Analysen, Umsatzverfolgung und Kundenreise-Erkenntnisse.

Installation

Theme-Installation

1. Gehen Sie zu Online Store -> Themes
2. Klicken Sie auf „Actions" -> „Edit code"
3. Suchen Sie theme.liquid
4. Fügen Sie vor </head> hinzu:

<script
  defer
  data-tracking-code="YOUR_TRACKING_CODE"
  src="https://api.zenovay.com/z.js">
</script>

Google Tag Manager

Falls Sie GTM verwenden:

1. Erstellen Sie einen neuen Custom HTML Tag
2. Fügen Sie das Zenovay-Skript-Tag hinzu
3. Trigger auf All Pages

Automatisches E-Commerce-Tracking

Verfolgbare Ereignisse

Diese Ereignisse können mit den folgenden Snippets erfasst werden:

• Produktaufrufe
• Zum Warenkorb hinzufügen
• Aus dem Warenkorb entfernen
• Checkout eingeleitet
• Zahlungsinformationen hinzugefügt
• Kauf abgeschlossen
• Umsatz zugeordnet

Erfasste Events

Event	Wann
view_product	Produktseite aufgerufen
add_to_cart	Artikel zum Warenkorb hinzugefügt
remove_from_cart	Artikel entfernt
begin_checkout	Checkout gestartet
add_payment_info	Zahlung eingegeben
purchase	Bestellung abgeschlossen

Manuelles Umsatz-Tracking

Bestellstatusseite

Fügen Sie unter Einstellungen → Checkout → Bestellstatusseite hinzu:

{% if first_time_accessed %}
<script>
if (window.zenovay) {
  zenovay('revenue', {{ total_price | money_without_currency | remove: ',' }}, '{{ currency }}', {
    order_id: '{{ order.name }}',
    shipping: {{ shipping_price | money_without_currency | remove: ',' }},
    tax: {{ tax_price | money_without_currency | remove: ',' }},
    items: [
      {% for item in line_items %}
      {
        id: '{{ item.sku | default: item.product_id }}',
        name: '{{ item.title | escape }}',
        price: {{ item.final_price | money_without_currency | remove: ',' }},
        quantity: {{ item.quantity }}
      }{% unless forloop.last %},{% endunless %}
      {% endfor %}
    ]
  });
}
</script>
{% endif %}

Produktseiten-Tracking

Fügen Sie zum Produkt-Template hinzu:

<script>
document.addEventListener('DOMContentLoaded', function() {
  if (window.zenovay) {
    zenovay('track', 'view_product', {
      product_id: '{{ product.id }}',
      product_name: '{{ product.title | escape }}',
      price: {{ product.price | money_without_currency | remove: ',' }},
      category: '{{ product.type | escape }}',
      variant: '{{ product.selected_or_first_available_variant.title | escape }}'
    });
  }
});
</script>

Warenkorb-Tracking

Für Ajax-Warenkörbe fügen Sie zum Theme-JavaScript hinzu:

// Auf Warenkorb-Aktualisierungen lauschen
document.addEventListener('cart:added', function(event) {
  if (window.zenovay && event.detail) {
    const item = event.detail;
    zenovay('track', 'add_to_cart', {
      product_id: item.product_id,
      variant_id: item.variant_id,
      product_name: item.product_title,
      price: item.price / 100,
      quantity: item.quantity
    });
  }
});

Kundenidentifikation

Nach dem Checkout

{% if customer %}
<script>
if (window.zenovay) {
  zenovay('identify', '{{ customer.id }}', {
    email: '{{ customer.email }}',
    name: '{{ customer.name | escape }}',
    orders_count: {{ customer.orders_count }},
    total_spent: {{ customer.total_spent | money_without_currency | remove: ',' }}
  });
}
</script>
{% endif %}

Kontoseiten

Fügen Sie zu den Kunden-Templates hinzu:

{% if customer %}
<script>
if (window.zenovay) {
  zenovay('identify', '{{ customer.id }}', {
    email: '{{ customer.email }}',
    name: '{{ customer.name | escape }}'
  });
}
</script>
{% endif %}

Shopify Plus-Funktionen

Checkout-Erweiterbarkeit

Für den Shopify Plus-Checkout:

// checkout.js
import { extension } from '@shopify/checkout-ui-extensions';

export default extension('Checkout::Dynamic::Render', (root, api) => {
  // Checkout-Events erfassen
  if (window.zenovay) {
    zenovay('track', 'checkout_step', {
      step: api.step,
      total: api.cost.totalAmount.amount
    });
  }
});

Scripts Editor

Für Plus-Shops verwenden Sie Scripts:

# Mit benutzerdefinierten Attributen erfassen
Output.cart.attributes["zenovay_session"] = Input.cart.token

Ziel-Einrichtung

Kauf-Ziel

Manuelle Einrichtung:

1. Gehen Sie zu Zenovay → Goals
2. Erstellen Sie das Ziel „Purchase"
3. Typ: Event
4. Event-Name: purchase

Warenkorb-Ziel

1. Erstellen Sie das Ziel „Add to Cart"
2. Typ: Event
3. Event-Name: add_to_cart

Newsletter-Anmeldung

Shopify-Newsletter-Formulare erfassen:

<script>
document.querySelector('[data-newsletter-form]')?.addEventListener('submit', function() {
  if (window.zenovay) {
    zenovay('goal', 'newsletter_signup');
  }
});
</script>

Conversion-Funnel

Standard-E-Commerce-Funnel

Produktansicht    100%
    ↓
Zum Warenkorb     15%
    ↓
Checkout           8%
    ↓
Kauf               4%

Funnel einrichten

1. Gehen Sie zu Funnels → Erstellen
2. Fügen Sie Schritte hinzu:
   • view_product
   • add_to_cart
   • begin_checkout
   • purchase
3. Speichern und analysieren

Mehrwährungsunterstützung

In der Währung des Kunden erfassen

<script>
if (window.zenovay) {
  zenovay('revenue', {{ total_price | money_without_currency | remove: ',' }}, '{{ cart.currency.iso_code }}');
}
</script>

Berichtswährung

In den Zenovay-Einstellungen festlegen:

• Primäre Währung für Berichte
• Automatische Umrechnung wird angewendet

Headless Shopify

Hydrogen/Oxygen

// In Ihrer Bestellbestätigungs-Komponente
import { useEffect } from 'react';

export function OrderConfirmation({ order }) {
  useEffect(() => {
    if (window.zenovay) {
      window.zenovay('revenue', parseFloat(order.totalPrice.amount), order.totalPrice.currencyCode, {
        order_id: order.id,
        items: order.lineItems.map(item => ({
          id: item.variant.sku,
          name: item.title,
          price: parseFloat(item.variant.price.amount),
          quantity: item.quantity
        }))
      });
    }
  }, [order]);

  return <div>Vielen Dank!</div>;
}

Storefront API

Bei Verwendung der Storefront API:

// Nach erfolgreichem Checkout
const response = await fetch('/api/checkout', {
  method: 'POST',
  body: JSON.stringify(checkoutData)
});

const order = await response.json();

// In Zenovay erfassen
zenovay('revenue', order.total, order.currency, {
  order_id: order.id
});

Konfigurationsoptionen

Konfigurationsoptionen

Einstellung	Beschreibung
Website ID	Ihre Zenovay-Tracking-ID
Track products	Produktansichts-Events aktivieren
Track cart	Warenkorb-Hinzufügen/Entfernen-Events
Track checkout	Checkout-Funnel-Events
Track orders	Kaufabschluss
Exclude staff	Mitarbeiterbesuche nicht erfassen

Datenschutzeinstellungen

Einstellung	Beschreibung
IP anonymization	Besucher-IPs maskieren
Cookie consent	Auf Einwilligung warten
DNT respect	Do Not Track beachten

Fehlerbehebung

Events werden nicht erfasst

Überprüfen Sie:

• Tracking-Script in theme.liquid eingefügt
• Website-ID korrekt
• Nicht als Mitarbeiter angemeldet (falls ausgeschlossen)
• Browser-Konsole auf Fehler prüfen

Umsatz stimmt nicht überein

Überprüfen Sie:

• Währungseinstellungen
• Steuer-/Versandeinbeziehung
• Rückerstattungsbehandlung
• Testbestellungs-Tracking

Checkout wird nicht erfasst

Für Checkouts:

• Script muss im Checkout vorhanden sein
• Shopify Plus benötigt möglicherweise benutzerdefinierte Einrichtung
• Mit echtem Checkout testen

Theme-Kompatibilität

Funktioniert mit:

• Dawn
• Debut
• Brooklyn
• Allen 2.0-Themes
• Den meisten benutzerdefinierten Themes

Testen

Testmodus

Testmodus aktivieren:

1. ?zenovay_debug=true zur URL hinzufügen
2. Konsole auf Events überprüfen
3. Datenstruktur verifizieren

Testbestellung

1. Testmodus aktivieren
2. Checkout abschließen
3. In Zenovay-Echtzeit überprüfen
4. Umsatzzuordnung prüfen

Nächste Schritte

• E-Commerce-Umsatz-Leitfaden
• Conversion-Funnels
• Umsatz nach Quelle