¡¡Compartenos!!

lunes, 26 de diciembre de 2011

Boton Me gusta de facebook, funciones que se ejecutan al pulsarlo

Buenas a todos. Aqui os dejo un articulo que para mi no tiene precio. Se trata de un articulo mediante el cual podremos configurar el boton ME GUSTA de Facebook para poder ejecutar llamadas a funciones cuando se efectue sobre el cualquiera de las 2 posibles acciones, es decir, si pulsas ME GUSTA se llama a una funcion, si pulsas YA NO ME GUSTA se llama a otra funcion.
Mas info tras el salto



http://facebook.stackoverflow.com/questions/2798622/facebook-like-button-callback
http://www.garytheguru.com/2010/05/call-back-function-on-facebook-like-button/
http://stackoverflow.com/questions/6817894/fb-event-subscribe-not-firing-for-certain-events
http://www.saschakimmel.com/2010/05/how-to-capture-clicks-on-the-facebook-like-button/
http://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe/


<script>
  FB.Event.subscribe('edge.create', function(href, widget) {
    alert('You just liked the page!');
  });
</script>

So I'm trying to do some event handling when a user clicks the like button.
My Facebook button is being created asynchronously via:
(function() {
    var e = document.createElement('script'); e.async = true;
    e.src = document.location.protocol +
    '//connect.facebook.net/en_US/all.js';
    document.getElementById('fb-root').appendChild(e);
}());
And that works great.
I have the following function running as well:
window.fbAsyncInit = function() {
    FB.init({status: true, cookie: true, xfbml: true});
    FB.Event.subscribe("xfbml.render", function() {
        console.log('xfbml.render');
        FB.Event.subscribe("edge.create", function(targetUrl) {
            console.log('edge.create');
        });
        FB.Event.subscribe("edge.remove", function(targetUrl) {
            console.log('edge.remove');
        });
    });
};
So far, when I load the page, I get 'xfbml.render' in the console. Then I click the like button & I get nothing.
I'd like for it to spit out the console message 'edge.create'.
Does anyone have any idea what could cause this?
I've put this page on a publicly accessible site before (It's currently on my dev rig) & it still didn't work. I can again if requested.
Here's a full working code:
<!doctype html>
<html lang="en" xmlns:fb="https://www.facebook.com/2008/fbml">
<head>
  <meta charset="utf-8">
  <title>Facebook Like Button</title>
</head>
<body>
<div id="fb-root"></div>
<script>
  window.fbAsyncInit = function() {
    FB.init({appId: 'YOUR_APP_ID', status: true, cookie: true,xfbml: true});
    FB.Event.subscribe("xfbml.render", function() {
        console.log('xfbml.render');
            FB.Event.subscribe("edge.create", function(targetUrl) {
                console.log('edge.create');
            });
            FB.Event.subscribe("edge.remove", function(targetUrl) {
                console.log('edge.remove');
            });
    });
  };
  (function() {
    var e = document.createElement('script'); e.async = true;
    e.src = document.location.protocol +
      '//connect.facebook.net/en_US/all.js';
    document.getElementById('fb-root').appendChild(e);
  }());
</script>
<fb:like></fb:like>
</body>
</html>

Otro metodo

<iframe src="http://www.facebook.com/plugins/like.php?href=www.jesterkaraoke.com&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=35" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:35px;" allowTransparency="true"></iframe>

No hay comentarios:

Publicar un comentario