Baiklah pada malam hari yang dingin ini hehe saya akan share tentang bagaimana Cara membuat dan memasang Facebook Like Button pada blog. kita dapat mengkreasikannya sesuai keinginan kita, bisa dipasang pada sidebar blog, atau di dalam postingan blog (baik di atas maupun dibawah) atau kita dapat memasangnya dalam Widget Share Melayang di blog.
Ada beberapa model yang dapat kita gunakan, dan untuk lebih jelasnya silahkan lihat disini https://developers.facebook.com/ . ada banyak macam widget yang disediakan oleh facebook untuk blog kita.
Untuk lebih mempermudah, kalian bisa mengedit kode dibawah ini :
1. Contoh model button Pertama, Seperti dibawah disamping. Model seperti ini umumnya dipasang di dalam postingan blog bisa di atas atau dibawah. untuk mendapatkannya Pertama Masuk kesini Selanjutnya pilih "Bangun Aplikasi Untuk Web" > Core Concepts > Social Plugins > Like Button > Edit sesuai Y diinginkan > Get Code. Untuk cara memasangnya kalian bisa mengggunakan kode dibawah ini (Javascript SDK), letakkan kode tepat setelah kode <body> (seperti biasa masuk ke edit HTML, jangan lupa centang expand template widget) :
<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/id_ID/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
Setelah itu Save. untuk langkah selanjutnya letakkan kode dibawah ini sesuai dengan yang diinginkan, bisa di atas postingan atau dibawah postingan
<div class="fb-like" data-href="https://www.facebook.com/pages/AF-Sahabat-Artikel/305351356172504?ref=tn_tnmn" data-send="false" data-width="450" data-show-faces="true"></div>
Ubah kode yang berwarna merah dengan alamat Fanpage Group Blog masing2.

2. Untuk Contoh Model yang kedua model Like button (Box-Count), contohnya seperti gambar disamping ini. untuk model ini kita bisa menggunakannya pada Widget Share Melayang di blog (utk tutorialnya bisa dilihat disini) atau di dalam postingan.  Untuk mendapatkannya sama seperti cara yang diatas, bedanya hanya pada pengeditan, pada layout style menggunakan Box_Count. Untuk memasangnya sama dengan cara yang pertama, jika sudah memasang kode (JavaScript SDK), lewati saja langsung ke proses selanjutnya. silahkan Copas kode dibawah ini:
<div class="fb-like" data-href="https://www.facebook.com/pages/AF-Sahabat-Artikel/305351356172504?ref=tn_tnmn" data-send="false" data-layout="box_count" data-width="45" data-show-faces="true"></div>
Ubah kode warna merah dengan alamat Fanpage Group Blog masing2.

3. Untuk contoh model yang ketiga yaitu model Like Box. model ini sudah amat sering kita temukan dan rata-rata sahabat blogger menggunakannya. dan model ini banyak yang dapat kita kreasikan, dalam Like Box banyak pilihan, memasang show stream saja, atau show stream + pengikut, atau hanya pengikut saja. Contohnya seperti gambar disamping ini. Penjelasan singkatnya, Show Stream atau bisa dibilang status terbaru yang dimunculkan sedangkan  Pengikut > orang yang menge-like/menyukai blog kita. Untuk model ini kita dapat memsangnya pada sidebar blog (kanan, kiri, atas, bawah), atau bisa juga di bawah postingan blog. Dapat kita pasang juga dalam kode CSS blog, tujuannya agar tidak perlu repot-repot lagi untuk memasang kode ini karna sudah otomatis akan muncul disetiap postingan, syaratnya kode Like box ini harus di pharse terlebih dahulu. Dan untuk tutorial cara memasang di dalam postingan secara otomatis tunggu pada postingan berikutnya yahh, agar tidak terlalu rumit, hehehehe , be patient . 
Ok balik lagi ke tutorialnya hehehe iklan sedikit . . . terimakasih juga masih bersedia membaca tutorial ini (mav yah klo terlalu banyak kata-katanya). 

