Cara mudah embuat Komentar Facebook di Blogspot

Ok. sobat blogger semua, kali ini saya mau share mengenai cara membuat komentar facebook seperti yang ada di blog saya ini, jika tertarik let's go langsung ke prakteknya :

1. pilih rancangan

2. edit html

3. centang expand template widget supaya semua kode nimbul, oya jangan lupa back up templatenya, di download full dulu ya buat jaga jaga .

2. oke selanjutnya Ctrl + F pada Keyboard sobat, Lalu cari code di bawah ini :

<div class='comments' id='comments'>

Setelah ketemu Silahkan Copy dan Paste code berikut di bawahnya :

<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='2' width='400'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'>

3. Cari kode </head> lalu letakkan kode dibawah ini diatasnya

<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content='MASUKKAN ID FB SOBAT BLOGGER' 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>

Ganti teks yang berwarna merah dengan ID facebook kalian. ID fb nya adalah di bagian adres bar profile, contoh misalnya fb saya profilnya ini https://www.facebook.com/muhamadnurarif   , gimana ? mudahkan ?


4. cari kode ini  /* Comment atau #comments
Sesuaikan dengan yang ada di Blog, jika tidak Ketemu juga silahkan Cari Code yang semirip Mungkin
Lalu Letakkan Code Berikut di Bawah nya

.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;}

oke demikian tutorial saya mengenai membuat komentar facebook blogspot yang dapat berjejer dengan komentar di bawah artikel sehingga tampilannya bisa lebih rapi .

referensi : Kumpulancara.com