Sunday, November 11, 2012

Membuat Tombol Like (Facebook) di Blogger

Ini merupakan salah satu cara penyebaran sebuah blog ke Facebook. Sebenernya sich ga' beda jauh dengan share ke Facebook. Intinya sama² mengirimkan link halaman yang disukai seseorang ke akun Facebook pembaca blog tersebut. Dengan adanya tombol like ini, pengunjung dan pemilik blog sama² diuntungkan. Pengunjung dapat menyimpan halaman sebuah blog yang (mungkin) dianggap penting, dan pemilik blog diuntungkan dengan (secara ga' sengaja) promosi gratis di Facebook.

Oke kita menuju ke langkah²nya :
  1. Login dulu ke akun Blogger kamu
  2. Masuk ke halaman "Rancangan" - "Edit HTML"
  3. Centang "Expand Template Widget"
  4. Masuk ke http://developers.facebook.com/docs/reference/plugins/like/ untuk mendapatkan kodenya
  5. Sebelumnya setting dulu bentuk dan wujud tombol like yang kamu inginkan di bagian "Step 1 - Get Like Button Code"
  6. Setelah selesai, klik tombol "Get Code"
  7. Copy kode tersebut, saranku gunakan kode pada "IFRAME"
  8. Kembali ke halaman "Edit HTML" di Blogger kamu
  9. Cari kode
    <data:post.body/></b:if></p>
    Biar cepet nemuinnya, pencet "Ctrl+F" trus masukkin kode di atas pada kolom pencarian
  10. Contoh hasilnya seperti ini
    <data:post.body/></b:if></p>
    <iframe src='//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fpunyamasbagus.blogspot.com&amp;send=false&amp;layout=standard&amp;width=450&amp;show_faces=true&amp;action=like&amp;colorscheme=light&amp;font&amp;height=80' scrolling='no' frameborder='0' style='border:none; overflow:hidden; width:450px; height:80px;' allowTransparency='true'></iframe>
  11. Klik tombol "Simpan Template"
Sedikit tambahan, kalo kamu pake template seperti punyaku, tambahkan kode berwarna biru hingga menjadi seperti di bawah ini :
<data:post.body/></b:if></p>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<iframe src='//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fpunyamasbagus.blogspot.com&amp;send=false&amp;layout=standard&amp;width=450&amp;show_faces=true&amp;action=like&amp;colorscheme=light&amp;font&amp;height=80' scrolling='no' frameborder='0' style='border:none; overflow:hidden; width:450px; height:80px;' allowTransparency='true'></iframe>
</b:if>
Kode berwarna merah adalah kode tombol like. Penambahan kode di atas betujuan agar tombol like hanya muncul setelah link / tombol "Readmore" di klik. Karna berdasarkan pengalaman, kalo ga' pake kode di atas, tombol like muncul sebelom link / tombol "Readmore" di klik. Tepatnya muncul di bawah link / tombol "Readmore". Contohnya seperti pada gambar di bawah ini.

Newer Post Older Post Home

0 comments:

Post a Comment