Tutorial membuat kotak komentar facebook berdampingan dengan komentar blog

Nah,pada tulisan ini admin akan kembali menshare tutorial blogspot yang tentunya cukup menarik serta mudah untuk diikuti. Sesuai judulnya, yaitu tutorial cara membuat kotak komentar Facebook berdampingan disamping kotak komentar blog.

Mungkin sobat sudah gak asing lagi kan dengan hal tersebut. Namun kalau belum tahu, silahkan dilihat contohnya di blog admin yang satu lagi di http://berbahasa-arab.blogspot.com

Jadi, disini kita akan membuat dua kotak komentar sekaligus, yaitu kotak komentar Facebook dan juga kotak komentar blogger. Jadi, pengunjung bisa memilih ingin menggunakan kotak komentar yang mana untuk meninggalkan komentar di blog kita.

To the point, berikut ini caranya:

1. Silahkan masuk ke akun blogger sobat.

2. Kemudian pilih "rancangan" lalu "edit html".

3. Setelah itu, silahkan cari kode

<div class='comments' id='comments'>

(gunakan ctrl+f untuk mempermudah pencarian).

4. Nah, jika terdapat dua kode, maka silahkan pilih kode yang kedua (namun kalau gagal, silahkan coba diletakkan di kode yang pertama).

5. Lalu, copy dan paste kode dibawah ini tepat dibawah kode yang tadi kita cari

<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://icons.iconarchive.com/icons/danleech/simple/32/facebook-icon.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='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 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>
<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>

6. Ganti tulisan yang berwarna merah dengan ID akun FB sobat. Untuk mencari ID akun FB, silahkan klik cara mengetahui ID akun Facebook.

7. Lalu simpan dan lihat hasilnya. Nah, jika sobat memiliki pertanyaan, silahkan ditanyakan ya melalui blog ini ataupun melalui akun admin yang lainnya.

Selamat mencoba tutorial membuat kotak komentar facebook disamping kota komentar blog ya...

Anda baru saja membaca artikel yang berkategori Tutorial Blog dengan judul :
Tutorial membuat kotak komentar facebook berdampingan dengan komentar blog. "(5.0)"
Jika anda menyukainya, jangan lupa klik like/tweet dan bagikan keteman-temannya ya...
Hormat kami: Admin Mudah-ID

Tweet

Ditulis oleh: Ammar Ihsan - Thursday, 12 March 2015