Cara Memasang Komentar Facebook dan Blog Bersebelahan

Cara Memasang Komentar Facebook dan Blog Bersebelahan - Sedikit perlu saya jelaskan manfaat adanya kolom komentar Facebook di blog yaitu akan meningkatkan jumlah pengunjung blog anda melalui Facebook. Kok bisa? Karena setiap anda berkomentar maka komentar anda akan tampil di halaman beranda (biasanya ada di sidebar sebelah kanan Facebook) facebookers yang lain dan jika facebookers tersebut membaca update-an komentar anda dan mengkilk tautan komentar tersebut maka secara langsung facebookers tersebut akan diarahkan ke blog anda. Tapi ingat! kolom komentar Facebook di blog ini akan berfungsi maksimal jika yang berkomentar sedang dalam keadaan aktif dengan akun facebooknya atau tidak mencentang Post to Facebook yang ada didalam kolom komentar.

Langkah-langkah:

1. Cari kode berikut <div class='comments' id='comments'> 
kode ini biasanya ada ,. anda pilih yang ke-2 dan copy paste kode dibawah ini tepat di bawah kode ke-2. 

<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle("#fb-comments");' 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("#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='3' width='400'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'>

Code num_posts='3' width='400' sobat ganti sesuai dengan selera sobat. 3=jumlah komentar facebook yg akan tampil, 400=lebar kotak komentar. Sebenarnya tidak dirubah juga udah bagus kok.

2.Cari kode </head> dan letakan kode dibawah ini tepat diatas kode </head>

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

ID Facebook : Ganti dengan ID Facebook sobat, misalkan http://www.facebook.com/david.immanuel.792

3.Cari kode berikut /* Comment atau #comments atau /* Comments----------------------------------------------- */ berhubung setiap template berbeda-beda, kalo tidak menemukan ketiga code tersebut. sobat cari saja yang mirip dengan code tersebut. Pokoknya kode yg mengatur komentar. kemudian copy paste kode dibawah ini tepat dibawah kode tadi.

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