Cara Membuat Komentar Facebook di Blogspot lebih Rapi dan Keren

Cara Membuat Komentar Facebook di Blogspot. baik sobat blogger semua kali ini saya mau share mengenai cara membuat komentar facebook seperti yang ada di blog saya ini, ehem..dimana saya juga sebelumnya sudah menjelaskan mengenai cara memasang komentar facebook di bawah postingan blog, namun kali ini caranya lebih oke dan top deh , seperti gambar ini .


nah itu gambar yang ada komentar facebook di bawah postingan di blog saya, gimana ? tertarik sobat ? kalau tertarik yuk kita belajar buat itu :

1. pilih rancangan, edit html, centang expand template widget supaya semua kode nimbul, oya jangan lupa back up templatenya, di download full dulu ya buat jaga jaga .

2. oke selanjutnya Ctrl + F pada Keyboard sobat, Lalu cari code di bawah ini :

<div class='comments' id='comments'>
Setelah ketemu Silahkan Copy dan Paste code berikut di bawahnya :

<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='2' width='400'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'>
3. Cari kode </head> lalu letakkan kode dibawah ini diatasnya

<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>
 ID fb nya adalah di bagian adres bar profile, contoh misalnya fb saya profilnya ini http://www.facebook.com/berryhardisakha  maka ID saya berryhardisakha , gimana ? mudahkan ?


4. cari kode ini  /* Comment atau #comments
Sesuaikan dengan yang ada di Blog, jika tidak Ketemu juga silahkan Cari Code yang semirip Mungkin
Lalu Letakkan Code Berikut di Bawah nya

.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;}
oke demikian tutorial saya mengenai membuat komentar facebook blogspot yang dapat berjejer dengan komentar di bawah artikel sehingga tampilannya bisa lebih rapi .

referensi : Kumpulancara.com

You May Like :

22 Responses to "Cara Membuat Komentar Facebook di Blogspot lebih Rapi dan Keren"

Faris Farhan mengatakan...

setelah 4X percobaan gagal trs.
sekarang udah bisa.
hatur nuhun kang.

Berry Hardisakha mengatakan...

mantap sob :) siip

Faris Farhan mengatakan...

mau nanya nih...
tau gak caranya biar klo ada yang mau mengcopy artikel, si sumbernya langsung muncul.
kaya blognya: http://menujuhijau.blogspot.com/ sama http://jelajahunik.blogspot.com/

Berry Hardisakha mengatakan...

@Faris Farhan Sip gan , ane jawab di blog agan :)

FIKRISHARE.COM - Free Download Software Full Version mengatakan...

terima kasih mas caranya berhasil diterapkan di blog saya.

Berry Hardisakha mengatakan...

mantap sob :)
silahkan di liat liat yang lainnya :)

Aluwy Chelung mengatakan...

kenapa punya saya ngga bisa gan???? http://www.adaisinya.com

Berry Hardisakha mengatakan...

coba cek lagi peletakkan yang di comment itu..yg langkah terakhir :)

Achmad Reza mengatakan...

#comments terlalu banyak kang, susah nyarinya ?

Berry Hardisakha mengatakan...

@Achmad Reza coba 1satu gan, coba di tes :)

JeQ mengatakan...

sipp... keren dah...

drieant mengatakan...

gan kenapa punya ane da yang muncul ada yang engga? terutama posting baru kadang ga muncul, di tunggu si kangan muncul kadang juga engga. kenapa ya? ada yang keliru ane? padahal sudah sesuai instruksi?

sukague.com mengatakan...

sip.. kaya gini ya hasilnya nanti ?

Berry Hardisakha mengatakan...

ya seperti yang ada di blog saya :)

juan mengatakan...

thanks gan infonya.. sangat membantu,..
tapi permasalahannya di saya itu gini..
dia mesti ada komentar dari blogger baru bisa muncul komentar untuk facebook.. kenapa itu yah ?
mohon pencerahannya

Singgah di blog saya ya gan, thanks

HENDRO mengatakan...

saya sudah coba mas,,, tpi ko gs ad hsil nya ya...

Bokep SMU mengatakan...

wahh saya izin coba ya mass :)

edwinprayoga mengatakan...

Sekali coba langsung jadi, artikelnya sangat bermanfaat gAn. . . trimakasih sangat!!!!

Ivan Fajar Satria mengatakan...

agan setelah saya coba tutorial ini.. sudah bisaaa..
tapii masalahnyaa.. kenapa berbeda jauh yaahh sama yg punyaa agaan??

kalo punya saya tampilan coment facebooknya kenapa jadi transparan?? tidak seperti punya agan??

trus crusornya pun kalo punya agan. kalo didekatkan ke button FBcoment/ Blog coment berubah jadi kaya tangan gituu.. sedangkan di blogsaya crusornya arrow sajaa tidak berubahh??

tolong di jawab yaa gan :) thankss a lot

Berry Hardisakha mengatakan...

mungkin pengaruh perbedaan template juga gan , asal agan mengikuti tutorial ni secara tepat maka itu sudah benar :)

MYZACKY mengatakan...

kok gue gak jadi masih cuma blogger doank

Abed Saragih mengatakan...

Scriptnya mantap Mas.Trims ya.