Cara Mudah Membuat Kolom Komentar Facebook di Blog


 


 Setelah berhasil membuat fan page facebook untuk blog saya, yaitu Blog Andro-black, selanjutnya saya ingin membuat kolom komentar untuk fanspage facebook di bawah setiap artikel atau postingan di blog itu.

Lalu bagaimana caranya membuat kolom komentar facebook di blog itu? Sebenarnya facebook telah memberi penjelasan bagi kita untuk itu. Akan tetapi mungkin kita masih tidak begitu jelas akan petunjuk facebook. Ini seperti yang saya alami sendiri. Setelah mencoba beberapa kali saya barulah saya berhasil membuat sebagaimana yang saya inginkan.
 
 

Pertama tentu saja login ke akun facebook saya, login dengan username dan password yang benar, kemudian langsung saja buka alamat https://developers.facebook.com/docs/plugins/. Itu adalah cara ringkas dan cepat untuk kita dalam membuat kotak komentar facebook di blog.

Selanjutnya pilih Comments.

 Sehingga akan nampak seperti gambar di bawah
 Pada URL to comments on (?) kita isi dengan halaman fan page facebook yang telah kita buat sebelumnya. Pada contoh saya adalah :https://www.facebook.com/pages/Andro-Black/158468244309910?ref=hl Jika alamatnya benar akan muncul logo dan tampilan kotak komentar .

Isian Width sesuaikan dengan lebar kolom artikel di blog, saya ganti jadi 850 (terserah anda). Lalu Number of Post masukkan terserah berapa posting yang hendak ditampilkan (pada kasus saya ini saya biarkan saja 10). Dengan Color scheme, kita bisa memilih tampilan kotak komentar, yaitu light atau dark, sesuaikan dengan tampilan blog. Light bila latar belakang artikel blog kita terang, dan dark bila latar belakang artikel blog kita gelap, misalnya hitam.

Bila sudah dirasa cocok, terakhir klik Get Code, sehingga muncul tampilan:

Lalu masuk ke akun Blogger saya, Pilih Template, Pilih Edit HTML
Kemudian centang Expand Widget Templates

Cari </head> dengan bantuan Ctrl F
masukkan Code Script nomor 1 tepat di bawah </head> 

kemudian cari kode <div class='post-footer-line post-footer-line-3'><span class='post-location'>
Bila gak ada, cari yang mirip ma kode di atas

Copy/masukkan Code Script nomor 2 tepat di bawah <div class='post-footer-line post-footer-line-3'><span class='post-location'>  , sehingga bentuknnya menjadi :

<div class='post-footer-line post-footer-line-3'><span class='post-location'>
<div class="fb-comments" data-href=https://www.facebook.com/pages/Andro-Black/158468244309910?ref=hl" data-width="850" data-num-posts="10"></div>

Terakhir Save template. dan lihat hasilnya dengan membuka URL salah satu postingan blog. Pada contoh saya tampilannya adalah sebagai berikut:

 

Subscribe to receive free email updates: