Intégration Shopify

Intégrez Zenovay à votre boutique Shopify pour une analyse complète du e-commerce, un suivi des revenus et des insights sur le parcours client.

Installation

Installation du thème

1. Allez à Online Store -> Themes
2. Cliquez sur « Actions » -> « Edit code »
3. Trouvez theme.liquid
4. Ajoutez avant </head> :

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

Google Tag Manager

Si vous utilisez GTM :

1. Créez une nouvelle balise Custom HTML
2. Ajoutez la balise script Zenovay
3. Déclenchez sur All Pages

Suivi e-commerce automatique

Événements suivables

Ces événements peuvent être suivis à l'aide des extraits ci-dessous :

• Vues de produit
• Ajout au panier
• Retrait du panier
• Début de paiement
• Informations de paiement ajoutées
• Achat complété
• Attribution des revenus

Événements suivis

Événement	Déclencheur
view_product	Page produit vue
add_to_cart	Article ajouté au panier
remove_from_cart	Article retiré
begin_checkout	Paiement démarré
add_payment_info	Paiement saisi
purchase	Commande complétée

Suivi manuel des revenus

Page de statut de commande

Ajoutez dans Paramètres → Paiement → Page de statut de commande :

{% 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 %}

Suivi des pages produit

Ajoutez au template produit :

<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>

Suivi de l'ajout au panier

Pour les paniers Ajax, ajoutez dans le JavaScript du thème :

// Écouter les mises à jour du panier
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
    });
  }
});

Identification des clients

Après le paiement

{% 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 %}

Pages de compte

Ajoutez aux templates client :

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

Fonctionnalités Shopify Plus

Checkout Extensibility

Pour le paiement Shopify Plus :

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

export default extension('Checkout::Dynamic::Render', (root, api) => {
  // Suivre les événements de paiement
  if (window.zenovay) {
    zenovay('track', 'checkout_step', {
      step: api.step,
      total: api.cost.totalAmount.amount
    });
  }
});

Configuration des objectifs

Objectif d'achat

Configuration manuelle :

1. Accédez à Zenovay → Objectifs
2. Créez l'objectif « Achat »
3. Type : Événement
4. Nom de l'événement : purchase

Objectif Ajout au panier

1. Créez l'objectif « Ajout au panier »
2. Type : Événement
3. Nom de l'événement : add_to_cart

Inscription à la newsletter

Suivez les formulaires Shopify :

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

Entonnoir de conversion

Entonnoir e-commerce standard

Vue produit      100%
    ↓
Ajout au panier   15%
    ↓
Paiement           8%
    ↓
Achat              4%

Configuration de l'entonnoir

1. Accédez à Entonnoirs → Créer
2. Ajoutez les étapes :
   • view_product
   • add_to_cart
   • begin_checkout
   • purchase
3. Enregistrez et analysez

Support multi-devises

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

Shopify Headless (Hydrogen/Oxygen)

// Dans votre composant de confirmation de commande
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>Merci pour votre commande !</div>;
}

Options de configuration

Paramètre	Description
ID du site web	Votre ID de suivi Zenovay
Suivre les produits	Activer les événements de vue produit
Suivre le panier	Événements d'ajout/retrait au panier
Suivre le paiement	Événements de l'entonnoir de paiement
Suivre les commandes	Achats complétés
Exclure le personnel	Ne pas suivre les visites du personnel

Dépannage

Événements non suivis

Vérifiez :

• Script de suivi ajouté à theme.liquid
• ID du site web correct
• Non connecté en tant que personnel (si exclu)
• Console du navigateur sans erreurs

Revenus ne correspondant pas

Vérifiez :

• Paramètres de devise
• Inclusion des taxes/frais de livraison
• Gestion des remboursements
• Suivi des commandes de test

Test

Mode debug

Activez le mode debug :

1. Ajoutez ?zenovay_debug=true à l'URL
2. Consultez la console pour les événements
3. Vérifiez la structure des données

Prochaines étapes

• Guide des revenus e-commerce
• Entonnoirs de conversion
• Revenus par source