capture click of Facebook 'Like' button

**crmpicco** · 08-21-2012 10:59 AM

I am looking on the Facebook Developers Documentation to locate some sample code that would allow me to capture a click event on the "Like" button. It states:

If you are using the XFBML version of the button, you can subscribe to the 'edge.create' event through FB.Event.subscribe.

I am using XFBML, this is my code:

Code:

<div class="social_net_button facebook_button">
      <div id="fb-root"></div>
      <script>(function(d, s, id) {
              var js, fjs = d.getElementsByTagName(s)[0];
              if (d.getElementById(id)) {return;}
              js = d.createElement(s); js.id = id;
              js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
              fjs.parentNode.insertBefore(js, fjs);

              FB.Event.subscribe('edge.create',
                     function(response) {
                          alert('You liked the URL: ' + response);
                     }
              );

            }(document, 'script', 'facebook-jssdk'));</script>
      <div class="fb-like" data-href="http://www.facebook.com/pages/Ayrshire-Minis/160330240663397" data-send="false" data-layout="button_count" data-width="70" data-show-faces="false" data-action="recommend"></div>
    </div>

Can a click of the 'Like' button be captured by jQuery/Javascript or by any other means?

I have tried the FB.Event.subscribe, but I get a "FB not defined message every time", so it's not tracking for me.

**donatello** · 08-22-2012 03:01 AM

If all you want to do is keep tabs on FB likes, just build it another way, for example, here is a test I did.

http://delpercio.com/fblikes.php

Here's the code:

PHP Code:


<html>

<head>



<title>Facebook Checker</title>

</head>

<body onLoad="document.getElementById('siteLoader').style.display = 'none';">



<h2>Check Facebook Stats</h2>

<form action="fblikes.php" method="post">

<table border="0">

<tr><td><label>Enter URL to Check here:</label></td><td> <input type="text" name="url" size="40" /></td></tr>

<tr><td>&nbsp;</td><td><input type="submit" /></td></tr>

</table>

</form>

<!-- loading BEGIN -->

      <div id='siteLoader'> 

        <div id='loadImg'> 

        <img src="http://www.metataggenerator.org/images/loading2.gif" border="0" align="left" style="margin-top:-12px;"> 

        </div> 

      </div> 



<!-- loading END -->

<?php



$array_keys = array_keys($_POST);                 //strips all html and script tags globally//

for( $i=0;$i<count($array_keys);$i++ ) {

 $_POST[$array_keys[$i]] = strip_tags($_POST[$array_keys[$i]],'<meta>,<link>');

}



$source_url = $_POST['url'];



if (empty($source_url)) {

echo '<font face="arial" color="#999999">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &uarr; Enter your URL above &uarr;</font>';

} else {

$url = "http://api.facebook.com/restserver.php?method=links.getStats&urls=".urlencode($source_url);

$xml = file_get_contents($url);

$xml = simplexml_load_string($xml);



echo "For the site:<b> $source_url:</b><br />";



echo "Share &rarr; ".$shares = $xml->link_stat->share_count;

echo "<br/>";



echo "Like &rarr; ".$likes = $xml->link_stat->like_count;

echo "<br/>";



echo "Comments &rarr; ".$comments = $xml->link_stat->comment_count; 

echo "<br/>";



echo "Total &rarr; ".$total = $xml->link_stat->total_count;

echo "<br/>";

}

//echo $max = max($shares,$likes,$comments);



?>

</body>

</html>

**donatello** · 08-22-2012 03:05 AM

While the above code is not what you want, you could perhaps build a tool that shows you what it is for your page alone.

PHP Code:


<?php

$source_url = 'http://YourURL.com';  //put your url here

 

$url = "http://api.facebook.com/restserver.php?method=links.getStats&urls=".urlencode($source_url); 

$xml = file_get_contents($url); 

$xml = simplexml_load_string($xml); 



echo "For the site:<b> $source_url:</b><br />"; 



echo "Share &rarr; ".$shares = $xml->link_stat->share_count; 

echo "<br/>"; 



echo "Like &rarr; ".$likes = $xml->link_stat->like_count; 

echo "<br/>"; 



echo "Comments &rarr; ".$comments = $xml->link_stat->comment_count; 

echo "<br/>"; 



echo "Total &rarr; ".$total = $xml->link_stat->total_count; 

echo "<br/>"; 

} 

//echo $max = max($shares,$likes,$comments); 



?>

If you really want to get fancy, you could have it output the count to a file and then have a routine that emails you when the count increases...

It seems that this would accomplish the same thing.

**crmpicco** · 08-23-2012 09:37 AM

WOW - those implementations certainly look interesting, but i'm really just looking to capture the click at any stage really. Either the click of the 'Like' or the 'Post to Facebook' click.

Strangely, I had it working with the following code but it has now since stopped working. Whether that is something to do with the API i'm unsure:

Code:

     <script>
           window.fbAsyncInit = function() {
                   FB.init({
                                           status: true, // check login status
                                           cookie: true, // enable cookies to allow the server to access the session
                                           xfbml: true  // parse XFBML
                                   });
           };
     </script>
     <script type="text/javascript">
           window.fbAsyncInit = function() {
             FB.Event.subscribe('edge.create',
                     function(response) {
                           _gaq.push(['_trackSocial', 'facebook', 'like', document.location.href]);
                     }
             );
           };
     </script>

I should also point out that the reason I am attempting to capture the click of the Facebook "Like" is for Google Analytics purposes.

Thread: capture click of Facebook 'Like' button

Thread Tools

Display

capture click of Facebook 'Like' button

Thread Information

Users Browsing this Thread

Tags for this Thread

Bookmarks

Bookmarks

Posting Permissions