Kepolover - Hai sobat Kepolover.blogspot.com, lama tidak posting artikel nih admin. Maaf soalnya lagi sibuk dengan deadline bikin web blog baru. Oke, sekarang admin akan memberikan kalian tutorial cara membuat kotak komentar facebook pada blog secara rinci, lengkap disertai dengan setting moderasi untuk komentar yang masuk. Namun sebelum itu perlu juga saya sampaikan disini mengenai kegunaan dan keuntungan kita memiliki form kotak komentar FB pada blog kita. Alasannya adalah faktor popularitas jejaring sosial raksasa tersebut memang menakjubkan disamping itu dengan menaruh kotak komentar FB pada blog maka setiap kali ada pengunjung yang komentar di kotak FB blog kalian maka secara otomatis url postingan kalian akan muncul dan dishare di FB.Disini akan saya tunjukkan langkah2 pembuatanya dimulai dari membuat Applikasi dulu di FB hingga tahap pemasangan kotak komentar FB. Dan yang tidak kalah pentingnya adalah cara memasang moderasi komentar FB pada blog agar sang pemilik blog bisa memfilter terlebih dahulu komentar FB yang masuk dan mengontrol tiap komentar FB yang ada pada blog.
Baiklah langsung saja akan saya share caranya dari tahap awal, ikuti dari awal ya Gan biar nanti nggak bingung.
TAHAP I
Membuat Aplikasi untuk komentar di Facebook.
Langkahnya sangat mudah, caranya sebgai berikut:1 Masuk/login ke Facebook.com
2 Setelah itu lanjutkan dengan masuk developer/pengembang situs FB di link: developers.facebook.com/setup
3 Klik Create New App
5 Ketik Nama Aplikasi yang dikehendaki, sekedar contoh diatas adalah: Kepolovercom
6 App Namespace: Ini bisa dibiarkan kosong atau tulis nama dengan minimal 7 karakter
7 Klik Lanjutkan
8 Selanjutnya muncul jendela munculan verifikasi kata, ketik terus Submit.
9 Selesai.
Nah, sampai tahap ini kalian sudah selesai membuat Aplikasi yang akan digunakan untuk fungsi komentar di blog kalian. Pada screeshoot diatas tertera nama Aplikasi dan nomor ID Aplikasi serta kode rahasia Aplikasi.
TAHAP II
Memasukkan alamat blog kedalam Aplikasi yang telah kaliah buat pada tahap I
Seringkali kita menjumpai blog atau situs yang memiliki kotak komentar FB kadangkala mengalami error dengan adanya pesan seperti "Warning: the url --- is Unreachable". Penyebab utama dari kasus tersebut sebaian besar adalah tidak dimasukkannya alamat URL blog pada Aplikasi yang baru dibuat. Berikut saya jelaskan cara memasukkan alamat blognya.1. Sampai pada tahap I ketika kalian sudah mendapatkan ID App kalian maka lihatlah pada
kolom bawahnya, disitu tertera beberapa kolom yang harus kalian isi.
Ket: Page ini bisa juga diakses dengan link: https://developers.facebook.com/apps/ID App
Ganti font merah dengan kode ID App pada step tahap 1.
2. Setelah itu ketik alamat email FB kalian, contoh: Kepolover@gmail.com
3. Abaikan saja kolom App Domain
4. Pada bagian tengah dimana terdapat kalimat "Select how your app integrates with
Facebook", langsung klik saja checklist Website dan kemudian lanjutkan dengan
pengisian nama domain blog kamu yang akan dikasih kotak komentar.
5. Iya, isi pada kolom tersebut nama domain blog kamu dan harus diakhiri dengan
garis miring, contoh: http://www.Kepolover.blogspot.com/
6. Lanjutkan dengan Klik Save Changes pada bagian bawah
Lihat screeshoot berikut agar lebih jelas.
TAHAP III
Pada Tahap ini kalian harus memasang tiga jenis kode dari developer FB ke template blog kalian: Kita harus memasukkan 3 (tiga) script kode ke template blog kalian. Dengan catatan kalian sudah mengetahui ID App dan ID FB kalian. Untuk cara mengetahui kode ID FB bisa dilihat Disini.
Nah biar aman dan lancar lebih baik copas dulu nomor ID App dan ID FB pada Notepad.
Seperti biasa kalian harus masuk ke blogger dan pilih Template ----> edit HTML ----> Proceed----> Centang Expand Widget Templates
(PERHATIAN: BACK UP DULU TEMPLATE KALIAN AGAR AMAN)
Terus???ini kelanjutannya..
1. Menyisipkan kode fbml facebook pada template blog.
Caranya yaitu mencari dulu kode <html lalu sisipkan kode xmlns:fb='http://www.facebook.com/2008/fbml'dan taruh pada bagian setelah kode tersebut, contoh <html xmlns:fb='http://www.facebook.com/2008/fbml'
2. Memasukkan kode Open Graph Protocol Tag pada template blog.
Caranya adalah sebagai berikut:
- Carilah kode <b:skin>
- Copas kode berikut tepat diatas kode <b:skin>
Caranya adalah sebagai berikut:
- Carilah kode <b:skin>
- Copas kode berikut tepat diatas kode <b:skin>
<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='BLOG NAME' property='og:site_name'/>
<meta content='http://google.com/help/hc/images/logos/blogger_logo.gif' property='og:image'/>
<meta content='YOUR APP ID ' property='fb:app_id'/>
<meta content='YOUR ID FB PROFILE' property='fb:admins'/>
<meta content='article' property='og:type'/>
- Ganti BLOG NAME dengan nama blog kalian.
- Ganti YOUR APP ID dengan nomor ID App kalian.
- Ganti YOUR ID FB PROFILE dengan ID FB Profile kalian, bila nggak tahu yang ini buka cara menemukannya disini.
3. Memasukkan kode SDK Facebook
Caranya adalah sebagai berikut:
- Cari kode <body
- Copas kode berikut tepat dibawah kode <body
<div id="fb-root"></div>
<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() {
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);
}());
<fb:comments/>
</script>
Penting!!...Nah, nyampai disini berarti kalian sudah memasang atau mengintegrasikan Aplikasi dan perangkat sistem moderasi komentar FB pada blog kalian. Namun kalian masih belum memasang kotak komentar FB pada blog kalian sehingga sudah dipastikan gak akan muncul. Nah untuk memasang kotak komentar FB maka kalian akan saya kasih sebuah tips yang sangat menarik yakni tentang memasang kotak komentar FB pada blog bersebelahan dengan komentar blogger . Modelnya persis seperti yang ada di blog Kepolover ini. Lihat screenshoot:
CATATAN: Apabila sudah memasang kotak komentar diatas, maka pemasangan komentar FB+Moderasi sudah selesai. Untuk melihat komentar masuk dan melakukan moderasi bisa di akses di URL: http://developers.facebook.com/tools/comments
Tutorial ini telah diuji dan dipraktikkan dan sukses, sumber ilmu ini didapat dari rujukan http://www.alkhoirot.net. Saya selaku admin Kepolover.blogspot.com mengucapkan terima kasih kepada admin alkhoirot.net karena sudah memberikan ilmu yang sangt bermanfaat ini dimana sebelumnya belum pernah saya temukan se detail itu.
10 komentar
Not WORKED !
Kalau ke web yang menggunakan aplikasi wordpress caranya bagaimana yang mas? apa tetap sama? thanks
Bagus juga kawan, terima kasih info nya yah, saya juga baru belajar make ni.., maaf, boleh minta tolong nggak kau folow blog kami di http://abu-ummu.blogspot.com
terima kasih
sob , kok waktu ane paste ini
xmlns:fb='http://www.facebook.com/2008/fbml'
<html
terus ane save malah eror ya sob, ...
oo ya sob , ane follow blog ni sob...
klo bisa follow balik ya .. :D
ya error lah, mestinya kode tersebut diletakkan setelah <html
contoh:
<html xmlns:fb='http://www.facebook.com/2008/fbml'
Makasih bang dah docoba berhasil. Horee..,
Dari kemaren kebingungan cara dapetin notif kalo ada yg komen.
yah paling gak sekarang dah tau kalo ada yang komen walaupun bukan notif
Thanks :) rifaldhi.blogspot.com
work kk, makasih~ xD
Koq akhir2 ini sering error yah sob, comment Fbnya?
Infonya sangat menarik tapi sayang kodenya kaga bisa dicopy
kocak ni blog gan , kaga bisa di copas ,, kocak
EmoticonEmoticon