Setelah berkali-kali gagal ,akhirnya aq berhasil memasang Kotak Komentar Facebook di blog. Makanya aq ingin bagi-bagi pengalaman ini buat sobat sesama pemula..
Sebenarnya tips cara memasang Kotak Komentar Facebook di blog, udah banyak dijelaskan oleh para pakar blogging. Dan ini bukan hal yang baru lagi. Tapi sebagai pemula yang masih harus banyak belajar, aq menilai Kotak Komentar Facebook sangat bagus dipasang di blog. Karena selain tampilannya emang keren, juga bisa membantu menambah jumlah pengunjung ke blog kita secara otomatis.
Kalau sobat punya minat buat masang Kotak Komentar Facebook di blog, Ikuti aja langkah-langkahnya berikut :
1. LANGKAH PERTAMA : MEMBUAT APLIKASI DI FACEBOOK ATAU FACEBOOK APP ID
Cara membuat Aplikasi di Facebook / Facebook App ID adalah sebagai berikut :
Login ke Facebook.( Login pake Id Facebook sendiri ya, jangan pake punya tetangga J.)
Setelah login, kunjungi alamat Pengembang Facebook atau Facebook Developers di http://developers.facebook.com/
Atau kalau sekarang sobat sedang online facebook, langsung klik di sini. Selanjutnya sobat akan dibawa ke halaman Pengembang Facebook atau Facebook Developers. Perhatikan gambar dan petunjuknya.
(Sekedar info: Terkadang urutan halaman gak sama persis, tp gak papa..yang penting ikuti aja petunjuk sesuai dengan halaman yang muncul).
Klik Setuju
Klik Create App
Klik Kirim
Isi Site Domain dengan domain yang sobat gunakan. Seperti : blogspot.com
Lalu Klik Simpan Perubahan, selanjutnya akan muncul halaman berikut :
Sampai disini pembuatan ID App Facebook dinyatakan selesai. Buat sobat yang pengen minum, boleh dicicipi dulu kopinya, atau yang pengen pipis...jangan ditahan-tahan atuh,tar jdi penyakit.
2. LANGKAH KEDUA : SEMBUNYIKAN/NONAKTIFKAN DEFAULT KOMENTAR
OKE... kita lanjut!
Sebelum kita melangkah pada Edit HTML, sebaiknya Kotak Komentar Default dinonaktifkan terlebih dahulu,biar gak dobel aja kotak komentarnya. Tapi kalau ingin kotak komentar yang lama tetap dimunculkan, gak masalah.
Cara menonaktifkan Kotak Komentar Default :
- Login ke Blogger sobat
- Pada halaman Dasbor Klik PENGATURAN trus Klik KOMENTAR.
- Pada menu Komentar, pilih: Sembunyikan.
- Lalu gulir ke bawah, klik SIMPAN SETELAN
- Selesai
3. LANGKAH KETIGA : MEMASANG CODE APLIKASI FACEBOOK PADA TEMPLATE BLOGGER
Sekarang kita lanjutkan ke Langkah terakhir yaitu pemasangan code pada template Blogger.
- Klik RANCANGAN
- Klik EDIT HTML
- centang EXPAND WIDGET
Jangan lupa klik “DOWNLOAD TEMPLATE LENGKAP” buat jaga-jaga siapatau terjadi kesalahan.
Copi paste code di bawah ini, dan letakkan tepat di bawah code <body>
<div id="fb-root">
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : ' YOUR-APP-ID ',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
(function() {window.fbAsyncInit = function() {
FB.init({
appId : ' YOUR-APP-ID ',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
Selanjutnya cari code </head>
Letakkan code berikut di bawahnya :
<b:if cond='data:blog.pageType == "item"'>
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<meta expr:content='data:blog.url' property='og:url'/>
<b:else/>
<meta expr:content='data:blog.title' property='og:title'/>
<meta expr:content='data:blog.homepageUrl' property='og:url'/>
</b:if>
<meta content='YOUR-SITE-NAME' property='og:site_name'/>
<meta content=’YOUR-APP-ID' property='fb:app_id'/>
<meta content='YOUR-FACEBOOK-PROFILE-ID' property='fb:admins'/>
<meta content='article' property='og:type'/>
YOUR SITE NAME = ganti dengan url/alamat blog sobat. Contoh: http://omvan.blogspot.com/<meta expr:content='data:blog.pageTitle' property='og:title'/>
<meta expr:content='data:blog.url' property='og:url'/>
<b:else/>
<meta expr:content='data:blog.title' property='og:title'/>
<meta expr:content='data:blog.homepageUrl' property='og:url'/>
</b:if>
<meta content='YOUR-SITE-NAME' property='og:site_name'/>
<meta content=’YOUR-APP-ID' property='fb:app_id'/>
<meta content='YOUR-FACEBOOK-PROFILE-ID' property='fb:admins'/>
<meta content='article' property='og:type'/>
YOUR APP ID = Ganti dengan Nomor ID Aplikasi Facebook sobat.
YOUR-FACEBOOK-PROFILE-ID = Ganti dengan ID Profil Facebook sobat. Jika url/alamat Profil Facebook sobat adalah http://www.facebook.com/lia.damayanti , maka ID Facebook sobat adalah lia.damayanti
Oke kita lanjutin ke langkah terakhir.. cari code
Letakkan code berikut ini di bawanya. Jika ada 2 code
<b:if cond='data:blog.pageType == "item"'><br /> <p align='left'><a href="http://www.omvan.blogspot.com/" target="new"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT_sHgACjcvYU7yn5HiAXfAFSVx-CG4w4QHrrZICpUO7SG8oeOi2hvEiQJW8VITZuIkyhyGZC_W3MXcOHYGAijbFOnIEaj2RRx_ZW1qjgL4WhnEfg8X8vQmpkin0xOHxLlSzB5b6fqPbE/s1600/comment.gif" /></a></p><div><fb:comments width='450' expr:title='data:post.title' expr:url='data:post.url' expr:xid='data:post.id'/></div></b:if><br />
Ganti 450 dengan ukuran yang sesuai dengan template masing-masing.
Save Template.
Silahkan dicek, biasanya pertama digunakan, loadingnya agak lama, karena masih dalam proses menghubungkan.
Semoga bermanfaat, jangan lupa komennya sob..:-)
Sumber Inspirasi
Cara Pasang Kotak Komentar Facebook di Blogger | Exclusive
No comments:
Post a Comment
Terima kasih sudah berkunjung, komentar dan saran anda sangat saya hargai demi perkembangan blog ini.