Cara Memasang Facebook Recommendation Box - Bagi Template

Selasa, 19 Agustus 2014

Cara Memasang Facebook Recommendation Box


Facebook menyajikan banyak plugin yang dapat dimanfaatkan, menyerupai yang dulu pernah kita pelajari yaitu membuat recommendation bar. Sekarang kita berguru memasang yang hampir mirip, hanya saja bentuknya yang beda. Facebook recommendation box, yaitu widget dari facebook yang memperlihatkan rekomendasi atau saran kepada pembaca.

Hampir sama dengan yang ada di bar, bentuk box ini akan menampilkan list post disertai dengan thumbnailnya yang menurut tingkat interaksi facebook, contohnya yang disukai teman. Ini dapat menjadi alternatif untuk memperlihatkan lebih banyak sajian ke pengunjung blog. Langsung saja, kita simak cara menciptakan facebook recommendation box.

Cara Memasang Facebook Recommendation Box
Langkah 1
1. Login ke akun blogger.com
2. Pilih Template kemudian Edit HTML
3. Jangan lupa centang Expand Template Widget
4. Cari kode <html lalu ganti isyarat berikut ini:

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

4. Cari isyarat <head> dan taruh isyarat berikut di bawahnya:

<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'/>
<b:if cond='data:blog.metaDescription != ""'>
<meta expr:content='data:blog.metaDescription' name='description'/>
</b:if>

5. Cari kode <body> atau bila ketemu tag <body kemudian taruh isyarat berikut di bawah tag tersebut:

<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&appId=153370320899";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

6. Simpan Template bila sudah selesai.
7. Lalu ke halaman Tata Letak
8. Tambahkan Gadget, pilih HMTL/Java Script
9. Masukan isyarat berikut ini

<div class="fb-recommendations" data-site="http://kurniasepta.blogspot.com" data-action="5" data-width="250" data-height="300" data-header="true"></div>

10. Ganti yang berwarna merah dengan URL blogmu. 250 yaitu lebarnya, 300 yaitu tingginya dan 5 yaitu jumlah post yang ditampilkan, kau dapat mengubahnya.
11. Simpan bila sudah selesai.

Itulah tadi langkah-langkah menciptakan atau memasang kotak rekomendasi dari facebook. Jika kau ingin membuatnya sendiri, dapat lihat di halaman resmi facebook plugins yang ada di sini.


Sumber https://www.kurniasepta.com/
Comments


EmoticonEmoticon

:)
:(
hihi
:-)
:D
=D
:-d
;(
;-(
@-)
:P
:o
:>)
(o)
:p
(p)
:-s
(m)
8-)
:-t
:-b
b-(
:-#
=p~
x-)
(k)
Notification
This is just an example, you can fill it later with your own note.
Done