Cara Membuat Komentar Facebook di Blog
- Agar tidak bentrok dengan komentar blogger silahkan sembunyikan dulu komentar blogger kamu. Caranya klik pengaturan,lalu klik komentar dan beri centang sembunyikan komentar dan simpan.
- Buatlah Facebook App ID ( Aplikasi di Facebook ) Login dulu dengan Account Facebook Anda Lalu Silahkan buka web ini http://www.facebook.com/developers/createapp.php
- Beri nama kotak komentarmu, centang setuju
dan "Buat aplikasi baru" - verifikasi kata, dan "Submit"
- Catai ID yang kamu dapat dan jangan lupa save url kamu disitu.
- Nah sekarang tinggal memasukkanya ke blog kamu.
- Masuk ke blogger
- pilih Design / Rancangan
- Pilih Edit HTML
- Download template full dan Expand Widget template, untuk menghindari kemungkinan gagal
- Cari kode yang mirip seperti kode dibawah ini,letakkanya paling atas.
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
- Tambahkan dengan kode xmlns:fb='http://www.facebook.com/2008/fbml' akhirya terlihat seperti kode dibawah ini:
<html xmlns:fb='http://www.facebook.com/2008/fbml' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr' >
- Letakkan kode berikut tepat dibawah kode <body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'APP ID FB KAMU',
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> - Ganti yang berwarna merah dengan ID aplikasi fb kamu.
- Cari kode <title><data:blog.title/></title> kode ini letakknya diatas juga,atau bagi yang memasang meta tag tambahkan dibawah kode meta tag blog kamu. letakkan kode berikut dibawah kode <title><data:blog.title/></title> atau dibawah meta tag.
<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='NAMA BLOGMU' 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='PROFIL ID FB' property='fb:admins'/>
<meta content='article' property='og:type'/> - Ganti keterangan yang berwarna merah sesuai punya kamu.
- Cari lagi kode <data:post.body/> dan letakkan kode berikut dibawah kode <data:post.body/>
<b:if cond='data:blog.pageType == "item"'>
Ganti dark dengan warna lain yang kamu suka.
<p align='left'>Silahkan Gunakan Facebook Comment, Jika Anda Tidak Memiliki Url Blog!</p>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<div><fb:comments colorscheme='dark' expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id' width='450'/></div>
<div style='background-color: #000;border: solid 1px #cccccc; font-size:10px; padding:3px;width:100%;'> <img alt='' class='icon-action' height='16' src='' width='16'/> <b><a href='http://infonetmu.blogspot.com/' target='_blank' title='INFONETMU'>Comments for blogger!</a> brought to you by INFONETMU , Ingin Kotak Komentar seperti ini? <a href='http://infonetmu.blogspot.com/2012/01/cara-membuat-komentar-facebook-di-blog.html' target='_blank' title='komentar facebook'> KLIK DISINI!?</a></b></div>
</b:if> - Dan simpan template kamu.
Baca juga!
- Tips Modifikasi Komentar Default Blogger
- Cara Merubah Ukuran Kotak Komentar Blogger
- Menampilkan foto profil pada komentar blog
- Membuat Warna Komentar Admin berbeda pada Blog