kali ini kita akan bahas tentang rekomendasi facebook di blogger
nah langsung aja kita mencoba dengan pelajaran ini dengan seksama :
Tutorial ini saya dapatkan dari blog bule, My blogger tricks. Menurut saya ini blog memang bagus dan informasinya sangat bermanfaat. Kembali ketopik awal, cara membuat bar rekomendasi facebook di blogger.
Dalam pembuatan bar rekomendasi yang di butuhkan adalah anda harus membuat seuah aplikasi di Facebook, Untuk tampilan barnya seperti pada gambar di atas, bar akan muncul hanya di setiap posting dan berada di kanan bawah.
Untuk membuat Bar rekomendasi facebook tidak begitu sulit, ikuti langkah-langkahnya di bawah ini :
1. Sebelumnya anda terlebih dahulu membuat aplikasi di developer facebook, masuk di sini
2. Pilih Create new app biasanya berada di atas kanan.
3. Keluar pop up dan masukkan app name dan lainnya bisa untuk tambahan, atau bisa lihat gambar di bawah ini
5. Setelah itu anda akan masuk di ruang edit aplikasi, dan seperti contoh di bawah ini, masukkan alamat blog anda, untuk alamat http://www.mybloggertriks.com hanyalah sebagai contoh.
Maka anda sudah selesai membuat aplikasi di facebook, selanjutnya yang akan di lakukan adalah membuat bar rekomendasi facebook di blog, maka anda harus login terlebih dahulu di blogger. Saya umpmakan anda sudah masuk/login di blogger, maka selanjutnya ikuti langkah di bawah ini :
1. Masuk rancangan
2. Pilih Edit HTML, sebelum melakukan editing saya harap anda untuk backup template anda
3. Cari kode <html, masukkan kode di bawah ini setelah kode <html, maka hasilnya seperti pada kode di bawah ini
<html xmlns:fb='http://ogp.me/ns/fb#'4. Setelah itu cari kode <body>, dan masukkan kode di bawah ini tempat di bawah kode yang telah anda cari
<div id='fb-root'/>keterangan : untuk yang berwarna merah adalah App ID anda, untuk berwarna hijau adalah alamat blog anda.
<script>
//Facebook Recommendation bar
//<![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=***************";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
//]]>
</script>
<b:if cond='data:blog.pageType == "item"'><b:if cond='data:blog.pageType != "static_page"'><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.mybloggertricks.com' trigger='40%'/></div>
</b:if></b:if>
5. Simpan template
Lihat hasilnya, kadang harus menunggu beberapa jam untuk jadi jika masih belum terlihat tampilannya, karena saya mencoba proses selesai pembuatannya sekitar 2 jam lebih baru kelitan bar rekomendasinya.
Masalah
Sejak Kebanyakan template tidak terstruktur dengan baik dan memerlukan pemasangan meta tag untuk memberitahu Facebook untuk mengambil judul halaman yang benar, thumbnail dan judul blog. Untuk melakukan hal ini cukup 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:
No comments:
Post a Comment