Cara Membuat Komentar Facebook dan Blog Model Tab

Nah kembali lagi sobat gembel, di artikel ini membahas tentang Cara Membuat Komentar Facebook dan Blog Model Tab. Komentar facebook dan blog model tab? maksudnya seperti apa? biar sobat tidak bingung, bisa melihat contohnya pada gambar di bawah ini

Nah kalau sudah mengetahui Inilah Cara Memasang Kolom Komentar Facebook dan Blog Model Tab

1. Login blogspot, masuk ke Edit HTML. DAn jangan lupa di back up dulu templatenya sobat.
2. Cari kode berikut <div class='comments' id='comments'>
3. Kode berikut di bawah kode di atas
<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='100%'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'>
4. Cari kode </head> kemudian pastekan kode berikut di atasnya
<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 Facebook' 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>
5. Kemudian cari kode berikut /* Comment atau #comments. Kemudian letakkan kode berikut di bawahnya
.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;}

Keterangan :

• Ganti kode dengan warna HIJAU sesuai jumlah coment yang akan di tampilkan di blog anda
• Ganti kode warna merah dengan id facebook teman teman, contoh alamat fb saya https://www.facebook.com/likegembel nah, id nya adalah likegembel atau "USER_ID":"117200684972205"

Kalau sudah Save dan lihat hasilnya :)

Semoga artikel Cara Membuat Komentar Facebook dan Blog Model Tab bermanfaat untuk mempercantik tampilan blog anda