Membuat Komentar Facebook dan Blogger di Blog

Menambahkan Plugins Komentar Facebook diposting Blogger - Assalamu'alaikum semuanya ? :) Kali ini saya akan membahas tentang komentar facebook dan blogger berdampingan di blog :D Diantara sekian banyak pengunjung yang datang dan ingin berkomentar di blog kita sangat mungkin diantara mereka ada yang tidak memiliki Open ID. Tentu saja kita bisa memperbolehkan 'anonymous' akan tetapi cara ini sering mengundang spam. Sebagai alternatif kita bisa memasang kolom komentar untuk akun facebook, selain bisa lebih memfilter spam juga bisa lebih mempercantik tampilan blog kita.

Ada beberapa langkah yang bisa kita lakukan untuk menambahkan plugins komentar menggunakan akun facebook kita di postingan blogger, sebagian dari cara-cara tersebut malah membuat blog kita jadi tidak enak dipandang sebab posisinya tidak proporsional. Misalnya, kolom komentar plugins facebook tersebut berada di bawah kolom komentar blogger, praktis jadi ada 2 kolom komentar kosong yang terlihat di bawah postingan kita. Kasus seperti sebetulnya karena penempatan HTML nya saja yang kurang pas.

Dibawah ini langkah-langkah membuat plugins komentar facebook yang menurut saya relatif proporsional karena tampilannya berada tepat berderet dengan tombol postingan blogger, sehingga komentator bisa memilih mau komentar pakai akun yang mana, tanpa tampilan pilihannya tumpang tindih.

Langsung saja, langkahnya sebagai berikut :

1. CSS
Masuk ke dashboard >> Edit Template >> Expand Template Widget, tempatkan kode CSS di bawah ini tepat di atas kode ]]></b:skin>

/* komentar facebook */
.comments-page {}
#blogger-comments-page {display: none;}
.comments-tab {float:left; padding: 5px; margin-right: 3px; cursor: pointer; background-color: #f2f2f2; border-radius:4px;}
.comments-tab-icon { height: 16px; width: auto; margin-right: 3px;}
.comments-tab:hover { background-color: #eeeeee;}
.inactive-select-tab { background-color: #d1d1d1;}

2. HTML :
Cari kode:
<div class='comments' id='comments'>

Biasanya terdapat lebih dari satu kode di atas pada template blogger, jika anda ingin agar plugins komentar facebook itu tampil di setiap postingan, silahkan simpan kode HTML di bawah ini tepat di bawah kode-kode tersebut.

<!-- HMTL komentar facebook start -->
<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='4' width='500'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'>
<!--HTML komentar facebook end -->

Note :
Nilai 500 di atas adalah lebar kolom komentar yang bisa sobat sesuaikan sendiri berdasarkan kebutuhan.

3. Javascript
Letakkan kode di bawah ini tepat di atas kode </head>

<!--script komentar facebook start -->
<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>
<!--script komentar facebook end -->

Ganti tulisan MASUKKAN ID FB SOBAT BLOGGER dengan ID Facebook sobat

Preview terlebih dahulu lalu save. Sekarang Di bawah postingan blog sobat akan terdapat kolom untuk pengunjung berkomentar menggunakan menggunakan akun facebook mereka.

Sumber : kerahledrek.asia
Kata Kunci : Membuat Komentar Blog dan Facebook Berdampingan, Cara Memasang Komentar Facebook Dan Blogger Berdampingan, kotak komentar facebook, kotak komentar fb dan blog berdampingan,Membuat Komentar Facebook dan Blogger Berdampingan, Cara Membuat Komentar Facebook Dan Blog Berdampingan, Menambahkan komentar (comment) Facebook pada Blogspot, Cara Membuat Komentar Facebook di Blogger Blogspot, Menambahkan plugins komentar facebook di posting blogger.