How to implement the Facebook "Like" button for my website

Question

I am trying to implement facebook like button on my website. The first four lines in the code is already there on my site after the end of the "" tag.

To implement the "Like button" i have added the second script (Line five to the end) and ran the application. Its giving me an error as

"Microsoft Jscript runtime error:'_onLoad' is null or not an object"

Please Let me know. Thanks

<script type="text/javascript" src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php"></script>
<script type="text/javascript">
    FB.init("myapikey", "xd_receiver.htm", { "reloadIfSessionStateChanged": true });
</script>
<script type="text/javascript">
  window.fbAsyncInit = function() {
    FB.init({appId: 'myappid', status: true, cookie: true,
             xfbml: true});
  };
  (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>

References: http://developers.facebook.com/docs/reference/plugins/like

<fb:like href="http://webclip.in" layout="standard" show-faces="true" width="450" action="like" font="arial" colorscheme="light"/>

Solution 1

There is a new way to add the like button on your site.

go to this page, http://developers.facebook.com/docs/reference/plugins/like-box

and create the code by plasing your parametres and click the "Get Code"

This is an example

<iframe 
    src="http://www.facebook.com/plugins/likebox.php?id=185550966885&amp;width=292&amp;connections=10&amp;stream=true&amp;header=true&amp;height=587" 
    scrolling="no" frameborder="0" 
    style="border:none; overflow:hidden; width:292px; height:587px;" allowTransparency="true">
    </iframe>

or just (if you using Javascript SDK of facebook)

<fb:like-box profile_id="185550966885"></fb:like-box>

Also in the page http://developers.facebook.com/docs/reference/plugins/like there is a Get Code... thats works, no need to add this javascript on your code.

Solution 2

With the new API, you may need to also add the following div after your body tag and before you load any facebook javascript

<div id="fb-root"></div>

Otherwise you may get a 'root' object is null error

Per documentation here http://developers.facebook.com/docs/reference/javascript/

Comments

[vamsivanka]

Aristos, I think like button and like box are completely different. like button is more related with a particular page of the website and like box is similar to fan page. for Reference money.cnn.com/2010/05/17/news/economy/credit_score_reform/… . This link has a Recommend button.

[Aristos]

@vamsivanka The like button, on the page that you have give, if you press "Get Code" you get the code that you need to place on you page. This is not what you looking for ?

[vamsivanka]

I am able to get the code and is working good. But it is conflicting with the existing script (first four lines of code in my question which is used for fb login.