Facebook call like button integration - not showing in action

Question

I am trying to integrate the Facebook Like button, where the Like action is integrated with the callback function. It seems to work, except that the “Like” activity does not appear on Facebook.

I am testing this with my own Facebook account and do not see activity in my channel, profile page or activity log.

Here is my url: http://flevy.com/powerpoint-plugin-test

Here is my code:

<script src=\"http://connect.facebook.net/en_US/all.js\" type=\"text/javascript\"></script> <script> window.fbAsyncInit = function() { // init the FB JS SDK FB.init({ appId : 'xxxxxx', // App ID from the App Dashboard status : true, // check the login status upon init? cookie : true, // set sessions cookies to allow your server to access the session? xfbml : true // parse XFBML tags on this page? }); FB.Canvas.setAutoResize(); }; </script> <div class=\"fb-like\" data-href=\"$share_url\" data-send=\"false\" data-layout=\"box_count\" data-width=\"50\" data-show-faces=\"false\"></div> // facebook callback FB.Event.subscribe('edge.create', function(href, widget) { deliverEmail(); }); 

Answer 1

First, I will fix errors in the Open Graph debugger:

https://developers.facebook.com/tools/debug/og/object?q=http%3A%2F%2Fflevy.com%2Fpowerpoint-plugin-test

Errors to be fixed

 Object Invalid Value Object at URL 'http://flevy.com/powerpoint-plugin-test' of type 'website' is invalid because the given value '//flevy.com/images/slides.gif' for property 'og:image:url' could not be parsed as type 'url'. 

Answer 2

In javascript, an error message is thrown:

Uncaught TypeError: Object # does not have a 'setAutoResize' method

AFAIK, now the setAutoResize function is deprecated. See https://developers.facebook.com/roadmap/completed-changes/#september-2012

And, as I understand it anyway, even the function that replaced it should be used when you upload it inside Facebook Canvas.

So check what you are doing here! :)

Answer 3

There are a lot of HTML syntax / validation issues on this page. You switch from single quotes, double quotes, and quotes in your HTML for your attribute values. The code also lacks some trailing tags. This can lead to some erratic behavior. Your JavaScript has the same problems when you use a single and then double in the same script block ... for now it really looks.

You can run the check:

http://validator.w3.org/check?uri=http%3A%2F%2Fflevy.com%2Fpowerpoint-plugin-test&charset=%28detect+automatically%29&doctype=Inline&group=0

The Open Graph statement that @DrBeza says should also be allowed. Not sure why the infrastructure doesn't like a URL other than the protocol, but just add http: // or https: // to this image.

After cleaning, it should be easier to troubleshoot or problems may be the result of the necessary cleaning.