Cara Mudah Memasang Kotak Komentar Facebook Di Blog

Untuk memasang kotak komentar facebook di blog
ikuti langkah-langkah dibawah ini
A. Langkah Pertama :

1. Login dulu ke account blogger kamu
2. Klik Design > Edit Html > Klik Expand Widget Templates
Untuk menghindari sembarang kesalahan saat memasang code ini,
sobat usahakan Download Full Templates sebagai langkah keselamatan.
Nanti kalau tidak jadi, Hanya perlu Upload semula fail tersebut
dan template anda akan kembali menjadi seperti semula.

lihat gambar dibawah ini :

3. Cari kode <div class='comments' id='comments'>
Gunakan CTRL+F untuk mencari kode <div class='comments' id='comments'>
Pilih kode yang ke 2

4. Copy kode dibawah ini, dan letakan dibawah kode <div class='comments' id='comments'>

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

5. Cari Kode <head>
untuk memudahkan gunakan CTRL+F untuk mencari kode <head>

Copy kode dibawah ini,letakan dibawah kode <head>

Keterangan : Ganti YOUR_FB_ID dengan ID Facebook kamu.
Untuk mencari ID facebook,
Buka Facebook kamu dan lihat URL seperti contoh ini :
http://www.facebook.com/profile.php?id=100001761409249.
nomor yg berwarna merah itu adalah ID Facebook saya

6. Klik Preview/Pratinjau, jika tiada kesalahan Klik save

Nah, sekarang dah habis Edit HTML.

Selanjutnya adalah langkah memasukan kode kedalam bahagian CSS.
B. Langkah Kedua :

1. Klik Design > Template designer > Advanced > Add CSS
2. Copy kode dibawah ini dan masukan kedalam kotak Add CSS

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

Keterangan : Bagi sobat yang menggunakan text warna putih,
Sobat bisa mengganti warna backround kotak komen pada
.comments-page { background-color: #f2f2f2;}
Dengan warna lain selain hitam dan putih, tujuannya
Agar text komen sesuai dengan warna backgroud.
Jika sobat kesulitan mencari kode warna
Klik Disini untuk mencari kode warna

3. Jika pemasangan kode CSS tidak berfungsi/tidak berhasil
Sobat letakan kode CSS tadi sebelum kode ]]></b:skin>
pada Edit HTML

4. Klik Preview?pratinjau
Jika Tidak ada kesalahan KLik save/Simpan

Akhirnya Sobat Berhasil Memasang Kotak Komen Facebook Pada Blog Sobat

selamat mencoba....