Monday, December 3, 2012

Facebook Recommendations Bar Official Untuk Blogger

Facebook memperkenalkan produk social plugin mereka yang diberi nama Facebook Recommendations Bar. Plugin ini sekarang masih dalam versi Beta. Kali ini kita akan membahas cara menambahkan Facebook recommendations bar ini pada blog kita. Widget ini sangat membantu kita dalam mendatangkan traffik dari facebook, serta dapat menyerupai related post.

Ini dia preview nya :



Untuk memasang Facebook Recommendations Bar ini, ikuti cara berikut :
  • Masuk ke dashboard
  • Klik design
  • Pilih tab Edit HTML
  • Tambahkan kode meta berikut setelah <head>
<!-- Begin Open Graph metadata -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta content='article' property='og:type'/>
<meta expr:content='data:blog.title' property='og:site_name'/>
<meta expr:content='data:blog.pageName' property='og:title'/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postImageThumbnailUrl' property='og:image'/>
</b:if>
<b:else/>
<meta expr:content='data:blog.title' property='og:title'/>
<meta content='website' property='og:type'/>
</b:if>
<meta expr:content='&quot;en_US&quot;' property='og:locale'/>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<!-- End Open Graph metadata -->

  • Klik link Create a new app / Buat Aplikasi baru
  • Masukkan App name dengan nama blog Anda dan App URL dengan URL blog Anda, Klik Continue / Lanjutkan
  • Masukkan kode captcha dengan benar dan tekan kode submit / kirim
  • Klik tombol Get code sekali lagi
  • Copy kode HTML yang terdapat pada kotak pertama (yang saya blok)
  • Masuk lagi ke Edit HTML blogger
  • Berikan tanda cek pada expand template widgets
  • Cari kode <body> dan letakkan kode yang telah kita copy tadi setelah <body>
  • Cari kode <data:post.body/>
  • Letakkan kode berikut ini setelah <data:post.body/>
<b:if cond='data:blog.pageType == &quot;item&quot;'><div class="fb-recommendations-bar" data-trigger="onvisible" expr:data-href="data:post.url" data-read-time="30" data-action="like" data-side="right" expr:data-site="data:blog.homepageUrl" data-num-recommendations="2"></div></b:if>

  • Atur kode yang berwarna merah dengan posisi recommendations bar
  • Atur kode yang berwarna kuning kecoklatan dengan jumlah rekomendasi
  • Save template
  • Selesai...
Silakan nikmati Facebook Recommendations Bar Anda
Jika berkenan, mohon bantuannya untuk memberi vote Google + untuk halaman ini dengan cara mengklik tombol G+ di samping. Jika akun Google anda sedang login, hanya dengan sekali klik voting sudah selesai. Terima kasih atas bantuannya.
Judul: Facebook Recommendations Bar Official Untuk Blogger; Ditulis oleh Unknown; Rating Blog: 5 dari 5

No comments:

Post a Comment