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.