Présentation
Ce guide explique comment générer un flux produit et installer le Criteo OneTag sur votre site 3D Cart.
Remarque : en téléchargeant et en utilisant un plug-in, une extension ou un extrait de code fourni par Criteo afin de faciliter l'installation du code logiciel et/ou des tags sur des sites clients, le client reconnaît que l'examen et les tests d'installation sur son site relèvent exclusivement de sa responsabilité et accepte le fait que Criteo n'est en aucun cas responsable à son égard concernant toute erreur d'installation. La mise en place des tags peut se faire principalement via des copier-coller, néanmoins certaines modifications peuvent être nécessaires en fonction des personnalisations apportées à votre site.
|
Comment générer un flux produit
3D Cart a une structure arborescente. Par conséquent, nous vous recommandons d'utiliser le product ID interne de 3D Cart plutôt qu'un product ID généré ailleurs. Suivez tout simplement ces six étapes pour générer un flux produit :
Étape 1 : Exportation/importation
Étape 2 : Allez à Produits > Gérer
Étape 3 : Créez un nouvel export en cliquant sur « Ajouter »
Étape 4 : Remplissez les champs en utilisant les spécifications de flux produit Criteo.
Voici les titres de colonnes par défaut. Si nécessaire, vous pouvez ajouter des colonnes supplémentaires à l'export :
- name (alias: title)
- url_link (alias: link)
- image1/thumbnail (alias: image_link) REMARQUE : n'oubliez pas d'insérer l'URL de la page d'accueil du site en tant que "Prefix".
- description (alias: description)
- price (alias: price)
- catalogid (alias: id)
- saleprice (alias: sale_price)
- instock_message (alias: availability)
- categories (alias: product_type)
- constant for static value (facultatif)
Étape 5 : Planifiez votre export.
Allez à Products > Choisissez votre export sous Custom Export Sets > Schedule
Étape 6 : Lien général de fluxhttp://www.domaine.com/assets/exports/nom_fichier.csv
Sous Exports programmés, cochez la case Activer, puis saisissez le nom du fichier. Sous Action, sélectionnez le premier choix, Sauvegarder.
Comment installer le Criteo OneTag
Vous devez tout d'abord accéder au thème du site Web. Allez à Settings > Design > Themes & Styles. Ensuite, cliquez sur Edit Template (HTML).
Les modèles individuels sont les suivants :
- Page d'accueil : home.html
- Pages de listing : category_0.html. Vous pouvez avoir plusieurs modèles pour les pages de catégorie.
- Pages produit : listing_0.html. Vous pouvez avoir plusieurs modèles pour les pages produit.
- Pages produit (aperçu rapide) : quickview.html
- Pages panier : view_cart.html
- Pages panier (fenêtre d'aperçu rapide) : view_cart_quick.html
- Page de confirmation de commande : checkout-step4.html s'il s'agit d'un système de confirmation à 4 étapes.
Si vous combinez tous les tags dans une seule instruction conditionnelle, vous pouvez ajouter votre script à frame.html.
Pour intégrer le Criteo OneTag, suivez simplement ces cinq étapes :
Remarque : la variable PARTNER_ID du code ci-dessous correspond à votre identifiant Criteo unique. Veuillez contacter votre représentant Criteo pour l'obtenir. |
Étape 1 : Modèle de page d'accueil >home.html
<!-- Criteo Homepage Tag -->
<script type="text/javascript" src="//static.criteo.net/js/ld/ld.js" async="true"></script>
<script type="text/javascript">
var deviceType = /iPad/.test(navigator.userAgent) ? "t" : /Mobile|iP(hone|od)|Android|BlackBerry|IEMobile|Silk/.test(navigator.userAgent) ? "m" : "d";
window.criteo_q = window.criteo_q || [];
window.criteo_q.push(
{ event: "setAccount", account: PARTNER_ID},
{ event: "setSiteType", type: deviceType },
{ event: "setEmail", email: "" },
{ event: "viewHome", ecpplugin: "3dcart" }
);
</script>
<!-- END Criteo Home Page Tag -->
Étape 2 : Modèle de listing >category_0.html
Remplissez les product ID sur la page soit en HTML, soit par une variable JavaScript à l'aide de la macro [catalogid]
La boucle de listing se trouve en général dans la section entre les commentaires START et END suivants.
Ajoutez le code suivant dans la boucle de listing pour créer un éventail d'ID de produits dans JavaScript :
<!--START: CATEGORY_ITEMS-->
<!--START: ITEM_TEMPLATE_0–->
<script> var prodlist = prodlist||[]; prodlist.push("[catalogid]"); </script>
<!--END: ITEM_TEMPLATE_0-->
<!--END: CATEGORY_ITEMS–>

Puis, copiez les tags suivants :
<!-- Criteo Listing Page Tag -->
<script type="text/javascript" src="//static.criteo.net/js/ld/ld.js" async="true"></script>
<script type="text/javascript">
var prodlist = prodlist||[]; prodlist.push("[catalogid]");
var deviceType = /iPad/.test(navigator.userAgent) ? "t" : /Mobile|iP(hone|od)|Android|BlackBerry|IEMobile|Silk/.test(navigator.userAgent) ? "m" : "d";
window.criteo_q = window.criteo_q || [];
window.criteo_q.push(
{ event: "setAccount", account: PARTNER_ID},
{ event: "setSiteType", type: deviceType },
{ event: "setEmail", email: "" },
{ event: "viewList", ecpplugin: "3dcart", item: prodlist }
);
</script>
<!-- END Criteo Listing Page Tag -->
Step 3: Product/Quick-view Template > listing_0.html or quickview.html
<!-- Criteo Product Page Tag -->
<script type="text/javascript" src="//static.criteo.net/js/ld/ld.js" async="true"></script>
<script type="text/javascript">
var deviceType = /iPad/.test(navigator.userAgent) ? "t" : /Mobile|iP(hone|od)|Android|BlackBerry|IEMobile|Silk/.test(navigator.userAgent) ? "m" : "d";
window.criteo_q = window.criteo_q || [];
window.criteo_q.push(
{ event: "setAccount", account: PARTNER_ID},
{ event: "setSiteType", type: deviceType },
{ event: "setEmail", email: "" },
{ event: "viewItem", ecpplugin: "3dcart", item: "[catalogid]" }
);
</script>
<!-- END Criteo Product Page Tag -->
étape 4 : Modèle Panier/Aperçu rapide >view_cart.html ou view_cart_quick.html
Tout comme le listing de tags, il vous faut créer l'éventail de produits dans la boucle de panier de l'adresse HTML, qui se trouve dans la section du commentaire ci-dessous :
<!--START: SHOPPING_CART_ITEM-->
<script> var cartData = cartData||[]; cartData.push({id: "[catalogid]", price: ("[ITEM_PRICE]").replace('$',''), quantity: [ITEM_QUANTITY] }); </script>
<!--END: SHOPPING_CART_ITEM-->
Puis, copiez les tags suivants :
<!-- Criteo Product Basket Tag -->
<script type="text/javascript" src="//static.criteo.net/js/ld/ld.js" async="true"></script>
<script type="text/javascript">
var deviceType = /iPad/.test(navigator.userAgent) ? "t" : /Mobile|iP(hone|od)|Android|BlackBerry|IEMobile|Silk/.test(navigator.userAgent) ? "m" : "d";
var cartData = [];
jQuery( document ).ready(function() {
window.criteo_q = window.criteo_q || [];
window.criteo_q.push(
{ event: "setAccount", account: PARTNER_ID},
{ event: "setSiteType", type: deviceType },
{ event: "viewBasket", ecpplugin: "3dcart", item: cartData });
});
</script>
<!-- END Criteo Basket Page Tag -->
Étape 5 : Modèle de confirmation de commande > checkout-step4.html
Tout comme le listing de tags, il vous faut créer l'éventail de produits, qui se trouve dans la section du commentaire ci-dessous :
<!--START: items-->
<script> var orderData=orderData||[]; orderData.push({ id: "[catalogid]", price: ("[unitprice]").replace('$',''), quantity: "[numitems]" }); </script>
<!--END: items-->
Puis, copiez les tags suivants :
<!-- Criteo Sales Page Tag -->
<script type="text/javascript" src="//static.criteo.net/js/ld/ld.js" async="true"></script>
<script type="text/javascript">
var deviceType = /iPad/.test(navigator.userAgent) ? "t" : /Mobile|iP(hone|od)|Android|BlackBerry|IEMobile|Silk/.test(navigator.userAgent) ? "m" : "d";
window.criteo_q = window.criteo_q || [];
window.criteo_q.push(
{ event: "setAccount", account: PARTNER_ID},
{ event: "setSiteType", type: deviceType },
{ event: "setEmail", email: "[oemail]"},
{ event: "trackTransaction", ecpplugin: "3dcart", id: "[invoicenum]" , item: orderData });
</script>
<!-- END Criteo Sales Page Tag -->
Vérification
- Les clients ayant accès à la plate-forme Criteo Integrate peuvent se connecter et utiliser le Tableau de validation pour tester les tags.
- Il est également possible de télécharger et d'utiliser l'extension Chrome Criteo Accurate.
- Le prix à l'unité de vos produits est récupéré le Criteo OneTag. Criteo multiple le prix à l'unité par la quantité de produits pour calculer la valeur totale de la commande affichée dans le rapport. Lorsque des frais de livraison, taxes, coupons, promotions ou codes de réduction sont appliqués, il est de votre responsabilité de vérifier que la valeur totale de chaque commande est correcte.