Ever wondered where people came from to sign up for your web app? Recently I wanted to track referrals for Tender and wanted something quick and dirty. The only problem? Our setup page is on a different domain than our marketing site. This meant I couldn’t use Google Analytics since it thought every “goal” came from exactly one place: the marketing site.
So instead, what I did was hack together a quick referral script using Javascript to track where people came from and add that to a field on the Site model (each install of Tender is considered a ‘Site’). The Javascript (in MooTools):
var Tracker = new Class({
tracker: null,
initialize: function(){
this.initCookie();
this.updateCookie();
this.markLinks();
var field = $('site_referral');
if (field){
field.value = this.tracker;
}
},
initCookie: function(){
this.tracker = Cookie.read('tracker');
if (!this.tracker || this.tracker == "") this.setTracker();
},
// Order of precidence
// 1. ?source= from in the URL
// 2. ?utm_campaign= in the URL
// 3. Referrer / Direct
setTracker: function(){
var final_source = document.referrer ? document.referrer : "direct";
var args = $get();
if (args.utm_campaign && args.utm_campaign.trim() != '') final_source = args.utm_campaign;
if (args.source && args.source.trim() != '') final_source = args.source;
Cookie.write('tracker', final_source, {duration:1});
this.tracker = final_source;
},
// Updates the cookie if another ?source or ?utm_campiagn is set
updateCookie: function(){
var final_source = null;
var args = $get();
if (args.utm_campaign && args.utm_campaign.trim() != '') final_source = args.utm_campaign;
if (args.source && args.source.trim() != '') final_source = args.source;
if (final_source){
Cookie.write('tracker', final_source, {duration:1});
this.tracker = final_source;
}
},
markLinks: function(){
$$('a.signup-link').each(function(el){
el.href += "?source=" + this.tracker;
}, this);
}
});
function $get(key,url){
if(arguments.length < 2) url =location.href;
if(arguments.length > 0 && key != ""){
if(key == "#"){
var regex = new RegExp("[#]([^$]*)");
} else if(key == "?"){
var regex = new RegExp("[?]([^#$]*)");
} else {
var regex = new RegExp("[?&]"+key+"=([^&#]*)");
}
var results = regex.exec(url);
return (results == null )? "" : results[1];
} else {
url = url.split("?");
var results = {};
if(url.length > 1){
url = url[1].split("#");
if(url.length > 1) results["hash"] = url[1];
url[0].split("&").each(function(item,index){
item = item.split("=");
results[item[0]] = item[1];
});
}
return results;
}
}
The way this works is the following:
- If someone comes with ?source=something or ?utm_campain=something (a Google Analytics keyword), it stores that value in a cookie called ‘tracker’
- If no ?source or ?utm_campaign can be found, it stores the referrer
- If no referrer can be found, it stores the value ‘direct’
- Every URL that has the class
signup-linkgets ?source=trackerhere appended, so that the referral gets tracked over to our setup domain. - If it finds a field with the id of
site_referral(the rails default forSite#referralfield), it sets that value to whatever is stored in the tracker cookie.
Now when people sign up, I can see where they came from in the admin panel:
