Guide d'intégration des tags et du flux dans 3D Cart

Présentation

Ce guide explique comment générer un flux produit et installer le Criteo OneTag sur votre site 3D Cart.

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 :

1. Export/Import
   Go to Products > Product List > Export / Import
   
2. Go to Products > Manage
   
3. Click Add New to create a new export
   
4. Match the fields using Criteo Product Feed Specification.
   These are the default column titles. If required, you can add additional columns to the 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 (optional)
5. Schedule your export. Go to Products > Choose your export under Custom Export Sets > Schedule
   
6. Generate feed link http://www.domain.com/assets/exports/filename.csv
   
   Under Scheduled Exports, choose checkbox Enable and enter the file name. Under Action choose the first option Save File.
   
   

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 ces cinq étapes faciles :

1. Homepage Template >home.html
   Click for Homepage Tag
2. Listing Template >category_0.html
   The idea here is to populate the product IDs on the page as either HTML or a JavaScript variable using the macro [catalogid].
   
   The listing loop generally sits within the section with the following START and END comments.
   
   <!--START: CATEGORY_ITEMS-->
   <!--START: ITEM_TEMPLATE_0-->
   ....html template for each product in the category....
   <!--END: ITEM_TEMPLATE_0-->
   <!--END: CATEGORY_ITEMS-->
   
   You can add the following code within the listing loop to build an array of products IDs in JavaScript:
   
   <!--START: CATEGORY_ITEMS-->
   <!--START: ITEM_TEMPLATE_0-->
   <script>var prodlist = prodlist||[]; prodlist.push("[catalogid]"); </script>
   <!--END: ITEM_TEMPLATE_0-->
   <!--END: CATEGORY_ITEMS–>
   
   
   
   Click for Listing Tag
3. Product/Quick-view Template >listing_0.html or quickview.html
   Click for Product Tag
4. Cart/Quick-view Template >view_cart.html or view_cart_quick.html
   Similar to the listing tag, we need to build the product array within the cart item loop of the HTML, which is within the section of the following START and END comment:
   
   
   
   <!--START: SHOPPING_CART_ITEM-->
   <script> var cartData = cartData||[]; cartData.push({id: "[catalogid]", price: ("[ITEM_PRICE]").replace('$',''), quantity: [ITEM_QUANTITY] }); </script>
   <!--END: SHOPPING_CART_ITEM-->
   
   
   
   Click for Basket Tag
5. Order Confirmation Template (modèle de confirmation de commande) > checkout-step4.html
6. The product data is the same as listing and cart:
   <!--START: items-->
   <script> var orderData=orderData||[]; orderData.push({ id: "[catalogid]", price: ("[unitprice]").replace('$',''), quantity: "[numitems]" }); </script>
   <!--END: items-->
   
   
   You can retrieve the Order ID with the macro [invoicenum]
   You can retrieve the plain-text email address with the macro [oemail]
   Click for Conversion Tag

Comment puis-je tester les tags ?

• Si vous avez accès à la plate-forme Criteo Integrate, vous pouvez vous connecter et utiliser le Tableau de validation des tags pour tester vos tags.
• Vous pouvez sinon télécharger et utiliser l'extension Chrome Criteo Accurate.