Tutorial Cara Menciptakan Kotak Komentar Facebook Di Blogger

Pasti kau pernah tau kolom komentar facebook yang ada di blog,seperti di blog saya ini.
kolom komentar facebook di pasang di blog memberi manfaat tersendiri , antara lain :
- Jika ada pengunjung menulis komentar di blog , maka secara otomatis pengunjung   membagikan / mengshare blog kau ke kronologi seorang pengunjung tersebut.
- berdasarkan survei saya , sebagain besar pengunjung blog tidak mempunyai akun blogger , malah mereka mempunyai akun facebook , hal ini akan memudahkan pengunjung untuk memperlihatkan balasan di blog kamu


Langkah - Langkah "Cara Membuat Kotak Komentar Facebook di Blogger"

1.Login Ke blogger kamu
2.Klik "Template" pada sisi Kiri

3.Tekan CTRL+F Lalu Cari Kode :
    ]]></b:skin>

    kemudian Taruh Script Berwarna biru  :

    .comments-page { background-color: #f2f2f2;}#blogger-comments-page { padding: 0px 5px; display: none;}.comments-tab { float: left; padding: 5px; margin-right: 3px;cursor: pointer; background-color: #f2f2f2;}.comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}.comments-tab:hover { background-color: #eeeeee;}.inactive-select-tab { background-color: #d1d1d1;}

  di atas  ]]></b:skin> 

4. Tekan CTRL+F -> Cari Kode </head>

Masukkan Script dibawah ini , di atas arahan </head>

<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content='IDfacebook' property='fb:admins'/>
<script type='text/javascript'>
function commentToggle(selectTab) {
$(".comments-tab").addClass("inactive-select-tab");
$(selectTab).removeClass("inactive-select-tab");
$(".comments-page").hide();
$(selectTab + "-page").show();}
</script>

"IDFacebook" ganti dengan Link Url Facebook mu

contoh link url facebook saya : 

https://www.facebook.com/MenteriSosialRepublikIndonesia

5.Kemudian Cari lagi arahan <div class='comments' id='comments'>

biasanya ketemu 2 arahan , copy semua aja ^^

copy script di bawah ini , di atas arahan <div class='comments' id='comments'>

 <div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle(&quot;#fb-comments&quot;);' title='Comments made with Facebook'><img class='comments-tab-icon' src='http://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.png'/><fb:comments-count expr:href='data:post.url'/> Comments</div><div class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle(&quot;#blogger-comments&quot;);' title='Comments from Blogger'><img class='comments-tab-icon' src='http://www.blogger.com/img/icon_logo32.gif'/> <data:post.numComments/> Comments</div><div class='clear'/></div><div class='comments-page' id='fb-comments-page'><b:if cond='data:blog.pageType == &quot;item&quot;'><div id='fb-root'/><fb:comments expr:href='data:post.url' num_posts='5' width='450'/></b:if></div><div class='comments comments-page' id='blogger-comments-page'> 

5     = banyaknya komentar yang di tampilkan
450 = lebar kotak komentar 


contoh gambar : 

 
 6.Jika sudah mengikuti langkah di atas , Klik "Simpan Template"


Berikut ialah hasil Tutorial di atas :