Installer sur Shopify

Ce que vous connectez

Les vues produit et les ajouts panier sont capturés par le Web Pixel sur tous les thèmes. L'app embed thème fournit le pont cookie de session et les analytics comportementales. Connectez l'app Shopify pour l'installation pixel en un clic et le reporting paiement → achat.

1. Configurer la confidentialité client Shopify

100 Rocks utilise Shopify Customer Privacy comme décision de traitement canonique avant la collecte comportementale. Aucune bannière 100 Rocks séparée n'est installée sur un thème Shopify en production.

1. Pour la bannière native Shopify : Admin Shopify → Paramètres → Confidentialité client, puis activez la bannière pour vos régions.
2. Si vous utilisez une app de consentement compatible, conservez-la active et vérifiez qu'elle synchronise les choix avec Shopify Customer Privacy.
3. Assurez des choix accepter/refuser analytics équivalents.
4. Aucun réglage de fournisseur de consentement n'est requis dans 100 Rocks.

2. Activer l'app embed dans le thème

Méthode recommandée. Le tracker est géré par Shopify et supprimé automatiquement à la désinstallation — aucun code résiduel dans vos fichiers de thème.

1. Admin Shopify → Boutique en ligne → Thèmes.
2. À côté de votre thème actif, cliquez sur Personnaliser.
3. Dans le panneau gauche, ouvrez App embeds (icône puzzle).
4. Repérez 100 Rocks Analytics et activez le bouton.
5. Cliquez sur Enregistrer en haut à droite.

Optionnel : ajouter le bloc page produit

Ajoutez le bloc page produit 100 Rocks si vous voulez afficher des variantes de page produit approuvées sur votre modèle produit live. Le bloc conserve une mise en page de secours, donc la page reste utilisable même sans test actif.

1. Admin Shopify → Boutique en ligne → Thèmes → Personnaliser.
2. Ouvrez un modèle produit.
3. Ajoutez le bloc app 100 Rocks Product page / PDP Container au modèle.
4. Choisissez la mise en page de secours à afficher lorsqu'aucun test n'est actif.
5. Enregistrez et prévisualisez une page produit avant publication.

Vérifier l'embed

Alternative (storefronts headless) : 100 Rocks → votre projet → Installation et statut → Manual theme snippet — copiez l'extrait production et collez-le avant </body> dans layout/theme.liquid.

1. Ouvrez la boutique en navigation privée.
2. Acceptez analytics dans la bannière compatible Shopify configurée.
3. Parcourez une ou deux pages.
4. Dans 100 Rocks → votre projet → Installation et statut : Tracker live / Receiving events = Yes.

3. Connecter l'app Shopify

OAuth connecte l'app 100 Rocks pour l'installation pixel en un clic et le cycle de vie de l'app embed thème.

L'achat est attribué uniquement via checkout_completed du Web Pixel — pas de webhook commande.

1. Dans 100 Rocks → votre projet → Installation et statut, configurez d'abord le fournisseur de consentement et l'app embed thème.
2. Développez 2. Commerce funnel — Web Pixel + Shopify app.
3. Cliquez sur Connect Shopify app (OAuth).
4. Vérifiez que le statut indique App connected.
5. N'utilisez pas Admin Shopify → Paramètres → Notifications → Webhooks (obsolète en 2026).

4. Web Pixel et confidentialité

Le Web Pixel s'exécute dans le sandbox Shopify. Configurez Customer privacy sur l'app 100 Rocks avant les événements checkout.

Réglages confidentialité (obligatoire)

Votre notice de confidentialité storefront doit mentionner 100 Rocks comme sous-traitant analytics, les catégories analytics activées, la conservation et la manière dont les visiteurs peuvent exercer leurs droits. Copiez et adaptez le texte standard dans Consentement et confidentialité. N'activez pas les analytics comportementales tant que la notice, le mécanisme de consentement et le DPA requis ne sont pas en place.

1. Admin Shopify → Paramètres → Apps et canaux de vente.
2. Ouvrez 100 Rocks → Customer privacy.
3. Permission : Required.
4. Finalités : cochez Analytics uniquement. Pas Marketing ni Preferences.
5. Data sale : Data collected does not qualify as data sale.
6. Enregistrez.

Installer le Web Pixel

1. Dans 100 Rocks → votre projet → Installation et statut, développez 2. Commerce funnel — Web Pixel + Shopify app.
2. Cliquez sur Install Web Pixel automatically (nécessite Connect Shopify app à l'étape 3).
3. Si l'installation automatique n'est pas disponible, développez Manual fallback, copiez l'extrait et collez-le dans Admin Shopify → Paramètres → Customer events → Custom pixels.
4. Enregistrez si vous avez utilisé le repli manuel.

Vérifier le pixel

1. Ajoutez un produit au panier et atteignez le paiement (paiement non requis).
2. Dans 100 Rocks → votre projet → Installation et statut, vérifiez Last pixel event — l'horodatage doit être récent.
3. L'achat apparaît dans l'entonnoir commerce lorsque le pixel envoie checkout_completed sur la même session pontée.

Paiement express (optionnel)

Les vues produit et ajouts panier standard ne nécessitent aucun markup thème — le Web Pixel les gère sur tous les thèmes. Pour Shop Pay ou Apple Pay sur la page produit, vous pouvez ajouter data-100rocks-commerce="express-checkout" sur le bouton.

Boutiques dev et test uniquement

N'utilisez pas l'installation Dev / test (footer loader) sur les thèmes acheteurs en production. Les boutiques production doivent utiliser l'app embed thème (ou l'extrait manuel si headless) avec un consentement synchronisé dans Shopify Customer Privacy.

Besoin d'aide ?

Voir Dépannage pour les problèmes d'installation et de données courants.

Voir Actions et CTA pour la détection automatique et le balisage facultatif des actions nommées.

Pour le consentement et les aspects légaux, voir Consentement et confidentialité.