Facebook for websites
There are two implementations:
  • XFBML (requires use of the JavaScript SDK)
  • Iframe (simply add the Iframe HTML to your site)
Note : if you are using my old tutorial (How to add Facebook connect to Blogger (updated) ) to add Facebook Connect, please delete all the code used in your blog in order to start with the new one without any trouble.

Step 1 : Create an application

Create Application
First of all, we need to create or register an application for your blog. to register it just hit this link :
Enter a name for your application (I prefer the same name as my blog’s name) , the URL of your blog (do not forget the “/” at the end of your URL) and choose the language that you use in your own blog.

STEP 2 : Put a couple of code lines (For XFBML)

Login your Dashboard > Design > Edit HTML then put this couple lines of code :
<div id="fb-root"></div> <script>
window.fbAsyncInit = function() {
'your app id', status: true, cookie: true,
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
You need just to put a few lines into your template between <body> tag and change APP_ID  with your own Facebook application ID then you are ready to implement Facebook widget.
** you may get this code after registering your application on Facebook.

Step 3 : Facebook Plugins

There is a lot of plugins that help you to make your blog more interactive where your reader can share your content with their friends on Facebook, for example the famous Like button :

<fb:like expr:href='data:post.url'  font="arial"></fb:like>
For more options and more Facebook widgets, please check this links just below :
Related posts :