Sign in

Welcome to our Support Center

Get help with integration and live campaigns

Welcome to our Support Center. Get help with integration and live campaigns

3D Cart Tags and Feed Integration Guide

Overview

This guide will explain how to generate a product feed and how to install the Criteo OneTag on your 3D Cart site.

How to generate a product feed

3D Cart has a parent-child structure, so we recommend you use 3D Cart's internal product ID rather than a product ID generated elsewhere. Simply follow these six steps to generate a product feed:

Step 1: Export/Import

image18.png

Step 2: Go to Products > Manage

image00.png

Step 3: Create a new export by clicking "Add New" 
image01.png

Step 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) NOTE: please make sure you insert the site's home URL as 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)image02.png

Step 5: Schedule your export

Go to Products > Choose your export under Custom Export Sets > Schedule
image03.png

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

image04.png

How to install the Criteo OneTag

First, you’ll need to access the website's theme. Go to Settings > Design > Themes & Styles. Then click Edit Template (HTML).

The individual templates are:

  • Homepage: home.html
  • Listing pages: category_0.html. You may have more than 1 template for category pages.
  • Product pages: listing_0.html. You may have more than 1 template for product pages.
  • Product pages (quick view): quickview.html
  • Cart/Basket pages: view_cart.html
  • Cart/Basket pages (quick view popup): view_cart_quick.html
  • Order Confirmation page: checkout-step4.html if it's a 4-step checkout system.

If you are combining all the tags into one conditional statement, you can add your script to frame.html.

To integrate the Criteo OneTag, follow these five simple steps: 

Step 1: Homepage Template >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 -->

Step 2: Listing Template >category_0.html
You need to populate the product IDs on the page as either HTML or a JavaScript variable utilizing the macro [catalogid].

The listing loop is generally sitting within the section with the following START and END comments.

You can add the following code within the listing loop to build an array of product 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–>


Then copy the following tags:

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

Step 4: Cart/Quick-view Template > view_cart.html or view_cart_quick.html

Similar to listing tag, you 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-->

Then copy the following tags:

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

Step 5: Order Confirmation Template > checkout-step4.html

Similar to listing and cart tags, you need to build the product array within the following START and END comment:

<!--START: items-->
<script> var orderData=orderData||[]; orderData.push({ id: "[catalogid]", price: ("[unitprice]").replace('$',''), quantity: "[numitems]" }); </script>
<!--END: items-->

The copy the following tags:

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

Verification

  • If you have access to the Criteo Integrate Platform, please login and test using the Tags Validation Dashboard
  • You can also download the Criteo Accurate chrome extension to test your tags.
  • It is important to note that we collect the unit price for your products in the Criteo OneTag. We multiply the unit price with the product quantity to calculate the Total Order Value displayed in reporting. If you apply any shipping, taxes, vouchers, discounts, or promo codes, it is your responsibility to verify they are applied to the Total Order Value correctly.

 

Was this article helpful?
0 out of 0 found this helpful
Powered by Zendesk