Track Google +1 Buttons with Google Analytics
In a move reminiscent of Facebook’s option to put Like buttons out on the web, Google yesterday opened up its +1 website voting to web pages. This social feature, which already allowed you to share results on search engine pages, lets your website users directly “+1″ content from your site’s pages. It’s Google’s answer to the Facebook Like, Tweet This other social sharing buttons.
As analysts, we naturally want all of the data, so my first thought was, “OK, how do we track this thing?” As it turns out, Google thought of that as well. When you’re creating your +1 button, there’s an Advanced Options area which lets you customize the button. One of those options is to reference a callback function — JavaScript code that will execute when a +1 event happens. This is the perfect place for a little Google Analytics event tracking.
The code you get from Google will look something like this:
<!-- Place this tag in your head or just before your close body tag -->
<script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script>
<!-- Place this tag where you want the +1 button to render -->
<g:plusone></g:plusone>
The first part, the <script> tag, doesn’t need to change and will need to be put in your header no matter what. What will change is the second part, the <g:plusone> tags. If you choose to add a callback function, it’ll look something like this:
<g:plusone callback="track_plusone"></g:plusone>In this example, I added a callback named track_plusone. This is a reference to a JavaScript function called “track_plusone” that will need to be defined on the page as well. Here’s the code for my initial function:
<script type="text/javascript">
function track_plusone(gpovote) {
_gaq.push(['_trackEvent', 'Social Shares', 'Google +1 Vote', gpovote.href]);
}
</script>What this function does is fires a Google Analytics event tracking code. It sets the category of that event to “Social Shares”, the action to “Google +1 Vote” and the label to the URL of the page the button was clicked on. You can change the category and action to suit your own conventions, of course. The page is technically available in the new GA interface, where you can view events by page as well. The result is an event that shows up in Google Analytics whenever an item is voted for. Events take anywhere from one to 24 hours to show up, and appear within the Content > Events area of the Google Analytics user interface.
There’s one other feature we need to account for. Not only can visitors click the button to +1 vote for a page, but they can click it again to undo their vote — effectively giving you a -1 vote. We’ll need to be able to distinguish between initial +1 votes and -1 vote “undo” events. So, here’s a revised version of the function, which gives you two kinds of event actions: “Google +1 Vote” and “Google -1 Vote (Undo +1)”. Again, you change those details to match your conventions.
<script type="text/javascript">
function track_plusone(gpovote) {
var gpoaction = 'Google +1 Vote';
if (gpovote.state=='off') { gpoaction = 'Google -1 Vote (Undo +1)'; }
_gaq.push(['_trackEvent', 'Social Shares', gpoaction, gpovote.href]);
}
</script>[ Update: Google has also indicated that they will be adding some +1 reports of their own into Google Analytics, so these features will be integrated. You may prefer to do it that way, but one of the reasons we're using this code is that it allows our "social shares" events to be grouped and roll up into one category. At a glance, we can see how many shares happened on the site, and then drill down to see which services they came from. It's all about getting the right structure you want for the way you look at your site's features. ]
[ Update 2: Google has now unveiled its new reports for tracking social media interactions. The integrated +1 tracking is now combined with a new version of the event tracking code that's specific to social media. I added a post on tracking Facebook Like buttons using Google Analytics social tracking to showcase the new code, but the +1 buttons have this feature automatically, so strictly speaking, you don't need to add this yourself anymore. We still use this code to show these alongside our existing events for social tracking, at least until we get more data from the new method and phase the event tracking version out. ]
This kind of tracking lets your web analyst answer questions about the value of these Google +1 buttons, and the voters who use them. Are people who +1 vote for products the same people who purchase them? Do those people tend to come from social media themselves?
Social media is notoriously tough to track, so answering questions like this can be very useful to understanding what exactly you gain by adding these buttons to your site. Are they worth it? Let the data tell you.
Until next time,
Colin
June 3rd, 2011 at 9:13 am
By the way, this one uses the Google async tracking code. If you’re using the traditional tracking snippet on your site, you’ll need to replace the tracking code (the _gaq.push line) with this:
pageTracker._trackEvent(‘Social Shares’, gpoaction, gpovote.href);
June 9th, 2011 at 6:39 pm
So this will allow me to view +1 counts in Analytics? I was a little confused as to where you go to actually see the results of this tracking code.
June 21st, 2011 at 9:05 pm
Yes it will. The results show up under Event Tracking in the “Content” area of the Google Analytics reports.
June 28th, 2011 at 12:00 pm
Thanks for the instructions Colin, but I’m having trouble getting it to work. I’m using the traditional tracking snippet.
I’ve tried yours:pageTracker._trackEvent(‘Social Shares’, gpoaction, gpovote.href);
Waited several days + testing (clicking on plusone button with different google accounts)
And my current code is:
function track_plusone(gpovote) {
var gpoaction = ‘Google +1 Vote’;
if (gpovote.state==’off’) { gpoaction = ‘Google -1 Vote (Undo +1)’; }
pageTracker._trackEvent(‘Social Shares’, ‘gpoaction’, ‘gpovote.href’);
}
You’ll notice on my current code I tried adding some apostrophes:
pageTracker._trackEvent(‘Social Shares’, ‘gpoaction’, ‘gpovote.href’);
So far nothing is regsitering in GA event tracking. Am I missing something or is something coded wrong?
Thanks
June 28th, 2011 at 12:13 pm
Hi Steve,
It looks like you’re referring to the wrong function name in the code for the button itself.
You have:
<g:plusone size=”medium” count=”false” callback=”plusone_vote”></g:plusone>
…with callback=”plusone_vote”, but the name of the function is “track_plusone”.
You’ll need to change it to say callback=”track_plusone” instead.
You’ll want to remove the quotes around gpoaction and gpovote.href as well.
Hope this helps!
Colin
June 28th, 2011 at 12:34 pm
Thanks for looking at the code Colin. Good catch on my home page. I corrected the callback. However, I did have the correct callback “track_plusone” on my product pages. I’ve removed the quotes again so the code is: pageTracker._trackEvent(‘Social Shares’, gpoaction, gpovote.href);
I did previously have this but nothing was registering. I’ll give it some more time. Typically how long before something would show in GA (taking into account that people are actually clicking the button).
Thanks again.
June 28th, 2011 at 12:50 pm
Steve — Officially, it takes up to 24 hours. However, if you set your date range to include today, you may see events appear within a couple of hours. It varies.
I just did a test on one of your product pages, though, and using a browser plugin I did see the event HTTP request send the event data to Google. So, from this end it looks like it’s working now… let me know if you see the data show up.
June 28th, 2011 at 12:52 pm
Great, thanks for testing. I’ll watch to see if it shows up.
June 28th, 2011 at 1:09 pm
Just had a Plusone show up in GA which I’m sure was yours. Looks like it’s working good now. Thanks again!