Tworząc aplikacje czy konkursy na Facebooku z pewnością chcielibyśmy wiedzieć jak przekładają się one na przyrost fanów fanpage marki.
- W sekcji <head> podpinamy kod Google Analytics.
- Wstawiamy like button <fb:like></fb:like>
- Osadzamy asynchroniczny kod biblioteki Facebooka.
- Podpinamy funkcje pod zdarzenia facebooka 'edge.create’ i 'edge.remove’, w tych funkcjach wywołujemy handler Google Analytics z pożądanymi parametrami.
<head>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-XXXXX-XX']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</head>
<body>
<div id="fb-root"></div>
<fb:like href="http://www.facebook.com/FANPAGE" send="false" show_faces="false" font=""></fb:like>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({appId: 'YOUR_APP_ID', status: true, cookie: true, xfbml: true});
FB.Canvas.setAutoResize();
FB.Event.subscribe('edge.create',
function(response) {
alert('like');
_gaq.push(['_trackPageview', '/like_it']);
}
);
FB.Event.subscribe('edge.remove',
function(response) {
alert('unlike');
_gaq.push(['_trackPageview', '/unlike_it']);
}
);
};
//Load the SDK asynchronously
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/pl_PL/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>
</body>
Z powyższego kodu należy usunąć alerty, które są wstawione jedynie dla testu działania mechanizmu.