Introduction
Il est tout à fait possible d’intégrer votre propre plugin de tracking front-end à votre solution e‑commerce. Le premier bloc de code doit être ajouté à la page « Confirmation de commande », tandis que le second bloc doit être déployé sur des pages telles que « Liste de produits », « Détail du produit », etc. Il est extrêmement important de noter que le bloc de code suivant n’est pas une solution prête à l’emploi. Vous devez modifier les variables situées à droite en fonction de vos besoins spécifiques. Le snippet js doit s’exécuter uniquement sur la page de remerciement (page de confirmation de commande) après la création d’une commande :
// CE BLOC DE CODE EST DESTINÉ À LA PAGE DE CONFIRMATION DE COMMANDE
<script src="https://partner-cdn.shoparize.com/js/shoparize.js" defer="defer"></script>
<script>
window.dataLayerShoparize = window.dataLayerShoparize || [];
dataLayerShoparize.push({
event: "purchase",
ecommerce: {
transaction_id: "{{ order.order_number }}", // NUMÉRO DE COMMANDE (CHAÎNE)
value: {{ total_price | times: 0.01 }}, // MONTANT TOTAL (NOMBRE DÉCIMAL)
tax: {{ tax_price | times: 0.01 }}, // MONTANT DE LA TAXE (NOMBRE DÉCIMAL)
shipping: {{ shipping_price | times: 0.01 }}, // FRAIS DE LIVRAISON (NOMBRE DÉCIMAL)
currency: "{{ order.currency }}", // DEVISE (CHAÎNE)
items: [ // TABLEAU DES ARTICLES ACHETÉS
{
item_id: "{{ line_item.product_id }}", // ID DE L’ARTICLE (CHAÎNE)
item_name: "{{ line_item.title | remove: "'" | remove: '"' }}", // NOM DE L’ARTICLE SANS AUCUNE GUILLEMETS SIMPLES OU DOUBLES AJOUTÉS (CHAÎNE)
currency: "{{ order.currency }}", // DEVISE (CHAÎNE)
price: {{ line_item.final_price | times: 0.01 }}, // PRIX (NOMBRE DÉCIMAL)
quantity: {{ line_item.quantity }} // QUANTITÉ (NOMBRE)
}
]
}
});
</script>
<script>
window.addEventListener('load', function () {
SHOPARIZE_API().conv(YOUR_SHOPARIZE_PARTNER_SHOPID);
});
</script>
N’oubliez pas de configurer votre ID de boutique, comme indiqué ci-dessus :
SHOPARIZE_API().conv(YOUR_SHOPARIZE_PARTNER_SHOPID);
Par exemple, si l’ID de votre boutique est 1234, cela doit apparaître ainsi :
SHOPARIZE_API().conv(1234);
Le snippet JS doit être exécuté sur toutes les pages de la boutique, y compris la page d’accueil, les pages de catégorie et les pages produit (à l’exception de la page de remerciement) :
// THIS CODE BLOCK IS FOR PRODUCT PAGES, HOME PAGE ETC.
<script src="https://partner-cdn.shoparize.com/js/shoparize.js" defer="defer"></script>
<script>
window.addEventListener('load', function () {
SHOPARIZE_API().init(YOUR_SHOPARIZE_PARTNER_SHOPID);
});
</script>
N’oubliez pas de configurer votre ID de boutique, comme indiqué ci‑dessus :
SHOPARIZE_API().init(YOUR_SHOPARIZE_PARTNER_SHOPID);
Par exemple, si l’ID de votre boutique est 1234, cela doit apparaître ainsi :
SHOPARIZE_API().init(1234);
La requête d’exemple devrait ressembler à quelque chose comme ceci :
{
"shopId": "11111",
"dataLayer": {
"ecommerce": {
"transaction_id": "1006",
"value": 0,
"tax": 0,
"shipping": 0,
"currency": "EUR",
"items": [
{
"item_id": "6967987077320",
"item_name": "Nature Cure CBD-Olie 30%/ 30 ml - Nature Cure CBD-Olie 30%/ 30 ml",
"currency": "EUR",
"price": 0,
"quantity": 1
}
]
}
} ,
"_partner_utm_source": "Shoparize",
"_partner_utm_medium": "Shoparize Google Ads",
"_partner_utm_campaign": "EAIaIQobChMI0q_2sM_1-AIVlKnVCh1KPwubEAQYBSABEgJ4Z_D_BwE_____EAIaIQobChMI0q_2sM_1-AIVlKnVCh1KPwubEAQYBSABEgJ4Z_D_BwE_____CjkKCQjwt7SWBhD-ARIoADl0M-UACUEUCM9EiMkioEB5EF--gmZEEXcTh7VLGn4f-z1ZPD",
"_partner_utm_term": "",
"_partner_msclkid": "",
"_partner_gclid": "EAIaIQobChMI0q_2sMQYBSABEgJ4Z_D_BwE",
"_partner_wbraid": "",
"_partner_gbraid": "",
"_partner_click_time": "1657901335434"
}
Ensuite, créez une commande test en utilisant le lien que l’équipe support de Shoparize doit vous fournir.
