Minggu, 20 Maret 2011

Cara Membuat Komentar Facebook di Blog

Facebook comments dapat membuat blog anda menjadi lebih interaktif. Komentar di blog anda akan muncul seperti yang anda lihat pada facebook. Beberapa fitur yang ada pada komentar facebook yaitu treaded komentar, facebook like, anda dapat subscibe atau tidak subscibe pada komentar, serta dapat memoderasi komentar anda. Tutorial ini akan membantu anda membuat komentar facebook pada blog.

Cara mendapatkan Application ID
1. Kunjungi situs https://developers.facebook.com/apps
2. Klik klik Create New App
3. Masukan App Name lalu klik Continue
4. Tulislah Captha verifikasi dan klik tombol Submit
5. Anda akan masuk ke Setting Screen, lalu lengkapi formulir yang ada seperti dibawah ini:

Keterangan: Isi App Domain dengan blogspot.com, selanjutnya isi Site Url pada link Website dengan alamat url blog anda.
6. Save Changes, lalu Kopi App ID di bagian atas

Membuat Kotak Komentar Facebook pada Blog
1. Masuk ke Blogger
2. Pilih Rancangan, lalu klik Edit HTML
3. Centang Expand Template Widget

4. Letakkan kode dibawah ini setelah kode <head>

<meta content='YOUR_FACEBOOK_APPLICATION_ID' property='fb:app_id'/>
Keterangan: Ganti kode berwarna biru dengan ID App anda. Script diatas berfungsi untuk melakukan moderasi komentar.

5. Cari kode dibawah ini:
<div class='post-footer-line post-footer-line-3'>
atau
<p class='post-footer-line post-footer-line-3'>
6. Paste kode dibawah ini setelah kode yang ada pada langkah ke.5
<b:if cond='data:blog.pageType == "item"'>
<div id="fb-root"></div>
<script>(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));</script>
<fb:comments width='450' colorscheme='light' expr:title='data:post.title' expr:href='data:post.canonicalUrl' expr:xid='data:post.id'/>
</b:if>
Keterangan: Anda dapat mengganti lebar dan warna (light / dark) dari kotak komentar

7. Anda harus menambahkan deklarasi untuk nama FB, caranya yaitu cari kode ini:
<html
8. Ubah kode tersebut seperti dibawah ini
<html xmlns:fb="https://www.facebook.com/2008/fbml"
9. Simpan template anda.

Jika sobat telah melakukan langkah diatas dengan benar maka sobat bisa melihat kotak komentar facebook langsung dari blog. Selamat mencoba!

0 komentar:

Posting Komentar

Share

Twitter Delicious Facebook Digg Stumbleupon Favorites More