Jumat, 13 Desember 2013

Cara mudah membuat kolom komentar Facebook di blog

Setelah saya share artikel tentang Cara mengganti style atau background di google chrome, sekarang saya akan share artikel tentang bagaimana Cara Mudah Membuat / Menambahkan kolom Komentar Facebook Pada Blog untuk sobat blogger.

Lalu bagaimana cara membuat kotak komentar facebook di blog,.??
Sebenarnya facebook sudah menyediakannya, tapi sebagian dari kita atau lebih mungkin belum tau. Saya sendiri sebenarnya tidak tau akan adanya itu, setelah saya googling-googling, akhirnya saya menemukan cara mudah membuat kolom komentar facebook di blog dan tidek ribet dalam pembuatannya.
Contoh kotak komentar facebook di blog
Berikut cara untuk membuat kotak komentar facebook di blog. Cara ini berguna bagi yang sudah membuat fanspage facebook.
  • Login ke akun Facebook sobat.
  • Buka URL berikut : https://developers.facebook.com/docs/plugins/ Ini adalah cara singkat dan mudah untuk sobat membuat kotak komentar facebook di blog.
  • Pilih comments.

  • Kemudian akan tampil gambar seperti dibawah ini.
  • Kotak yang berwarna merah adalah kotak yang harus diisi oleh sobat untuk membuat kotak komentar facebook.
  • Kotak yang berwarna biru adalah preview kotak komentar yang sobat buat.

Oke, lanjut ke topik pembuatan lagi

  • Pada URL to comment on sobat isi dengan halaman fanspage facebook yang telah sobat buat sebelumnya. 
  • Contoh: https://www.facebook.com/pages/irvanefendyblogspotcom/117682271723386. Ini adalah contoh fanspages URL yang saya buat.
  • Jika URL yang sobat masukan benar, maka akan muncul logo/profil picture dan kotak komentar seperti screenshot di bawah ini.
  • Isian Width disesuaikan dengan lebar kolom artikel di blog sobat. Sebagai contoh, lebar kolom artikel saya 800 px, jadi saya isikan ke ke kolom Width 725 px.
  • Isian Number of post terserah sobat blogger. Pada kasus saya ini saya biarkan saja 10.
  • Pada Color Scheme sobat blogger dapat memilih tampilan kotak komentar. (Disesuaikan dengan template sobat masing-masing)
  • Bila dirasa sudah cocok semuanya, sobat blogger klik Get Code, sehingga muncul tampilan seperti ini :
  • Langkah selanjutnya yaitu, Copy Script no 1
  • Lalu masuk ke akun Blogger sobat, Pilih template, pilih edit HTML
  • Cari </head> dengan cara Ctrl+F
  • Jika sudah ketemu </head> paste Script no 1 Tepat dibawah kode </head>
  • Kemudian Simpan / Save Template

Sekanjutnya untuk script no 2

Copy script no 2
  • Pilih template, pilih edit HTML, kemudian centang Expand Widget Templates. (Untuk versi Edit HTML sebelum Pembaharuan). Untuk Versi Edit HTML terbaru sobat blogger bisa Klik Arrow yang ada di sebelah no script (Pada kasus ini tidak usah di Expand)
Cari : <div class='post-footer-line post-footer-line-3'><span class='post-location'>
  • Paste / tempel Script no 2 tepat dibawah kode <div class='post-footer-line post-footer-line-3'><spanclass='post-location'>
  • Save Tempate

Jika ada dari sobat blogger yang mengalami Error saat menyimpan template script no 1, diperkenankan buat mem-Parse coding HTML script 1 Disini. Setelah itu Copy hasil Parse tersebut, kemudian Paste / Tempel di bawah kode </head> (ini hanya berlaku bagi sobat blogger yang mengalami Error)

Tidak ada komentar:

Posting Komentar

 
;);