I needed Google Analytics integrated with Commerce, so here is a simple method for analytics.js and tag manager (thanks to Mark for the help!). This has been tested on analytics.js and tag manager with USD (it should work with any other 2 decimal currency).
First, go to frontend/checkout/thank-you.twig in your Commerce theme (if you haven’t already created a commerce theme, check out the docs). This is the tpl that runs on success of an order, since we only want the Google Analytics integration to run after somebody checks out.
Go into Google Analytics and enable “Enable Ecommerce” under your “Ecommerce Settings” in your account if you haven’t already.
Tag Manager
If you are using GTM, paste this in.
<script>
document.addEventListener("DOMContentLoaded", function() {
window.dataLayer = window.dataLayer || []
dataLayer.push({
'transactionId': '{{ order.id }}',
'transactionTotal': {{ order.total / 100|number_format(2, '.') }},
'transactionTax': {{ order.tax / 100|number_format(2, '.')}},
'transactionShipping': {{ shipment.fee / 100|number_format(2, '.') }},
'transactionCurrency': '{{ order.currency }}',
'transactionProducts': [
{% for item in items %}
{
'sku': '{{ item.sku }}',
'name': '{{ item.name }}',
'price': {{ item.price / 100|number_format(2, '.') }},
'quantity': {{ item.quantity }}
},
{% endfor %}
]
});
});
</script>
Gtag:
If you are using Gtag, paste this in.
<script>
gtag('event', 'purchase', {
'transaction_id': '{{ order.id }}',
'currency': '{{ order.currency }}',
'shipping': {{ shipment.fee / 100|number_format(2, '.') }},
'tax': {{ order.tax / 100|number_format(2, '.')}},
'value': {{ order.total / 100|number_format(2, '.') }},
'items': [
{% for item in items %}
{
'id': '{{ item.sku }}',
'name': '{{ item.name }}',
'price': {{ item.price / 100|number_format(2, '.') }},
'quantity': {{ item.quantity }}
},
{% endfor %}
]
});
</script>
Analytics.js
If using the standard analytics.js (not the legacy ga.js) all you need to do is paste this in.
<script>
document.addEventListener("DOMContentLoaded", function() {
ga('require', 'ecommerce');
ga('ecommerce:addTransaction', {
'id': '{{ order.id }}',
'revenue': {{ order.total / 100 | number_format(2, '.') }},
'shipping': {{ shipment.fee / 100 | number_format(2, '.') }},
'tax': {{ order.tax / 100 | number_format(2, '.') }},
'currency': '{{ order.currency }}'
});
{% for item in items %}
ga('ecommerce:addItem', {
'id': '{{ order.id }}',
'name': '{{ item.name }}',
'sku': '{{ item.sku }}',
'price': {{ item.price / 100 | number_format(2, '.') }},
'quantity': {{ item.quantity }}
});
{% endfor %}
ga('ecommerce:send');
});
</script>