Sabtu, 12 Januari 2013

Cara Menambahkan Facebook Recommendation bar di Blog

Menambahkan  Facebook Recommendation bar  di Blog









 Facebook Recommendation Bar berfungsi  menampilkan jumlah like pada sebuah post, dan ini akan menarik bagi pembaca blog untuk mengetahui isi posting yang direkomendasikan.

setelah pengunjung selesai membaca sebuah artikel. Secara default, recommendation bar akan terbuka secara otomatis dalam waktu dan posisi tertentu pada sebuah halaman, widget ini merekomendasi posting (default 3 buah), dan juga sebuah like button.widget ini tidak tampil di home page.jika tertarik silakan ikuti langkah-langkah berikut:



Langkah awal membuat recommendation bar





* Masuk ke Facebook Apps

* Klik pada tombol Create New App pojok kanan

* lalu akan muncul jendela seperti di bawah ini










* Pada kotak yang muncul, isi kolom app name "dengan judul terserah anda"  lalu . Klik lanjutkan.

* lalu keluar jendela seperti ini

  







* Masukkan kode captcha, klik lanjutkan.

*  Anda akan masuk ke halaman setting aplikasi.







* Lihat bagian paling bawah, tepatnya pada "Website with Facebook Login". Klik, lalu masukkan url blog

  anda di kolom tersebut. tinggalkan saja opsi-opsi lainnya Lalu klik simpan perubahan.

* Setelah itu akan muncul informasi App Id dan App Secret. perhatikan angka pada App ID yang nantinya untuk di pasang di blog.





 

sekarang tahap pemasangan pada blog kita.

Langkah untuk menambahkan bar FACEBOOK di  Blogger:




  • Pergi ke Blogger >> Template

  • Backup template Anda

  • Klik Edit HTML >> Lanjutkan

  • Cari code



    <html




  • Ganti kode tsb dengan kode ini:





    <html xmlns: fb = 'http://ogp.me/ns/fb #' 

*Kemudian cari <body>.  Copy kode berikut tepat setelahnya/di bawahnya kode tersebut




<div id='fb-root'/>

<script>

//Facebook Recommendation bar by Campor bawor

//<![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=522824197747878";

  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://aly-ahmad.blogspot.com' trigger='40%'/></div>

</b:if></b:if>

 Catatan

Ganti 522824197747878 dengan App ID yang sebelumnya telah dibuat.

Ganti http://aly-ahmad.blogspot.com dengan url blog sobat.



*. Terahir Simpan Template

    Lihat hasilnya,  jika masih belum terlihat tampilannya.atau pangambilan thumbnail

    tidak sesuai dengan judul post.sisipkan kode berikut tepat di bawah tag <head> di dalam template anda.




<meta content='article' property='og:type'/>




<meta expr:content='data:blog.postImageThumbnailUrl' property='og:image'/>



<meta expr:content='data:blog.title' property='og:site_name'/>



<meta expr:content='data:blog.pageName' property='og:title'/>


Demikaan cara membuat facebook recomendasi bar di blog



Jika anda pengguna handphone android ingin membuat status lucu silakan

 download applikasi funny status

Tidak ada komentar:

Posting Komentar