Background Tips
Jika sebuah widget blog bermanfaat besar dalam meningkatkan jumlah pageview sehingga jumlah traffic semakin naik, apakah anda akan menolak memasangnya? :) Tentu tidak. Tidak ada orang yang tidak memiliki akun Facebook (mungkin ada ya, tapi kecil), sehingga seluruh plugin Facebook memiliki fungsi besar dalam menampilkan hal-hal yang personalized di dalam blog. Dengan demikian, user engagement pengguna Facebook akan terasa juga apabila kita menggunakan plugin-pluginnya di web/blog.
Nah, plugin Facebook satu ini juga memiliki andil besar, Facebook Activity Feed Plugin,
yang dari namanya bisa dipahami bahwa fungsinya menampilkan seluruh
feed aktivitas user Facebook di dalam sebuah website/blog. Yang paling
sering kita lakukan adalah "like" atau "recommend". Maka widget ini
berfungsi menampilkannya secara personalized (berdasarkan akun anda dan
keterkaitan dengan teman-teman anda di Facebook).
Jadi, mari kita pasang widget Facebook Activity Feed ini dengan
langkah-langkah yang cukup sederhana, karena plugin ini sudah saya buat
dalam bentuk pre-made, tinggal pasang saja, tanpa perlu langkah-langkah
lain. Namun jika anda ingin menelusuri lebih jauh setting plugin ini,
ada 3 tipe konfigurasi: App ID, action types, dan domain. Dari ketiga jenis tersebut, yang paling lengkap sekaligus membatasi penampilan aktivitas user adalah jenis domain. Sehingga ini setting yang saya pilih karena lebih cocok.
Cara Menambahkan Facebook Activity Feed ke dalam Widget Blog
Note: Lewati langkah 1 - 5 jika anda sudah menggunakan plugin Facebook Recommendation Bar yang dulu saya share, Facebook Comments, dan plugin-plugin Facebook lain yang menggunakan format HTML5 dan langsung masuk ke langkah 6.
1. Buka dashboard > template
2. Klik "Edit HTML" (note: jika perlu backup template lebih dulu)
3. Cari (Ctrl+F) tag <body> atau jika anda sudah menggunakan template-template modifikasi atau bawaan Blogger, cari <body (tanpa penutup).
4. Tepat di bawah tag <body> paste/letakkan code berikut:
<div id="fb-root"></div>5. Save template.
<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/en_US/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
6. Buka halaman "Layout"
7. Klik "add a / tambah gadget" sesuai posisi yang diinginkan dan pilih HTML/Javascript.
8. Copy, edit/customize, dan masukkan code berikut ke dalam kolom HTML/Javascript:
<div class="fb-activity" data-site="http://hamsarsalemba.blogspot.com" data-width="340" data-height="340" data-border-color="#ffffff" data-header="false" data-recommendations="true"></div>
Ubah beberapa perintah dan nilai untuk melakukan kostumisasi:
- Ganti http://hamsarsalemba.blogspot.com dengan url blog anda.
- Saya sudah set default lebar dan tinggi sebesar 340 piksel , jika ingin mengaturnya ubah nilai dalam data-width="340" untuk mengatur lebar widget sesuai blog dan ubah nilai dalam height="340" untuk mengatur tinggi widget.
- Ubah #ffffff (putih) untuk mengganti warna border (gunakan generator kode warna). Warna yang sama seperti background akan membuat widget tampak transparan.
- Ubah nilai dalam data-header="false" menjadi true untuk menampilkan header activity feed (sama seperti Facebook Like Box).
- Terakhir, ubah nilai dalam data-recommendations="true" menjadi false untuk tidak menampilkan rekomendasi. Namun jika aktivitas pada web/blog anda minim, rekomendasi tetap akan ditampilkan.
9. Save widget. Jika perlu susun posisi widget melalui halaman layout pada tempat yang sesuai.
10 Kunjungi blog untuk melihat hasilnya.
Selesai..
Tidak ada komentar:
Posting Komentar