Cara mudah memasang Facebook Recommendation bar terbaru di blog

Cara mudah memasang Facebook Recommendation bar terbaru di blog | Tutorial pemasangan Facebook Recomendation bar. Apa itu Facebook Recomm...

Cara mudah memasang Facebook Recommendation bar terbaru di blog | Tutorial pemasangan Facebook Recomendation bar. Apa itu Facebook Recommendation Bar? dan Apa manfaat yang diperoleh dari pemasangan Facebook Recommendation tersebut? Nah... itulah yang akan dibahas dalam postingan kali ini.

Sebelumnya telah kita bahas mengenai Google+ dan memanfaatkan segala fitur yang terdapat didalamnya. Seperti Membuat halaman atau fanspage google+ , Menambahkan Widget Google+1, serta Cara memasangnya di blog.  Sekarang kita akan beralih pada Facebook dan memanfaatkan fitur yang terdapat pada Facebook itu tersendiri. Salah satunya adalah dengan menggunakan Facebook Recommendation Bar.



Facebook Recommendation Bar merupakan fitur yang dikeluarkan oleh Faebook sendiri pada akhir tahun 2011. Pada dasarnya, script Rekomendasi Facebook ini berbasis pada pengambilan (fetching) beberapa meta informasi di dalam blog sehingga basic penggunaannya tergantung pada template. Fitur ini akan memberikan rekomendasi kepada pembaca artikel blog sesuai dan disertai dengan jumlah "like" pada suatu postingan. Ini berada pada bawah kanan layar dan akan muncul ketika pembaca artikel blog selesai membaca sebuah artikel. Yang secara default ada direkomendasikan 3 buah artikel. Sehingga dengan begitu, para pembaca artikel tertarik untuk membaca dan JELASLAH dapat meningkatkan pageview.




Tertarik untuk memasangnya? Caranya mudah dan gampang, ikuti aja Langkah-langkah berikut:

1. Karena Widget ini bekerja berdasarkan otorisasi aplikasi. maka dari itu sobat harus memiliki Facebook App sendiri dengan domain blog sobat. Sehingga hal pertama yang harus sobat lakukan adalah membuat Facebook App. Jika tidak tahu cara membuat Facebook App dapat mengikuti langkah :  Cara membuat Facebook App 



Note : Jika anda sudah memiliki Facebook App  digunakan sesuai dengan blog sobat dan telah terotorisasi, lewati langkah ini. Langsung copy App ID yang tertera dan simpan terlebih dahulu.



 2.  Setelah membuat Facebook App, Selanjutnya adalah Masuk ke akun Blogger milik sobat. Dan pilih menu  Template ==> Edit HTML ==> "Proced" ( Lanjutkan )

(Jangan lupa untuk mencentang Expand Widget Template. Bila perlu Backup terlebih dahulu template sobat. Jika tidak tahu cara mem-backup template, Ikuti langkah ini )


3. Setelah berada pada EDIT TEMPLATE, Cari kode <html  (Gunakan CTRL+F untuk mempermudah pencarian). Setelah menemukan kode tersebut, masukkan kode xmlns:fb='http://ogp.me/ns/fb#' tepat setelahnya. Sehingga kodenya menjadi <html xmlns:fb='http://ogp.me/ns/fb#'

Note : Jika sobat telah menggunakan xlmns:fb versi lama, hapuslah kode yang lama tersebut dan ganti dengan kode baru diatas.


4. Setelah itu, Cari kode <body> (Gunakan CTRL+F untuk mempermudah pencarian). Jika tidak ada, coba cari dengan kode <body Karena setiap template memiliki perbedaan dalam mendeskripsikannya.  Copy kode berikut dan pastekan tepat setelah kode <body> tersebut :


<div id='fb-root'/>
<script>
//www.segenggam-harapan.com
//<![CDATA[
(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/en_US/all.js#xfbml=1&appId=123456789012345";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
//]]>
</script>
<b:if cond='data:blog.pageType == &quot;item&quot;'><b:if cond='data:blog.pageType != &quot;static_page&quot;'><div style='z-index:999999; position:absolute;'>
<fb:recommendations-bar action='like' max_age='0' num_recommendations='3' read_time='10' side='right' site='http://www.segenggam-harapan.com' trigger='50%'/></div>
</b:if></b:if>




Jangan lupa untuk MENGGANTIKAN :

- appId=123456789012345 Dengan Facebook App ID sobat yang telah dibuat sebelumnya.
- site='http://www.segenggam-harapan.com  Dengan alamat URL BLOG sobat.


KETERANGAN :


- max_age adalah maksimum usia posting yang akan ditampilkan dalam rekomendasi. Ubah nilai 0 menjadi maksimal usia posting dalam hitungan hari yang sobat inginkan.

- num_recommendations adalah jumlah rekomendasi dalam setiap tampilan/load. Ubah nilai 3 menjadi nilai yang lain sesuai dengan keinginan sobat dalam menampilkan jumlah posting yang diinginkan.

- read_time adalah waktu yang dibutuhkan untuk load seketika user/pembaca mencapai titik scroll dimana widget muncul dan menampilkan isi rekomendasi. 

- side adalah posisi widget akan ditampilkan. 

- trigger adalah posisi awal dimana widget akan muncul. 



5. Langkah terakhir, cobalah klik PREVIEW atau PRATINJAU terlebih dahulu sebelum menyimpannya. Setelah tidak ada kode atau pesan Error, barulah sobat pilih SAVE atau SIMPAN template.

Gimana? Baguskan hasilnya...
Dan bersiap untuk menyambut para pembaca yang akan datang,

Jika masih ada kesalahan ataupun gagal dalam pemasangan Facebook Recomendation ini, sobat bisa langsung menanyakan kepada kami melalui kotak komentar yang tersedia. Mohon maaf apabila ada salah, Dan apabila artikel ini tidak layak publikasi sobat bisa langsung memberitahu kepada kami dengan segera akan ditanggapi.

Selamat mencoba dan semoga sukses,

COMMENTS

BLOGGER: 1
Loading...

Nama

Artikel,66,Cerita singkat,82,Java,12,SEO,15,Tahukah sobat??,21,Tips dan Trik,15,Tips.....n' Trick.....,14,Tutorial,20,Tutorial Blogger,50,
ltr
item
Blog Salman Syuhada: Cara mudah memasang Facebook Recommendation bar terbaru di blog
Cara mudah memasang Facebook Recommendation bar terbaru di blog
https://4.bp.blogspot.com/-5ii_xsmKVKs/UMn0f4t7ozI/AAAAAAAAGU8/o4XDDNiAFb4/s1600/face.jpg
https://4.bp.blogspot.com/-5ii_xsmKVKs/UMn0f4t7ozI/AAAAAAAAGU8/o4XDDNiAFb4/s72-c/face.jpg
Blog Salman Syuhada
http://blog.salmansyuhada.com/2012/12/cara-mudah-memasang-facebook.html
http://blog.salmansyuhada.com/
http://blog.salmansyuhada.com/
http://blog.salmansyuhada.com/2012/12/cara-mudah-memasang-facebook.html
true
5369818979434965955
UTF-8
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS CONTENT IS PREMIUM Please share to unlock Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy