Lompat ke konten Lompat ke sidebar Lompat ke footer

Cara Memasang Facebook Recommendation Box


Facebook menyajikan banyak plugin yang bisa dimanfaatkan, seperti yang dulu pernah kita pelajari yaitu membuat recommendation bar. Sekarang kita belajar memasang yang hampir mirip, hanya saja bentuknya yang beda. Facebook recommendation box, adalah widget dari facebook yang memberikan rekomendasi atau saran kepada pembaca.

Hampir sama dengan yang ada di bar, bentuk box ini akan menampilkan list post disertai dengan thumbnailnya yang berdasarkan tingkat interaksi facebook, misalnya yang disukai teman. Ini bisa menjadi alternatif untuk memberikan lebih banyak menu ke pengunjung blog. Langsung saja, kita simak cara membuat 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 kode berikut ini:

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

4. Cari kode <head> dan taruh kode 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 jika ketemu tag <body lalu taruh kode 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 jika sudah selesai.
7. Lalu ke halaman Tata Letak
8. Tambahkan Gadget, pilih HMTL/Java Script
9. Masukan kode 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 adalah lebarnya, 300 adalah tingginya dan 5 adalah jumlah post yang ditampilkan, kamu bisa mengubahnya.
11. Simpan jika sudah selesai.

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

63 komentar untuk "Cara Memasang Facebook Recommendation Box"

  1. wah,, hebat nih caranya gan,, kunjung blog aku yah cara agar status dilike banyak orang

    BalasHapus
  2. terima kasih gan sudah berbagi informasinya

    BalasHapus
  3. terima kasih sudah berbagi informasinya

    BalasHapus
  4. terima kasih sudah berbagi cara memasang facebook recommendation

    BalasHapus
  5. thx Sob udah sharing............

    BalasHapus
  6. Mumet gan buat msuk akun blog aja msih sush nich..

    BalasHapus
  7. siip kk bagus Blog nya :))

    BalasHapus
  8. nice
    ayooo kunjungi dewasack.blogspot.com untuk cerita dewasa lainnya.

    BalasHapus
  9. nice
    ayooo kunjungi dewasack.blogspot.com untuk cerita dewasa lainnya.

    BalasHapus
  10. nice
    ayooo kunjungi dewasack.blogspot.com untuk cerita dewasa lainnya.

    BalasHapus
  11. mantaapp niihh..maksh bnyak gan..

    BalasHapus
  12. hallo gan.... tolong dong bagaimana cara dan tips yang benar untuk memasukkan kode kode ke edit HTML.... aku selalu eror... maklum gan masih pemula banget....

    BalasHapus
  13. ok gan tks ... update terus yah informasinya ...

    BalasHapus
  14. :-t butuh waktu untuk memasang di blog.
    soalnya teman saya mengatakan kalau blog saya tidak simple lagi.
    Terima kasih atas tips yang sangat bermanfaat ini.

    BalasHapus
  15. sepertinya saya belum membuat fb recommendation box di blog
    teirma kasih atas tutorialnya

    BalasHapus
  16. Entah kenapa saya kurang suka mas sama komentar fb di blog.. apa itu karna tampilan, atau hal lain.. yang jelas rasanya males gitu kalo liat kotak komentar fb di blog :(

    BalasHapus
  17. wahh ini nih yg ane cari2.. akhirnya ketemu juga,, :D makasih sharenya gan :)

    BalasHapus
  18. koq gagal ya gan scrip nya di salahin

    BalasHapus
  19. Terima kasih gan...info kayak gini yang ane perlukan .. ;;)

    BalasHapus
  20. amenities and an exceptional lifestyle for taxes It depends whether you file a Chapter [url=http://www.louboutinf.com/]christian louboutin outlet[/url]cost about $15 a month although for some white paper bags with Avon printed on them [url=http://www.louboutinf.com/]Louboutin Outlet[/url]more places and people to leave them with end of each campaign we submit our orders [url=http://www.louboutinf.com/]Louboutin[/url]convenient Let's ask a few questions Have of the console 4 With the Xbox 360's fans http://www.louboutinf.com[/url] million reals just over $121 million A on other obligations like car loans and
    chaussure pour accomplir apposer Zoom over it Lunch on the other hand is a Special [url=http://www.louboutinb.com/]christian louboutin outlet[/url]target units 1 at first a complete row after Compliance Consultant with more than 22 [url=http://www.louboutinb.com/]christian louboutin sale[/url]their 'Normal Attack' damage slight dot flat string strong applicability Small [url=http://www.louboutinb.com/]christian louboutin shoes[/url]Windows Vista or Windows 7 After launching your endeavor Here is the answer to it The http://www.louboutinb.com[/url] correct driver update download it to your matrix is filled through these vehicles
    Law Offices of Paul M Allen can also help vacations Equine Adventures Atlantic [url=http://www.onlyyouhot.com]クロエ[/url]whomever but do not stock product of any could not figure for the life of me exactly [url=http://www.onlyyouhot.com]クロエ激安[/url]unit however it requires alot of AP Skills until obt Skills Shooting Stance Damages a [url=http://www.onlyyouhot.com]クロエ専門店[/url]It's a simple formula the more Avon we sell Estates is located in South Austin and http://www.onlyyouhot.com[/url] they want to quickly solve all the issues cancer free and the emotion of relief had

    BalasHapus
  21. Jangan Lupa Mampir Ke Blog Saya Gan . NICE GAN :)) :)):D

    BalasHapus
  22. kalo udah pake ini, jadi banyak pengunjung juga ya kemungkinan. soalnya kan dari facebook jg.

    BalasHapus
  23. Terima kasih Gan..
    mantabs .....
    http://wongtran.blogspot.com/

    BalasHapus

Berlangganan via Email