Donorbox provides the ability to track donations on your own website. This is helpful if you want to track the conversions under your own domain rather than donorbox.org.
How does it work?
Donorbox has the option to configure a custom redirect URL for the campaign. Donors are redirected to this URL after the successful donation. Since this is per campaign-based configuration, it is possible to have different campaigns redirect to different URLs. This redirect URL can be a page on your website. In addition, Donorbox also allows you to pass the donation details as query parameters to the redirect URL. Thus enabling you to track the donation on your own website.
How to enable redirect URL for a campaign?
Step by step guide for enabling custom redirect URL for the campaign is available here https://donorbox.zendesk.com/hc/en-us/articles/360020294332-Can-I-redirect-donors-to-another-page-after-they-have-donated-
What details of the donation are passed to the redirect URL?
If the checkbox to send the donation details (as query parameters) to the redirect URL is enabled, as shown in the above screenshot, the following details of the donation will be passed to the redirect URL after the donation is successfully made by the donor.
- id
- first_name
- last_name
- amount
- currency
- address
- state
- city
- country
- duration (this refers to how often this donation will be made)
- form_id (this refers to the ID of the campaign)
- form_name (this refers to the name of the campaign)
- Responses to custom questions are also passed. The parameter name will be the label of that question in the form.
Donorbox also allows you to exclude donors' personal details for being passed to the redirect URL. To do that you need to enable the checkbox "Exclude donor's personal details"
When this checkbox is enabled, the donor's personal details such as first_name, last_name, email, address, state, city, and country will be excluded from the above list.
Examples
Now that the data is available in the redirect URL, you can easily extract the data to track the donations on your website. Here are the examples showing how to extract the data using javascript and passing it to the different analytics tracking scripts.
Tracking purchase events in GA4
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-T9QVFHJSZL"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-T9QVFHJSZL');
</script>
<script>
var params = new URL(window.location.href).searchParams;
var donationId = params.get('id');
var trackedId = 'tracked-ga4-purchase-' + donationId;
if(donationId && !window.localStorage.getItem(trackedId)) {
gtag('event', 'purchase', {
'transaction_id': donationId,
'value': params.get('amount'),
'currency': params.get('currency'),
'items': [{
'item_id': params.get('form_id'),
'item_name': params.get('form_name'),
'affiliation': 'Donorbox',
'item_category': 'Donation',
'price': params.get('amount'),
'item_variant': params.get('duration'),
'quantity': 1
}]
});
window.localStorage.setItem(trackedId, true);
}
</script>
Track donations as eCommerce purchases using Universal Analytics:
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXXXX"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-XXXXXXXXX', { cookie_flags: 'secure;samesite=none' });
</script>
<script>
var params = new URL(window.location.href).searchParams;
var donationId = params.get('id');
var trackedId = 'tracked-gtag-purchase-' + donationId;
if(donationId && !window.localStorage.getItem(trackedId)) {
gtag('event', 'purchase', {
'transaction_id': donationId,
'affiliation': 'Donorbox',
'value': params.get('amount'),
'currency': params.get('currency'),
'items': [{
'id': params.get('form_id'),
'name': params.get('form_name'),
'category': 'Donation',
'price': params.get('amount'),
'variant': params.get('duration'),
'quantity': 1
}]
});
window.localStorage.setItem(trackedId, true);
}
</script>
Tracking as Adwords Conversions:
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'AW-XXXXXXXXX');
var params = new URL(window.location.href).searchParams;
var donationId = params.get('id');
var trackedId = 'tracked-AW-conversion-' + donationId;
if(donationId && !window.localStorage.getItem(trackedId)) {
gtag('event', 'conversion', {
'send_to': 'AW-XXXXXXXXX/XXXXXXXXXXXXXXXXXXX',
'value': params.get('amount'),
'currency': params.get('currency'),
'transaction_id': trackedId
});
window.localStorage.setItem(trackedId, true);
}
</script>
Tracking purchase events using GTM dataLayer:
<!-- Google Tag Manager -->
<script>(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-XXXXXXX');</script>
<!-- End Google Tag Manager -->
<script>
var params = new URL(window.location.href).searchParams;
var donationId = params.get('id');
var trackedId = 'tracked-GTM-purchase-' + donationId;
if(donationId && !window.localStorage.getItem(trackedId)) {dataLayer.push({ ecommerce: null }); // Clear the previous ecommerce object. dataLayer.push({ 'ecommerce': {
'currencyCode': params.get('currency'), 'purchase': { 'actionField': { 'id': donationId, 'affiliation': 'Donorbox', 'revenue': params.get('amount') }, 'products': [{ 'name': params.get('form_name'), 'id': params.get('form_id'), 'category': 'donation', 'variant': params.get('duration'), 'quantity': 1 }] } }
});
window.localStorage.setItem(trackedId, true);
}
</script>
Tracking FB pixel purchase event:
<!-- Facebook Pixel Code -->
<script>
!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window, document,'script',
'https://connect.facebook.net/en_US/fbevents.js');
fbq('init', 'XXXXXXXXXXXXXXX');
fbq('track', 'PageView');
var params = new URL(window.location.href).searchParams;
var donationId = params.get('id');
var trackedId = 'tracked-FB-purchase-' + donationId;
if(donationId && !window.localStorage.getItem(trackedId)) {
fbq('track', 'Purchase' , {
value: params.get('amount'),
currency: params.get('currency')
});
window.localStorage.setItem(trackedId, true);
}
</script>
The above examples show how to extract a few donation details passed in the redirect URL to track the donations in your analytics account. However, you can do a lot more than tracking analytics, such as prefilling a registration form or displaying a customized thank message with the donor name, etc.
Comments
0 comments
Please sign in to leave a comment.