Standard E-commerce Tracking

Sending transaction data directly from the fundraising system (dataLayer)

In order to implement the Standard E-commerce (GA) tracking with Google Tag Manager, we first need to get the transaction data pushed to the dataLayer. After the transaction data is available in the right format, we can use Google Tag Manager to read this data and transfer it to Google Analytics.

How does this setup works?

Instructions

DataLayer Setup

Implement the DataLayer E-commerce Script Add the dataLayer() object to the transaction page to collect and pass the required variables. The dataLayer script below should be fired after the donation is confirmed.

dataLayer.push

<script>
// Ecommerce
window.dataLayer = window.dataLayer || []
dataLayer.push({
'event': 'donationComplete', // Event for situations when there’s no thank you page
'transactionId': '{{variable.transactionId}}', // Transaction ID - Type:String
'transactionTotal': '{{variable.amount}}', // Total revenue - Type:Numeric
'currencyCode': '{{variable.currency}}', // Currencycode - Type:String (ISO 4217 currency code, like EUR)
'transactionProducts': [{
 'sku': '{{variable.pageName}}', // Product SKU - Type:String
 'name': '{{variable.pageName}}', // Product Name - Type:String
 'category': '{{variable.donationType}}', // Product Category - Type:Type:String
 'price': '{{variable.amount}}', // Product Price - Type:Numeric
 'quantity': 1 // Product Quantity - Type:Numeric }]
});
</script>

Variables in red should be adapted to your fundraising system. Make sure they are dinamically populated with transaction data.

Where to place the dataLayer() script?

• If the user is redirected to a “thank you” page: Then that GA Ecommerce dataLayer.push code must be placed above the GTM container code. It’s very important to place it above. Why? Because then the Ecommerce transaction data will be already available for Google Tag Manager when it starts loading.

• If there’s no thank you page: If the page does not reload when the purchase is successfully made, then your developer can place the code whenever he/she wants but one additional modification is needed then. A developer must add an additional parameter called “event” (e.g donationComplete).

Google Tag Manager Setup

Cross-Domain Tracking

Update your {{crossDomain}} variable with your fundraising top-level domain.

Set up triggers in Google Tag Manager

• If the user is redirected to a “Thank you” page: If the Ecommerce dataLayer.push code is added above the GTM container (on a “Thank you” page), you can create a pageview trigger type for the thank you page:

• If the Ecommerce dataLayer.push code is added below the GTM container (on a “Thank you” page) you need to create a DOM Ready trigger:

• If there’s no thank you page: Create a custom event trigger on Google Tag Manager:

Set up the Universal Analytics Transaction tag

Create a default Google Analytics tag with the Transaction track type. Connect it to your Google Analytics Settings Variable and add the trigger created above.