• About Us
  • Services
  • Case Studies
  • Blog
  • Contact Us
  • Tracking Clicks on # Anchors in Google Analytics

    A recent client acquisition lead to a good question in the office…. ‘Is it possible to track clicks on # Anchors in Google Analytics?’ The question arose due to the client’s website utilising a single page format with tabs anchor linking to sections further down the page.

    What are # Anchors?

    Many websites use ‘Named Anchors’ on their pages for quick linking to specific areas of the page. For example, say you had an ‘About Us’ area at the bottom of the page and you wanted to have a tab at the top of the page link directly to that area:

    In Source View, a completed anchor link would normally take the following form:

    <a name=”about”>&nbsp;</a> (This code is placed where the clickable link will direct the user to)
    <a href=”#about”>About Us</a> (The clickable link itself)

    The Problem

    By default, Google Analytics will not report the pageview as index.htm#about, but rather just index.htm as Analytics does not track anything after # in a URL. So for our client’ website, which utilises #Anchors for all of the tabs on their website, a clear issue arose, ‘how do we then track when a user clicks one of these #Anchors?’

    The Solution

    A website utilising #Anchors rather than individual landing pages is not ideal when it comes to PPC, nor tracking. But, with a little jiggery pokery (and the help of some JavaScript) it can be managed the same as any other website.

    In order to track the hashtag in Analytics we need to make an amendment to the Tracking Code and include the ‘location.hash’ property.

    Traditional tracking code:

    _gaq.push(['_trackPageview']);
    Revised tracking code:

    _gaq.push(['_trackPageview', location.pathname + location.search + location.hash]);

    Note the inclusion of location.hash parameter above. This will request that Analytics now trigger a pageview that includes the #. It will now appear in the Content Drilldown report as index.htm#about

    Tracking Clicks on # Anchors in Google Analytics

    Without this customised code Analytics would show multiple index.htm pages each with a different number of Pageviews, but no # advising which #Anchor was clicked.

    It is highly important to be able to track each #Anchor, otherwise you cannot track visitor behaviour accurately or how they interact with your website.

    Using this solution with PPC Campaigns

    It is possible to include the ‘#’ within the Destination URL of an Adwords ad and, once clicked, it will direct the user to the relevant #Anchor. However, Analytics will not record the #Anchor as the landing page; it will record the landing page as ‘/’. As Analytics records it in this way, you will see an inflated Visits figure for ‘/’.

    You can verify this by comparing Landing Page Visits to the previous period deducting the No. Clicks received from the linked AdWords account. For example:
    In AdWords there was 514 clicks during the period Mar 7, 2014 – Mar 11, 2014. Deduct 514 from 609 (below) and you are left with 95 which relates closely to the Organic Visits of 97 (below) for the previous period which did not have PPC active.

    blog2

    Side effects of this solution

    Okay, so as you may be aware, the average time on site is calculated from entry to entry. This means, if the user does not visit another page, the time on site becomes zero, irrespective of the time spent on the Landing Page. So, because the #Anchors in this case are still within the same page, Analytics is not recording an Avg. Time on Page as the visitor is, in essence, not visiting other pages, but rather just ‘/’.

    The only way that Analytics will track this is if the #Anchor link is on a separate page. This will negatively impact the Avg. Time on Page value attributed to the ‘/’ index page as shown below:

    blog3

    In Summary

    This solution can be used on both single-page sites where Tabs are present, and also multi-page sites where the requirement to track #Anchors is needed. With multi-page sites comes the opportunity for cross-page linking, which will provide more data for Avg. Time on Page.

    I hope you have found this post useful. What are your experiences with tracking #Anchors in Google Analytics? I’d love to hear your comments and suggestions.

     

    FOLLOW
    ABOUT THE AUTHOR
    Jason is a PPC Consultant at White.net specialising in PPC & Online Marketing and joined the company in January 2014 with a proven background in PPC development. Jason was previously the Website & Marketing Manager at Extera Ltd, where he was responsible for all marketing activities and during a previous employment at GM Ltd he initiated and oversaw the creation of the company’s e-commerce business taking it to a £3million turnover in under 3 years. Jason has numerous qualifications in PPC, including Google AdWords, Google Analytics, Bing and Marin. When his PPC cap is off, he can often be found in the gym, at Franklins Gardens and Twickenham (if found please return to White.net), or with his head in a good book. Likes: Fine cheese. Dislikes: Drivers who do not indicate.

    2 Responses to “Tracking Clicks on # Anchors in Google Analytics”

    1. Levent says:

      Hi Jason,

      Would this solution work for the new Universal Analytics as well?

      Thanks,
      Levent

      • Jason Denny says:

        Hi Levent,

        A Very good question. No, I do not believe it would as the coding is slightly different for UA compared to legacy Analytics tracking code.

        The UA code on your site should look similar to that below:

        (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
        (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
        m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
        })(window,document,’script’,’//www.google-analytics.com/analytics.js’,’ga’);

        ga(‘create’, ‘UA-XXX-X’, ‘website.com’);
        ga(‘send’, ‘pageview’);

        You would need to add the additional code below into the FOOTER of your site:

        jQuery(document).ready(function () {
        var hashtag = /#\S+/
        jQuery(‘.menu li a’).click(function(){
        var match = jQuery(this).attr(‘href’).match(hashtag);
        ga(‘send’, ‘pageview’, ‘/’ + match[0]);
        })
        });

        This should allow Analytics to track clicks on Anchors.

        Let me know if this works for you.

        Many thanks,
        Jason

    Leave a Reply