# Untuk Model Like Box (Show Stream dengan Pengikut), kalian dapat mengedit dan copas kode dibawah ini :
<div class="fb-like-box" data-href="https://www.facebook.com/pages/AF-Sahabat-Artikel/305351356172504?ref=tn_tnmn" data-width="292" data-show-faces="true" data-stream="true" data-header="true"></div>
Untuk kode yang berwarna merah silahkan rubah dengan alamat FanPage Group Blog masing2. dan untuk kode yang berwarna hijau silahkan atur lebar widgetnya sesuai dengan yang diinginkan.

# Untuk Model Like Box (Pengikut saja), kalian bisa copas kodenya dibawah ini:
<div class="fb-like-box" data-href="https://www.facebook.com/pages/AF-Sahabat-Artikel/305351356172504?ref=tn_tnmn" data-width="292" data-show-faces="true" data-stream="false" data-header="true"></div>
Untuk kode yang berwarna merah silahkan rubah dengan alamat FanPage Group Blog masing2. dan untuk kode yang berwarna hijau silahkan atur lebar widgetnya sesuai dengan yang diinginkan.

Dan itulah beberapa model Facebook Like Button yang sering digunakan para sahabat blogger. Baiklah selesai sudah postingan saya kali ini tentang Cara Membuat Facebook Like Button
4.5

