How to set up Google Analytics tracking inside the donation form

Step 1:

Log in to Google Analytics (https://analytics.google.com/analytics/web/) and navigate to the Google Analytics account with which you want to integrate the donation form.  

Step 2:

Click on Admin in the left-hand menu.

Step 3:

Click on Tracking Info and then select Tracking Code.

Step 4:

Copy the Global Site Tag (gtag.js) script. 

If you want to enable Enhanced Ecommerce Tracking, follow this guide.

Step 5:

Go to the Donorbox campaign editor for which you wish to enable Google Analytics Tracking. 

Step 6:

Click on the edit icon for the Technical tab:

On the Tracking tab, paste in the "Analytics Tracking Codes" field which was copied from the Google Analytics dashboard (in step 4), as shown below.

Update:

Due to Google chrome's strict cookie policy for cross-site requests, we need to instruct the tracking code to set cookie flags that is necessary for the tracking to work properly inside the embedded form (iframe)

Modify the line gtag('config', 'xxxxxxx'); in the code to look like below:

gtag('config', 'xxxxxxxx', {
  cookie_flags: 'secure;samesite=none'
});

7. Click Update & Preview or Save & Next. Your campaign form is now enabled for tracking visits in your Google Analytics.

________________________________________________________________________________________

To verify that the analytics tracking code is installed correctly: 

Step 1:

On your Google Chrome browser, install the Tag Assistant plugin (by Google) from here: https://chrome.google.com/webstore/detail/tag-assistant-by-google/kejbdjndbnbjgmefkgdddjlbokphdefk

Step 2:

Go to the campaign (for which the tracking code is set up) donation page on your Google Chrome browser. 

Step 3:

Click on the Tag Assistant plugin icon on your browser.

Step 4:

You should see something similar to the image below. Ensure the correct tracking ID's are being displayed in the results window.