Bagi anda yang ingin memasang
Facebook Comments Box untuk Blogger atau Blogspot, anda bisa mempraktekannya menggunakan tutorial berikut ini. Comment blog ini bisa di pasang di berbagai CMS blog anda yang mungkin akan membuat blog anda lebih menarik dan lebih familiar dengan facebook. With the Comments Box, Facebook users on your blog can comment on your content or news, post those comments to their profiles asap, and share them with their friend on Facebook. The Comments Box allows non-Facebook users to make comments on your site as well. And via our APIs, you can access related comments made on Facebook as well to bring the conversation together.
Isi nama aplikasi dan url blog anda yang akan anda pasangkan aplikasi form komentar dari facebook
* gunakan / (slass) di akhir url (biasanya kalo ngga dikasih jadi ngga bisa) kemudian Pilih Agree dan Create Application
click to enlarge
kemudian pilih (on the left tabs-list), akan muncul menu seperti gambar di bawah :
Pilih Connect * ( terhubung = jika anda menggunakan bahasa indonesia)
- isi connect url dengan dengan nama blog anda , contoh : http://bloganda.blogspot.com/
- isi Base Domain dengan blogspot.com
kemudian klik Agree dan save changes.
Jangan lupa menyimpan / copy App ID anda (bila perlu simpan di notepad, supaya tidak bolak balik pada saat menyeting :
Step 3 : Saatnya masuk ke Blogger Dashboard anda, pada Layout atau Design - edit html, centang expand widget templates>
cari kode <html(* gunakan ctrl+F pada firefox untuk mencari)
tambahkan kode ini setelah kode <html
xmlns:fb='http://www.facebook.com/2008/fbml'
sehingga kodenya menjadi seperti ini
<html xmlns:fb='http://www.facebook.com/2008/fbml' expr:dir='data:blog..
2009/gml/expr' >
Step 4 : Cari kode <body>
kemudian pastekan kode di bawah ini setelah kode <body>
<div id="fb-root"></div>
<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>
* Jangan lupa mengganti kode Id Aplikasi anda dengan Id App anda yang terdapat pada Aplikasi yang anda buat.
Step 5 : cari kode </head>
paste kode berikut di sebelum </head>
<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='NamaBlogAnda' property='og:site_name'/>
<meta content='IdAppAnda' property='fb:app_id'/>
<meta content='ProfileIdAnda' property='fb:admins'/>
<meta content='article' property='og:type'/>
Jangan lupa mengganti tulisan:
- Nama Blog Anda : isi dengan nama blog anda (http://bloganda.blogspot.com)
- idAppAnda : isi dengan kode Aplikasi Anda.
- Profile Id : isi dengan profil facebook anda (untuk mengetahui id profile kita tinggal klik menu profile pada facebook kita *misal "http://www.facebook.com/home.php?#!/profile.php?id=670358608" berarti profile kita adalah "670358608")
Step 6 : cari kode
jika anda menemukan dua kode yang sama pilihlah kode yang kedua .
- pastekan kode berikut setelah <data:post.body>
</data:post.body>
<b:if cond='data:blog.pageType == "item"'>
<div><fb:comments expr:title='data:post.title' expr:url='data:post.url' expr:xid='data:post.id'
width='470'/></div><div style='background-color: #f2f2f2;border: solid 1px #cccccc;
font-size:10px; padding:3px;width:100%;'> </div></b:if>
Width='470' bisa anda sesuaikan sendiri dengan template karena 470,sesuaikan dengan lebar main-wrapper anda
Kemudian Save Templates.
