Using Referrer URLs to Better Understand Your Visitors

< Blog

In my previous post, I showed how you can track the success of individual marketing efforts with a little jQuery code.

Add a source code at the end of URLs on ads and other placements that you want to track, take the source code from the URL and store it in a cookie, and then put the value from the cookie in a hidden form field when the user supplies their name and email address.

(If that doesn't make sense to you, you may want to go back to part 1 of this series, Capturing source codes to track marketing results, which explains the basics of how to use cookies for lead tracking.)

Often, however, you don't have any source code in the URL. You can put a source code in the link on all your ads, but when another site links to you of their own volition, there's not going to be a source code.

Rescued by the referrer URL

All is not lost! There's another kind of information you can capture: the referrer URL. That's the page on which someone clicked a link that led to your site. Browsers normally provide this information as part of every request; although users can disable or block it, most people do not.

Note that the referer provides different information than a source code appended to the URL (e.g., www.mysite.com?s=sourcename), and it is helpful to have both pieces of information.

For example, suppose you are running ads on an ad network. You can provide the URL that the ad will link to, so you can trace all ads that come from the network. But typically the URL will be the same for all sites in the network. The referral URL tells you what site the link came from.

Capturing the referrer

It's easy enough to access the referrer URL with JavaScript: simply document.referrer. But it also takes some cookie processing to get the result you're looking for.

Since the visitor may browse around your site for a while before coming to the page with the lead or order form they are going to fill out, you should store the referrer in a cookie, and then insert it into the form, just as with the URL-parameter source in part 1 of this series.

Unless the page with the form is the first page a user visits on your site, the current page's referrer URL isn't really what you want. You want the referrer URL of the first page the user visited, which tells you how they found your site.

Here's the code, which assumes that you have loaded jQuery and the cookie plug-in (see part 1 for details):

if ($.cookie("mysite_referrer") == null ) {
  $.cookie("mysite_referrer", document.referrer);
}

This code stores the current document referrer in the cookie named "mysite_referrer", only if there is not already a cookie of that name. We don't set any lifetime for the cookie, which makes it a session cookie, which disappears when the user quits the browser. Thus, the cookie stores the first referral URL for your site during the current browser session.

Submitting the referrer with your form

Add a hidden field to your lead or order form to capture the referrer information:

<input type="hidden" id="referrer" name="as_required_for_server_sw" />

The "name" attribute must be set as required by the system to which you are submitting the form. If you're using an email marketing provider, such as Campaign Monitor or Vertical Response, you'll need to define this field using their tools, and then their form-generator code will provide this name. If you're using a Webvanta hosted CMS custom item type, the item type form generator will give you the code. (Note that the ID attribute can be whatever you want; it is used only for the JavaScript code to target this field to set its value.)

Finally, set the value of the hidden field using the referrer URL that has been stored in the cookie:

$("#referrer").val($.cookie("mysite_referrer")); 

Be sure to put this code in a "document ready" block so the browser doesn't attempt to execute it before the DOM is ready to be manipulated.

Better tracking for your leads and orders

With both source-tracking methods—URL parameters and referrer URL—you have a much better chance of having useful source information for most people.

Once you've been through it once or twice, it only takes a few minutes to add this powerful tool to your sites. With the resulting information, you'll have a much clearer picture of where your visitors are coming from, and which ones are turning into customers.




Add Your Comments

(not published)

Reader Comments

6 comments

users with cookies disabled get errors?

From: Wes, 03/ 9/12 09:13 AM

I am trying to get your solution working with jotform ... I suggested your approach to the developers there and they said that users that have cookies disabled will get error when I try to submit the form. Is this true or have you run into this problem? You can see our running thread on this support message board http://bit.ly/AybTwC

Thanks for any ideas and feedback.

document ready block???

From: Carlos, 11/29/11 01:00 PM

i am not an expert, in the last part what means it " Be sure to put this code in a "document ready" block "??????

searching on internet i just find a very complicate codes, anybody can help me?

lightbox issue

From: James, 05/13/11 02:11 PM

I'm using shadowbox.js to expose my forms.
The forms themselves work and grab the cookie without a problem but NOT when exposed using shadowbox.js "iframe"
Instead of grabbing the cookie value it captures a "null" value.

Any ideas?

almost working

From: James, 05/ 4/11 10:23 AM

Thanks for the info. I think I finally figured out how to get it to work but I seem to be getting the page that leads to the form rather than the entry point to the site for that session. Some of my forms are presented inside a jquery "lightbox" - but I'm not sure that would be the problem here.
Probably a dumb question but should I be setting the cookie on all the entry points to the website and then capturing it when processing the various forms I have?

Route vs. referrer

From: Michael Slater, 05/ 3/11 05:15 PM

James, I haven't used uRoute, but from a quick look, it appears that it is just showing the route through your site, and is not intended to track the referrer.

All the code you need is above, but it does need to be properly set up for you site. You might want to use something like Web Developer Extension for Firefox to look a the cookies, and see if they are getting set properly. Then you can use "View generated source" from that extension to see if the JS is inserting the cookie value into the appropriate form fields.

can't get it to work

From: james, 05/ 3/11 07:58 AM

Hi,

I was using the jquery Uroute plugin but it was only ever giving me the path taken to the form from within my website. What I want is to get an idea what site users were on before they came to my site so this writeup looked great but I just can't seem to get it to work. Can you send me or point me to a basic example of what the source code would look like all put together? Thanks!

Call us at 888.670.6793
Or click for a free consultation

Get updates via email

Email address:

Share This Post


Follow Us

Related Posts

Recent Posts

Older Posts by Month