Ecommerce Tracking

[EPNW-Eric]

I noticed that the Tag Manager does not support Ecommerce tracking yet.

When looking at the JavaScript Tracker, there are 3 main track functionalities regarding Ecommerce:

1. Tracking a product/category page view (using setEcommerceView)
2. Tracking a cart update
3. Tracking an order

The other functions (addEcommerceItem, removeEcommerceItem, clearEcommerceCart, getEcommerceItems) are used for managing the cart.

Adding "product/category page view" was rather simple (#699).

On the other hand, tracking a cart update or an order is much harder since these two calls require knowledge of the cart.

From my understanding, in many shop systems, the cart content is stored server side, and only a cart identifier is stored client side. As for orders, they are also processed server side... I'm not yet sure how to deal with this.

An initial idea was something like a cart tag that when triggered modifes something like a cart variable (which stores data by using the local storage of the browser). Then the content of such a cart variable could be used in the tracking calls. On the other hand, this would store data on a users device which in most cases are already stored server side, so inconsistencies could arise (think of a logged-in-user who modifies the cart on an other device...).

Maybe cart and order tracking is out of scope for the Tag Manager and an entirely new plugin that allows users to link their shopping backend with Matomo is the best solution here.

Let me know what you think!

[AltamashShaikh]

@EPNW-Eric Thanks for creating this issue,the possible workaround for now is to use CustomEventTrigger along with DataLayer variable to track E commerce items

Step 1: Create a Trigger via Custom Event Trigger

Step 2: Create DataLayer variable

Step 3: Create a custom tag to track E commerce products in a order

Custom HTML

<script>
window._paq = window._paq || [];
var productsInfo = {{OrderInfo}};
console.log(productsInfo);
if(productsInfo && productsInfo.length) {
  var totalPrice = 0;
  for(var i=0;i<productsInfo.length;i++) {
    var product = productsInfo[i];
    window._paq.push(['addEcommerceItem',
      product.id, // (required) SKU: Product unique identifier
      product.name, // (optional) Product name
      product.category, // (optional) Product category. You can also specify an array of up to 5 categories eg. ["Books", "New releases", "Biography"]
      product.price, // (Recommended) Product Price
      product.quantity // (Optional - Defaults to 1)
    ]);
    totalPrice =  totalPrice + product.price;
  }
  _paq.push(['trackEcommerceCartUpdate', totalPrice]); 
}
</script>

Now you need to trigger the above tag using this code

window._mtm = window._mtm || [];
window._mtm.push({
'event':'order_form',
'order': {
  'products': [
    {
      'id':"1",
      'name':'Product1',
      'category': 'books',
      'price': 10,
      'quantity': 1
    },
    {
      'id':"2",
      'name':'Product2',
      'category': 'books',
      'price': 15,
      'quantity': 2
    },
  ]
}
});

Note: I have an eg for trackEcommerceCartUpdate you can use similar eg for addEcommerceItems and rest https://matomo.org/faq/reports/advanced-manually-tracking-ecommerce-actions-in-matomo/

[MatomoForumNotifications]

This issue has been mentioned on Matomo forums. There might be relevant details there:

https://forum.matomo.org/t/best-pratice-shopify-with-matomo-tag-manager/53699/4