53 komentar:

  1. wah bagus banget nih infonya gan, kebetulan blog saya blom ada like button nya

    ReplyDelete
  2. selamat mencoba sobat , , smoga bermanfaat, mksih atas kunjungan'a

    ReplyDelete
  3. thks ya bozzz

    infonya TOP BGT

    oya tolong add link blog q sh....
    http://noviardisaputra.blogspot.com/

    ReplyDelete
  4. Noviardi_Ok sama2 Sobat,, mksud'a mau link exchange sob ?
    MartapuraCyber_Ok siipp sobat

    Thanks sobat udah mampir di blog sederhana ini . .
    salam kenal !!

    ReplyDelete
  5. Infonya simple dan mudah dimengerti, langkah-langkahnya sangat jelas, sehingga saya gak usah muter-muter mbah google untuk medapatkan informasi ini. thanks ya...

    ReplyDelete
  6. keren bos.. detil dan jelas tutorialnya

    ReplyDelete
  7. gan, aku kan pakae perancang templet dari blogger. bisa di edit gk HTML nya?

    ReplyDelete
  8. @Ahmad Budiarto:bisa ko sobat, biasanya klo diprancang template ada edit css'a tuh...

    ReplyDelete
  9. tutorial ini sangat komplit tapi sayang di template saya tidak ada kode body-nya sehingga tidak meletakkan kode javascript SDK di atas.
    apakah ada solusinya?

    ReplyDelete
  10. apa itu Fanpage group blog?, saya tidak tahu

    ReplyDelete
  11. Saya sudah memasang tombol like di bawah artikel, tapi sepertinya kok gak bener ya? Jumlah like tiap artikel sama. Apa ada yang salah

    ReplyDelete
  12. keren infonya gan.......follow back gan....thanks

    ReplyDelete
  13. thanks for posting a good article about blogging

    ReplyDelete
  14. thanks for posting a good article about blogging

    ReplyDelete
  15. nyari kode < body> ny disebelah mana ?

    ReplyDelete
  16. @Kang Yoes: ketik aja ctrl + F nnti ad kotak di pojok kanan atas. trus ketik aja kode --> < body>

    ReplyDelete
  17. Terima kasih,.. Artikel yang bagus,.. membuat ingin belajar lebih banyak lagi tentang blogger,..

    ReplyDelete
  18. MANTAP GAN,AR5TIKELNYA BERHASIL SAYA TERAPKAN.MAKSIH YA...

    ReplyDelete
  19. trimksh bnyk sharing nya bro, semoga tmbah bermanfaat.,.
    salam www.peralatanbadminton.com

    ReplyDelete
  20. thanks sobat. Mampir ke blog aku juga yuk?
    http://wahid-biyobe.blogspot.com/
    :)

    ReplyDelete
  21. Thanks sudah berbagi ilmunya, sukses selalu...

    ReplyDelete
  22. makasih bang infonya, kunjungi blog ane ya

    ReplyDelete
  23. tombol like facebooknya sudah saya pasang diblog saya :D

    hehhehe... thanks gan :D

    ReplyDelete
  24. berhasil sob..tkhs sob ilmunya.. :D

    ReplyDelete
  25. beruntung dah bisa tersesat di sini :D dapat ilmu2 yang menarik :) terimah kasih gan

    ReplyDelete
  26. Maaf doble post.
    boleh kasih tahu tutorialnya, biar fanspage fasebook kita byk yg like
    inbok kesini ya om cs@nfsreload.com

    ReplyDelete
  27. @NFS Reload Sebenernya gampang gan, cara pertama pasang LikeBox fanpage facebook dengan cara floating atau melayang di blog sperti di blog ini, apalagi jika memiliki trafik tinggi makin cepat dapat like'a bahkan bisa ratusan tiap harinya

    Kedua, saat membuat fanpage undang sluruh kontak teman Y ada pada teman fb kita utk menyukai halaman kita

    Ketiga pasang recommended post fb disamping blog agar lbh banyak Y like

    dan terakhir, jika sudah membuat fanpage, jangan lupa posting setiap artikel Y diterbitkan di blog, gunanya apa ? agar para likers fanpage kita dapat membaca dan sekaligus membagikan/menyebarkannya lagi kpd teman2'a

    jika ke-4 cara diatas dipraktekkan pasti akan cepat kita mendapatkan likers utk fanpage kita, , jgn merasa gagal dulu sblum mencobanya, saat awal memang blm terasa tapi jika sudah mnyebar luas akan terasa hasilnya

    Semoga bermanfaat dan trima kasih telah mampir di blog sederhana ini . . .

    ReplyDelete
  28. di blogger aq kok gk nmpil ya maz

    ReplyDelete
  29. nice tutorial gan..
    mampir ya gan ke blog ane
    http://4biyaksa.blogspot.com

    ReplyDelete
  30. oke ntar akan aq praktekin disini gan,,, http://indoboclub.blogspot.com
    ( BO GRATIS $$$ DARI FACEBOOK 2013 )
    and disini
    http://sukses181.blogspot.com
    ( kumpulan BO )
    thanx gan tutorialnya

    ReplyDelete
  31. @depto bisa ko mas, malah lebih dominan di blogger pmasangannya, sblm pasang kode script perhatikan juga kode javascript Y dipasang di dalam template agar pmasangan brhasil

    ReplyDelete
  32. Makasih , infonya sangat membantu ,

    ReplyDelete
  33. terimakasih banyak sobat,artikel nya sangat bermanfaat

    ReplyDelete
  34. @sookapura Ga jalan gimana ? apa sudah benar pmasangannya ?

    ReplyDelete
  35. cek tombol like punya ku geh http://nandabaguss.blogspot.com
    tombolnya ga bisa dilike lagi,,,,
    tolong bantu ya,,,,

    ReplyDelete
  36. keren gan, ditunggu kunjungan baliknya :D
    blog baru.. mohon dukunganya

    http://x-evolutions.blogspot.com

    ReplyDelete
  37. thanks gan :)

    http://www.errorcrew.com/

    ReplyDelete
  38. thanks ilmunya

    http://kumpulankonsultasi.blogspot.com/2013/03/mana-yang-afdhal-untuk-wanita.html

    ReplyDelete
  39. http://massjoko.blogspot.com/

    ReplyDelete
  40. Iya saya juga pake cara no 3 untuk like button facebook... makasih sob udah berbagi... salam kenal :)

    ReplyDelete
  41. klu cr memasang pd tampilan blogger terbaru bgmn bos...? Tq ats jwbnya...

    ReplyDelete

Terima Kasih atas kunjungan dan komentarnya pada Blog ini. Thanks atas setiap Komentar, Masukkan, Saran, dan Kritik Y dapat membangun blog ini agar lebih baik lagi kedepannya. Berkomentarlah sesuai dengan Isi Bahasan Artikel. Mohon dengan Sangat Kepada Sobat-sobat untuk tidak berkomentar Y berbau unsur:
- Sara
- Pornografi
- No Spam !!! [Komentar menyertakan link aktif akan otomatis terdelete]
Terima Kasih atas Kunjungannya Sobat,,
Salam Sukses dari AF Sahabat Artikel

 
Top