Menambahkan Facebook Like Box pada Blog

Hai sahabat adventura, dikala malam ditemani oleh sobat, Muhammad faisal disini, ane ngeblogging gan. Ane mencoba memasang Facebook Like Box pada Right Sidebar seperti ini

Ternyata caranya susah2 mudah, soalnya saya baru pertama kali ni gan masang begini.
Nah begini caranya.

LANGKAH 1:
Pasanglah widget pada template agan pilih ke menu tata letak

Kemudian tambahkan gadget facebook pada sidebar

Setelah itu pilih HTML / Java script

 Maka akan muncul seperti ini

Judulnya diisi Facebook, kemudian kontennya biarkan blank dulu, gambar itu sudah ada karena saya sudah melakukan registrasi via facebooknya dan simpan.

Langkah ke 2:
Masuklah ke
https://developers.facebook.com/docs/plugins/like-box-for-pages?locale=id_ID
Ubahlah pada yang saya hightligter menjadi alamat url fanspage sobat

Cara mendapatkan alamat urlnya dengan masuk ke page facebook sobat kemudian pilih pengaturan dan pilih seluler, maka akan muncul seperti ini

Kemudian pilih Dengan Web Seluler dan klik http:// facebook.com/username maka akan muncul seperti ini

 Pada bagian yang saya berikan hightligter tersebut silakan diganti menyesuaikan alamat fanspage teman - teman. Nah alamat url inilah yang nantinya akan dicopy pastekan pada facebook page url yang ini tadi gambarnya

Sesuaikanlah ukurannya dan tekan get code, maka akan tampil seperti ini

pada bagian yang saya hightligter ini silakan sobat copykan pada bagian widget tadi yang kita kosongi sebelumnya, kalo lupa yang pas ini, kemudian simpan.

Langkah selanjutnya masuklah pada template kemudian tekan edit html dan marilah kita bermain dengan coding - coding ria, hahaha.....

Selanjutnya pada bagian ini

kita tekan CTRL + F saja dan pastekan pada kolom search
<b:widget id='HTML1' locked='false' title='FACEBOOK' type='HTML'>
panahnya yang disamping kanan itu di klik ya, nah nanti kita akan menemukan tulisan
<div class='widget-content'>
    <data:content/>
Kemudian dibawah tulisan diatas pastekanlah

<div class='fb-like-box fb_iframe_widget' data-colorscheme='light' data-header='false' data-height='265' data-href='https://www.facebook.com/infoptik' data-show-border='false' data-show-faces='true' data-stream='false' fb-iframe-plugin-query='app_id=172525162793917&amp;color_scheme=light&amp;header=false&amp;height=265&amp;href=https%3A%2F%2Fwww.facebook.com%2FDGenera.Blog&amp;locale=en_US&amp;sdk=joey&amp;show_border=false&amp;show_faces=true&amp;stream=false' fb-xfbml-state='rendered'><span style='vertical-align: bottom; width: 300px; height: 265px;'><iframe allowTransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Finfoptik&amp;width=292&amp;height=290&amp;colorscheme=light&amp;show_faces=true&amp;header=true&amp;stream=false&amp;show_border=true' style='border:none; overflow:hidden; width:292px; height:290px;'/></span></div>

Pada bagian yang warna coklat diatas silakan diganti dengan tulisan pada code fb sobat yang iframe, ini gambarnya, tinggal dicopas saja

Kemudian pada bagian

<div class='fb-like-box fb_iframe_widget' data-colorscheme='light' data-header='false' data-height='265' data-href='https://www.facebook.com/infoptik' data-show-border='false' data-show-faces='true' data-stream='false' fb-iframe-plugin-query='app_id=172525162793917&amp;color_scheme=light&amp;header=false&amp;height=265&amp;href=https%3A%2F%2Fwww.facebook.com%2FDGenera.Blog&amp;locale=en_US&amp;sdk=joey&amp;show_border=false&amp;show_faces=true&amp;stream=false' fb-xfbml-state='rendered'><span style='vertical-align: bottom; width: 300px; height: 265px;'>

Gantilah pada bagian yang coklat, www.facebook.com/infoptik menjadi alamat url fanspage facebook sobat.

Done

Gimana nggak susah kan temen2, kalo bingung yok koment dibawah ini ya, see you....