Cara memasang Facebook komentar di Template Blog biasa
1. Masuk ke akun blogger.
2. Pilih menu template --> Edit HTML.
3. Cari kode (CTRL+F) ini <div class='comments' id='comments'>
4. kemudian letakkan kode di bawah ini tepat dibawah kode <div class='comments' id='comments'>
<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle("#fb-comments");' title='Comments made with Facebook'>5. Silahkan cari dan ubah kata "ID FACEBOOK KAMU" dengan id facebook kamu. Dan lihat hasilnya.
<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("#blogger-comments");' 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 == "item"'>
<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'>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content='ID FACEBOOK KAMU' 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>
<style>.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;}</style>
Cara memasang Facebook komentar Responsive di Blog
Untuk anda yang sudah memasang kotak komentar facebook, tutorial ini cocok kamu terapkan di blog kamu yang sudah mendukung fitur responsive. Komentar facebook responsive berikut ini adalah kotak komentar Facebook yang dibuat responsive. Hal ini di lakukan untuk mendukung bagi yang menggunakan template responsive.
Yang perlu kamu lakukan adalah menambahkan kode javascript ini:
<script type="text/javascript">Copy dan Paste Javascriptnya, di atas kode </head>
//<![CDATA[
$(window).bind("load resize", function(){
var url = location.protocol+'//'+location.host+location.pathname;
var containercm_width = $('#container-commentfb').width();
$('#container-commentfb').html('<div class="fb-comments" ' +
'data-href="'+url+'"' +
' width="' + containercm_width + '" data-num-posts="10"></div>');
FB.XFBML.parse( );
});
//]]>
</script>
Kode FB Komennya seperti ini:
<b:if cond="data:blog.pageType == "item"">
<h4>Post Comment</h4>
<div id='fb-root'/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<div id='container-commentfb' style='width: 100%'><fb:comments expr:href='data:post.url' num_posts='5' width='500'/></div>
</b:if>
Jika bingung, hapus semua kode Facebook komen yang ada di blog kamu, lalu di ganti dengan kode yang sudah seocips berikan diatas.