Appearance
Using Google Tag Manager for tracking
It is possible to set up behavioral tracking to Relewise via Google Tag Manager. Be aware, however, that it requires a a proper and thorough setup in your Tag Manager, as well as some additional handiwork to get it working properly. That said, if you are unable or unwilling to run your behavioral tracking via our usual SDKs, GTM may be the choice for you.
WARNING: We do not recommend this approach!
iOS blocks tracking via Google Tag Manager by default, which means worse Recommendation and Search results from Relewise.
Prerequisites
- You need a GTM setup that tracks product views, changes to basket/carts, and purchases.
- You need to be able to resolve the correct Relewise User Type in GTM.
- You need to use an API key that is different from the Master Key. This key should have permissions to track according to your usecase needs.
- In order to track the basket changes, you need to be able to get all the lineitems in the basket, when the user interacts with the basket. This is different from the normal GTM setup, where you only track the current lineitem. Relewise needs all the line items.
Setup
You need to start by injecting the Relewise SDK. This example uses a lightweight version of the SDK, which only includes the Tracker
for better performance.
js
<script>
(function() {
window.RelewiseConfig = {
datasetId: '<api-dataset-id>',
serverUrl: '<server-url>',
apiKey: '<api-key>',
getUser: function() {
// Here you construct the correct Relewise User.
var user = Relewise.UserFactory.anonymous();
return user;
}
};
var el = document.createElement('script');
el.src = 'https://cdn.jsdelivr.net/npm/@relewise/client@1.21.0/dist/tracker.min.js';
el.async = 'true';
el.addEventListener('load', function() {
window.dataLayer.push({
event: 'RelewiseLoaded'
});
});
document.head.appendChild(el);
})();
</script>
Track Product view
Here is an example of tracking a product view. The GTM variable dlv - ecommerce.detail.products.0.id
needs to reference the product id in the detail datalayer variable, which contains the product id to track.
js
<script>
// Skip tracking if no product is being viewed right now
if ({{dlv - ecommerce.detail.products.0.id}}) {
var user = RelewiseConfig.getUser();
var tracker = new Relewise.Tracker(
RelewiseConfig.datasetId,
RelewiseConfig.apiKey,
{ serverUrl: RelewiseConfig.serverUrl });
tracker.trackProductView({
user: RelewiseConfig.getUser(),
productId: "<product-id-from-DataLayer>"
variantId: "<variant-id-from-DataLayer>" (variant id is an optional parameter)
});
}
</script>
Track Cart / Basket Changed
Warning: In order to track the basket changes, you need to be able to get all the line items in the basket whenever the user interacts with the basket. This is different from the normal GTM setup, where you only track the current lineitem. Relewse needs all the line items every time the basket changes.
js
<script>
var cart = '<your cart with all lineitems>';
var user = RelewiseConfig.getUser();
var basketUpdate = {
lineItems: cart.Items.map(function (item) {
var line = {
productId: item.productId,
productId: item.variantId,
quantity: item.quantity,
lineTotal: item.subTotal
};
return line;
}),
subtotal: { amount: cart.orderTotal, currency: '<basket-currency>' },
user: user
};
var tracker = new Relewise.Tracker(
RelewiseConfig.datasetId,
RelewiseConfig.apiKey,
{ serverUrl: RelewiseConfig.serverUrl });
tracker.trackCart(basketUpdate);
</script>
Track Order
Here is an example of tracking a purchase/an order. The GTM variable dlv - ecommerce.purchase
needs to reference the entire purchase-object in the DataLayer.
js
<script>
// Skip tracking if theres no purchase
if ({{dlv - ecommerce.purchase}})
{
var order = {{dlv - ecommerce.purchase}};
var tracker = new Relewise.Tracker(
RelewiseConfig.datasetId,
RelewiseConfig.apiKey,
{ serverUrl: RelewiseConfig.serverUrl });
tracker.trackOrder({
lineItems: order.products.map(function (p) {
return {
lineTotal: p.price * p.quantity,
productId: p.id,
quantity: p.quantity
};
}),
subtotal: {
amount: order.actionField.revenue,
currency: 'SEK',
},
trackingNumber: {{dlv - ecommerce.purchase.actionField.id}},
user: RelewiseConfig.getUser()
});
}
</script>