How to Track all Social Shares with GA?

For any marketer, tracking social performance is almost synonymous to evaluating social shares. We all know how the internet went crazy with the demise of Twitter Share Count API. The epicentre of sharing can be variety of sources but social media buttons still form a big part of how people share content from websites. Since the time unknown, Social Share Buttons, have served as tiny little widgets gently suggesting readers how the helpful content could be useful for their friends and acquaintances as well.

Google Analytics gives you the way to measure Social Media Interactions with Plugin Reporting. While, GA automatically tracks interactions for G+, for other social media sites you need to run a manual set up. In this post, we will explore what is the best way to set up social share attribution for Google Analytics

Two Kinds of Social Buttons

If we ignore the many different verbs for social buttons (share, retweet, +1, or pinning), in context of tracking we can think in terms of two types - API Buttons that require you to place their code on your website (Like, +1) and Share Buttons which will normally open in new window asking you to confirm your intent.

Facebook and Google had two choices - either to trust webmaster to not abuse the “Likes” by programmatically clicking on buttons without visitor’s consent or disallow any other way to use them without their code; with the not-so-honest history of website owners, they chose the latter.

Share Buttons, on the other hand, are just links and so, you can style them the way you want. Perhaps, that explains why there are hundreds of social sharing plugins and widgets.

Tracking the API Button

API buttons ship with specific functions to track when the action happened. With GA, automatically tracking the +1s, the only major button to track is FB’s “Like”.

var fbCallback = function() {
  FB.Event.subscribe('edge.create', function(targetUrl) {
    ga('send', 'social', 'facebook', 'like', targetUrl);
  });
}
if( window.fbAsyncInit ) {
  fbCallback();
} else {
  window.fbAsyncInit = fbCallback;
}

Add this code just before </head> and you are done.

Tracking the Share Button

Now comes the tricky part. Large no of social sharing plugins, make it impractical to write specific code for all of them. Rewind back a few paragraphs where I said that most of the share buttons are just links. Each social media site has its own specific URL for sharing something on the web and we can use this to built a reliable code that works everywhere.

This bit of javascript will automatically integrate with any existing plugin that you are using. This works by tracking all link clicks and window.open, checking if their link matches with sharing URLs.

var socialShareUrls = {
  "facebook" : {
    "url" : "facebook.com/sharer/sharer.php",
    "verb" : "share",
    "captureQ" : "u"
  },
  "twitter"  : {
    "url" : "twitter.com/intent/tweet",
    "verb" : "retweet",
    "captureQ" : "url"
  },
  "pinterest": {
    "url" : "pinterest.com/pin/create/bookmarklet",
    "verb" : "pin",
    "captureQ" : "url"
  },
  "linkedin" : {
    "url" : "linkedin.com/shareArticle",
    "verb" : "share",
    "captureQ" : "url"
  },
  "buffer" : {
    "url" : "buffer.com/add",
    "verb" : "add",
    "captureQ" : "url"
  },
  "digg" : {
    "url" : "digg.com/submit",
    "verb" : "submit",
    "captureQ" : "url"
  },
  "tumblr" : {
    "url" : "tumblr.com/widgets/share/tool",
    "verb" : "share",
    "captureQ" : "url"
  },
  "reddit" : {
    "url" : "reddit.com/submit",
    "verb" : "submit",
    "captureQ" : "url"
  },
  "stumbleUpon" : {
    "url" : "stumbleupon.com/submit",
    "verb" : "submit",
    "captureQ" : "url"
  }
}

// Track each link if it matches social share url
var trackSocial = function( link ) {
  for( socialSite in socialShareUrls ) {

    var socialSiteData = socialShareUrls[socialSite];
    if( link.indexOf( socialSiteData.url ) !== -1 ) {
      var match = link.match( socialSiteData.captureQ + "=(http.*?(&|$))" );
      ga('send', 'social', socialSite, socialSiteData.verb, match[1]);
    }

  }

};

function findParent(tagname,el) {
  if ((el.nodeName || el.tagName).toLowerCase()===tagname.toLowerCase()){
    return el;
  }
  while (el = el.parentNode){
    if ((el.nodeName || el.tagName).toLowerCase()===tagname.toLowerCase()){
      return el;
    }
  }
  return null;
}

document.addEventListener('click', function(e){
  // Find the nearest link where click originated.
  // which contains sharer's URL
  var parentLink = findParent("a", e.target);

  if( parentLink.href ) {
    trackSocial( parentLink.href );
  }
});

// Take ownership of window.open to capture plugins which use it.
var oldWindowOpen = window.open;
window.open = function(){
  trackSocial(arguments[0]);
  oldWindowOpen.apply(this, arguments);
};

Full script for social tracking.

Result

If you set this up correctly, you should start noticing activity under “Social Network and Action” in Acquisition > Plug-ins.

Conclusion

One problem with accounting social interactions is the lack of confirmation of the intent. If the visitor clicked on the retweet button but didn’t actually tweet it form the pop-up, you end up measuring a social interaction that itself gave no result. Nevertheless, measure activity on these buttons can be a good enough indicator to make a more detailed investigation into social performance.