Tutorial : How To Add Facebook Comment Box To Blogs

Greetings everyone. Nowadays, facebook comment box are getting famous on blogs.. Byk org inginkan comment box dlm blog dorg masing2..hehe.. since I've been having a lot of requests and questions about putting facebook comment box on blog sidebars, so I've decided to make my very own first tutorial on how to put the FB comment box on our sidebar :-)

Ya la... dalam hidup ni, x baik kedekut ilmu.. betul x? hehehe..

P/S : Biarlah bahasa rojak, yang penting faham. 1Malaysia kan? hehe 

 jgn jelezz..you'll be having yours soon. hehe

 Siapa yang request ni? eh byk weh...yang boleh list down, miss hidayah, iza arm, fajratul aini n byk lagi..

Kepada Bro Aie, harap dapat terjawab jugak lpas baca tutorial ni... kalau masih ada problem, cari aku bro~

This tutorial uses blogger/blogspot blog for demo. However, it will also work with other blog or websites. Okay, here goes nothing~

Step 1: Visit Facebook developer page and then enter your blog name, blog URL and click on Create application.

Step 2: Pas tu dapat la benda mcm di bawah ni. Copy your App ID and paste it somewhere so u won't lost it (letak kt notepad pun ckup laa).

Step 3: Login to your blogger dashboard and go to Layout > Edit HTML . jgn lupa tick on 'expand widget templates' . tekan CTRL + F, then type in . You'll have something like this

Step 4: Copy code below and paste it under on your HTML template. Don't forget to change YOUR-APP-ID with your own APP ID. 

<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>

Step 5: You are almost done. Copy the code below and put it on anywhere you want the comment box to be. You can change the width as you want. and you can change the number of posts to be shown. :-)

<fb:comments numposts="10" width="550"></fb:comments>

Step 6 : Refresh and walahhh~! Facebook comment box on your very own blog. hehe.

 Don't forget to drop some comments for feedback and help. Hope you'll be able to work everything out without a problem. Happy trying~!

Do you think that my tutorial is useful? If yes, do support :)

I will be posting more tutorials after this, only if this first tutorial dapat sambutan. hehe. take care guys :)