Charity Engine – Tag Manager Set-up

Javascript Needed:

/*!

• CHARITYENGINE EVENTS
• ———————————
• Below is an example of how to use events built into the CharityEngine forms framework
  */

(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({‘gtm.start’:
new Date().getTime(),event:’gtm.js’});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!=’dataLayer’?’&l=’+l:”;j.async=true;j.src=
‘https://www.googletagmanager.com/gtm.js?id=’+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,’script’,’dataLayer’,’GTM-XXXXXX’);

//Uncomment code below and customize to bind page events to custom GTM triggers (if needed)
//NOTE: this is only for advanced customization – basic conversion happens automatically below

//document.addEventListener(‘DOMContentLoaded’,function(){

// //example of binding amount frequency change event to fire custom GTM trigger
// Form.amountSection.onFrequencyChanged(function (eventData) {

// window.dataLayer = window.dataLayer || [];
// dataLayer.push({
// ‘event’: ‘Your Custom Trigger Here’
// });
// });

//});

/*!

• GOOGLE ANALYTICS
• ——————————-
• The Google Analytics code below can be modified or added to depending on what data you would like sent to Google
  */

document.addEventListener(‘DOMContentLoaded’, function () {

if (WebFormContext.Form.StepName == 'Process Step' && WebFormContext.Form.RenderedViewName == 'Success View') {

    gtag('event', 'purchase', {
        "transaction_id": "[[TRANSACTION.ID]]",
        "affiliation": "Donation",
        "value": "[[TRANSACTION.AMOUNT]]",
        "currency": "USD",
        "items": [
            {
                "id": "[[TRANSACTION.ID]]",
                "name": "CharityEngine Donation",
                "category": "Donation",
                "quantity": 1,
                "price": "[[TRANSACTION.AMOUNT]]"
            }
        ]
    });

}

});

/*!

• GOOGLE TAG MANAGER
• ——————————-
• The Google Tag Manager code below can be modified or added to depending on what data you would like sent to Google
  */

document.addEventListener(‘DOMContentLoaded’, function () {

if (WebFormContext.Form.StepName == 'Process Step' && WebFormContext.Form.RenderedViewName == 'Success View') {

    window.dataLayer = window.dataLayer || [];
    dataLayer.push({
        'event': 'purchase',
        'transactionId': '[[TRANSACTION.ID]]',
        'transactionAffiliation': 'CharityEngine',
        'transactionTotal': '[[TRANSACTION.AMOUNT]]',
        'transactionProducts': [{
            'sku': '[[TRANSACTION.ID]]',
            'name': 'Donation',
            'price': '[[TRANSACTION.AMOUNT]]',
            'quantity': 1
        }, {
            'sku': '[[TRANSACTION.ID]]',
            'name': 'Donation',
            'price': '[[TRANSACTION.AMOUNT]]',
            'quantity': 1
        }]
    });

}

});