jQuery and Google Analytics: Take 2

Thursday, December 9. 2010

Awhile back I had reported on my findings of how to use jQuery to automatically tag links on my site (that link to a site that is not my own) for event tracking with Google Analytics.

Although there are ways to use the pageView method and parse the data within Analytics so that it does not skew your view of overall visits/hits, I simply find it easier to mark these as events since they aren't actually page views, but events.

Unfortunately, it's helpful to see which external links are pertinent to people, and which page they're leaving your site from (and where they're going), so rather than identifying the event type itself (click), I used that field for a value instead so it could be categorized by any of these things from within Google Analytics.

The problem I was having personally was that the values I was using were not strings (in my own tests at least; the code on the blog should have worked, theoretically). I was using document.location (type: object) and passing it to the trackEvent() method, which checks for value types (and denies incorrect calls). Here is the updated (using the new Async method) code which is tested, and works:

Remember to change your own account ID in the code above!

There is no need to define your domain's actual information anywhere unless you want to track both subdomains as well as top-level domains under a single account. For that, take a look at the Google Analytics documentation. I haven't done this myself so would not be able to suggest a best-method approach for it. This code tracks any HTML-based links (links inserted dynamically with JS will not be tracked, you can do this with $(this).live('click', function()...) instead of $(this).click()) that point to anywhere NOT within your domain. If you use a redirect script as part of your domain, (ex: ...tracker.php?go=http://someothersite.com), then this will not track that page click as-is.

This code specifically defines the event as "Outbound", the category as the currently viewed page's URL, and the action field as the URL that the user will be taken to. Modify 'til your heart's content. :)

For even more accurate results, see how to delay the loading of the external site so that the tracking code has more time to accomplish its task (race conditions are fun): Google's Solution


Trackback specific URI for this entry
    No Trackbacks


    #1 Mike on 12/14/10 at 11:12 AM [Reply]
    This looks useful. On our new site, we have a content type where staff will be able to insert links and we want to be able to track outbound clicks but not force the staff to enter any GA code on the page. I guess we could take this approach to dynamically add the handlers to the links? I will forward this to our developers...
    #1.1 Brendon Kozlowski on 12/14/10 at 01:12 PM [Reply]
    That was the exact purpose of using this code (and what this is doing), actually. I was not about to make certain that I added properties or onClick events to all of my links - eventually I'd miss something and that level of maintenance is absurd; it just makes very little sense. This just automates that task for those with JavaScript enabled.

    It doesn't have to be an event, it could be a Pageview instead (as mentioned), and within Google Analytics the pageview could be described/labelled as being from a content area of "example.com/outbound/..." where "..." is whatever value you give the path from the clicked link. I chose the event route over the pageview. It's just easier to separate total page views from navigation away from our site to an external site.

    Alternatively (not shown in this code), doing some simple extension matching on the value of the link could also allow you to track file downloads (such as PDF documents, for instance) since there's no way for GA code to run on a binary document. Direct linking from an email still would not track a PDF download, but it's helpful nonetheless.

    Let me know if you have any questions. By the way, I'm glad you comment got through. I've re-enabled my Akismet spam filter and was worried you'd get flagged again. I was getting hammered with too much spam recently.

Add Comment

E-Mail addresses will not be displayed and will only be used for E-Mail notifications.

To prevent automated Bots from commentspamming, please enter the string you see in the image below in the appropriate input box. Your comment will only be submitted if the strings match. Please ensure that your browser supports and accepts cookies, or your comment cannot be verified correctly.

BBCode format allowed