Memasang Komentar Blog Dan Facebook Berdampingan


facebook dan blog logo arieshp.blogspot.com

Buat anda semua mungkin hari ini Admin ingin memposting sesuatu yang berbeda dengan biasanya ( karena seharusnya postingan Admin itu kan tentang applikasi handphone kesayangan anda semua HeHeHe ) tapi pada kesempatan ini Admin ingin memposting cara "Memasang Komentar Blog Dan Facebook Berdampingan".


blog dan facebook coment

Admin ingin berbagi postingan ini, karena Admin anggap sangat penting bagi semua blogger baru di dunia maya. Seperti yang anda ketahui mungkin sebagian orang tidak mengerti menggunakan kotak komentar di blog, tapi jika ada kotak komentar facebook maka akan sedikit berbeda.

Langkah-langkah pemasangan Komentar Blog Dan Facebook Berdampingan.

  1. Seperti biasa  masuk ke akun blogger.
  2. Pada tab menu pilih Rancangan ➨ Edit HTML ➨ Expand Template Widget.
  3. Sekarang di dalam Edti Template, cari kode ]]></b:skin> Jika kesulitan mencarinya coba gunakan control F.
  4. Jika sudah ketemu, copy kode di bawah ini dan paste, letakkan di atas 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;}

*Jika ingin latar belakang keduanya transparan maka cukup hilangkan kode warna biru.

     5. Sekarang sobat cari kode </head> lalu copy kode berikut dan paste atau letakkan 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='ID FB Sobat Disini' 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>

*Perhatikan teks warna merah, ganti teks tersebut dengan ID Fans Page atau Id Facebook anda, untuk mengetahui ID Facebook anda copy link ini "https://graph.facebook.com/username " Ganti username dengan nama Facebook anda.

     6.Masih di dalam Edit HTML, sekarang cari kode <div class='comments' id='comments'> Lalu copy kode berikut dan paste, letakkan di bawahnya.

*Biasanya kode <div class='comments' id='comments'> ada 2 jadi  pilih kode yang kedua !

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

*Hapus kode warna ungu jika di bawah template terdapat kode yang sama.

*Perhatikan kode warna biru: angka adalah jumlah komentar yang akan di tampilkan di komentar facebook, anda bisa mengubahnya. Angka 500 adalah lebar kotak komentar facebook, Anda dapat mengubah sesuai template anda.

Save Template.

Jika belum berhasil silakan kunjungi Google HeHeHeHe....

Comments