ternyata facebook juga bisa langsung beradaptasi dengan blogger buktinya facebook mengeluarkan plugins yang bisa berupa widgets, lencana dan kali ini kotak komentar. Karena sudah banyak pengguna facebook makanya kotak komentar ini sangat berguna apalagi biar banyak yang komentar .
langsung saja aku kasih tutorial / cara buatnya :
langsung saja aku kasih tutorial / cara buatnya :
- Pertama, harus login ke akun facebook dulu
- Lalu, buka web ini http://www.facebook.com/developers/createapp.php
Beri nama kotak komentarmu, centang setuju dan "Buat aplikasi bari" |
verifikasi kata, dan "Submit" |
Klik pada " Web site " lalu ketikkan alamat blog , klik perbesar gambar agar lebih jelas |
- Nah, sekarang langkah di blognya
- Masuk ke blogger
- pilih Design / Rancangan
- Pilih Edit HTML
- Download template full dan Expand Widget template, untuk menghindari kemungkinan gagal
- Setelah itu, cari kode <body>, dan letakkan kode berikut tepat di bawah kode <body> (Gunakan Ctrl + F untuk mencari kode)
<div id='fb-root'/>
<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>;
- Keterangan , ganti ID APLIKASI dengan Id Aplikasi yang barusan
- Selanjutnya, cari kode </body> (Gunakan Ctrl + F lagi, biasanya kode ini terletak paling bawah)
- Setelah ketemu, letakkan kode berikut tepat di bawah kode </body> tadi
<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 BLOG ANDA' property='og:site_name'/>
<meta content='http://google.com/help/hc/images/logos/blogger_logo.gif' property='og:image'/>
<meta content='ID APLIKASI ANDA' property='fb:app_id'/>
<meta content='ALAMAT EMAIL APLIKASI' property='fb:admins'/>
<meta content='article' property='og:type'/>
- Keterangan, ganti kode yang warna merah sesuai keterangan
- Cari lagi kode <data:post.body/>
- Jika sudah ketemu, masukkan kode berikut ini tepat di bawah kode <data:post.body/> tadi
<b:if cond='data:blog.pageType == "item"'><br/> <div><fb:comments expr:title='data:post.title' expr:url='data:post.url' expr:xid='data:post.id' width='450'/></div>
<div style='background-color: #f2f2f2;border: solid 1px #cccccc; font-size:10px; padding:3px;width:100%;'></div></b:if>
- Keterangan, silahkan atur width, background color, dan sebagainya jika ingin merubah tampilannya. Jika tidak, biarkan saja.
- Simpan / save template
- Sekian Tutorial dari saya moga bermanfaat
0 komentar:
Posting Komentar