hehe,, lagi sibuk nyiapin blog baru soalnya :D
Kali ini saya akan memberikan tutorial mengenai "memasang komentar facebook pada blog"
Okey, Langsung Saja deh :D
Tapi terlebih dahulu backup template anda untuk menghindari kesalahan
Step 1. Disable/nonatifkan komentar default blog
Kenapa ? karena nanti tampilan blogmu akan rancu kalau ada 2 kotak komentar
Cara Disable : Buka Akun blogger > setting > comments > Pilih "Hide" > Save Setting
Step 2. Membuat aplikasi facebook untuk komentar blog
Masuk ke link Facebook Developers > Buat Aplikasi > Masukkan Nama Aplikasi (terserah anda) > tandai "SETUJU" > klik "Create Application"
Nah aplikasi selesai, tinggal kita konekin ke blog kita, masuk ke tab "Situs Web" lihat gambar
Step 3. Memasukkan Kode Ke Template Blog
Masuk ke akun blogger > Layout > Edit HTML > Expand Widget Template
cari kode ini <html
Kalu sudah ketemu, tambahkan kode dibawah ini
xmlns:fb='http://www.facebook.com/2008/fbml'Harus ada Spasi diantara kode tersebut, ini contohnya
<html xmlns:fb='http://www.facebook.com/2008/fbml' expr:dir='data:blog..............2005/gml/expr' >
Langkah selanjutnya,
Cari kode <body>
Setelah kode atau dibawah kode diatas masukkan script dibawah ini
<div id="fb-root"></div>Selanjutnya, Memasang Open Graph Protocol Tags
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'ID Aplikasi Anda',
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);
}());
</script>
<b:if cond='data:blog.pageType == "item"'>Sesuaikan Tulisan yang berwarna diatas dengan blog anda dan facebook anda
<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 BLOG ANDA' property='og:site_name'/>
<meta content='URL LOGO BLOG ANDA.gif' property='og:image'/>
<meta content='ID APLIKASI ANDA' property='fb:app_id'/>
<meta content='ID FACEBOOK ANDA' property='fb:admins'/>
<meta content='article' property='og:type'/>
setelah merubah/mengedit script diatas, cari kode </head>, lalu simpan script diatas sebelum tag </head> atau diatasnya.
Step 4. Menambahkan kotak komentar facebook.
cari kode <data:post.body/> kemudian masukkan script dibawah ini kebawah kode <data:post.body/>
<b:if cond='data:blog.pageType == "item"'>Ganti tulisan yang berwarna hijau susai dengan keinginan anda.. untuk colorscheme hanya ada 2 pilihan yaitu "Light" & "Dark"
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<div><fb:comments width='450' expr:title='data:post.title' expr:href='data:post.url' colorscheme='dark' expr:xid='data:post.id'/></div>
<div style='background-color: #f2f2f2;border: solid 1px #cccccc; font-size:10px; padding:3px;width:100%;'> <img alt='' class='icon-action' height='16' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhx6nav_V6DEM8eDp6Yn_510cvY07be_d1UAOhQyiyWE3kKHwlk1_MLqNCKrNHkkINM64P4Ye6rAxnMBytPpZpyg3BOiLgFlK5KadcVNjAVsRJq2TRS7Uy6gAY7gYSCGijez_bXefOYEMw/s1600/cooltext527602427.png' width='16'/> <b><a href='http://www.lorddayz.blogspot.com/' target='_blank' title='blogger templates'>LordDayz Comments For Blogger</a> Mau Pasang Kotak Kmentar Facebook Seperti Ini ? Klik Link ini <a href='http://lorddayz.blogspot.com/2011/06/memasang-kotak-komentar-facebook.html' target='_blank' title='kotak komentar fb'>LordDayz Facebook Comment Tutorial</a></b></div>
</b:if>
Sekian dulu tutor dari saya, semoga berguna \m/
