How to add Facebook connect to Blogger
There are two implementations:
- XFBML (requires use of the JavaScript SDK)
- Iframe (simply add the Iframe HTML to your site)
Step 1 : Create an application
First of all, we need to create or register an application for your blog. to register it just hit this link :
http://developers.facebook.com/setup/
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() {
FB.init({appId: 'your app id', 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>
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. window.fbAsyncInit = function() {
FB.init({appId: 'your app id', 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>
** 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 : 

0 comments: