Saturday, December 11, 2010

Pasang Kotak Komentar Facebook di BLog

Keren gak sih kalo blog kita punya kotak komentar dari facebook?? ingin tahu bagaimana cara memasang kotak komentar Facebook di blog kita??
Oke dah gak usah kebanyakan intro, langsung kita simak cara nya.
  •  Pertama login ke akun blogger kamu,kemduian pilih pengaturan pilih tab komentar lalu pilih sembunyikan pada tombol komentar untuk menyembynikan kotak komentar,.atau kamu bisa pilih "tampilkan" berarti nantinya ada 2 kotak komentar yang satu facebook dan yang satu kotak komentar blog kamu.
  • kemudian buka facebook,login terlebih dahulu,lalu masuk ke aplikasi facebook developers. atau klik disini.
  • buat nama aplikasi terlebih dahulu kemudian klik tombol " Buat Aplikasi baru"

  • Setelah akan masuk ke menu pengaturan aplikasi tersebut,kemudian masuk ke menu website ,lalu masukkan URL blog KAMU pada bagian "URL SITUS" semisal blog saya adalah http://blog-thinker.blogspot.com,masukkan pada akhiran blog dengan tanda / jadi nantinya adalah http://blog-thinker.blogspot.com/ ,lihat gambar ini untuk lebih jelasnya

Jika sudah klik save, catat  Applications ID'nya (Kode Aplikasi)

Jika sudah, masuk ke Akun Blogger kamu >> Rancangan(Design) >> Edit HTML >> Centang Expand Template Widget.

Kemudian  cari kode berikut:
<body>
Setelah ketemu, masukkan kode dibawah ini tepat dibawah nya persis

<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : &#39; APP-ID Kamu &#39;,
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(&#39;script&#39;);
e.src = document.location.protocol + &#39;//connect.facebook.net/en_US/all.js&#39;;
e.async = true;
document.getElementById(&#39;fb-root&#39;).appendChild(e);
}());
</script>

Kemudian, Cari Kode <b:skin><![CDATA[/* dan Copy Kode Dibawah ini Dan taruh tepat diatasnya:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<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='URL Blog kamu' property='og:site_name'/>
<meta content='http://google.com/help/hc/images/logos/blogger_logo.gif' property='og:image'/>
<meta content='APP-ID Kamu' property='fb:app_id'/>
<meta content='andri.yunianto' property='fb:admins'/>
<meta content='article' property='og:type'/>

Jika Sudah, Cari Kode <data:post.body/> dan copy Script dibawah ini tepat Dibawah kode tersebut:

<b:if cond='data:blog.pageType == &quot;item&quot;'><br/> <p align='left'><a href='http://blog-thinker.blogspot.com/' target='new'><img border='0'/></a></p><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%;'><b> by <a href='http://blog-thinker.blogspot.com/' target='_blank' title='Facebook Comment'><blink>Mau Pasang kotak komentar seperti ini? Klik Disini</blink></a></b></div></b:if><br/>

Kemudian save tempelate. Tararaaaaaa...kotak komentar facebook udah nongkrong di bawah postingan kamu!!! Lihat contohnya di bawah postingan ini, eitz,,sekalian tinggalkan komentarnya..hehe!


Selamat Mencoba...
Semoga bermanfaat.....

2 comments:

INDO4RT said...

Klw untuk kode : ga ada kang gimna??

Admin said...

Centang dulu expand template nya gan.

Post a Comment

:) :(;):D;;-):-/:x:P:-*=((:-OX(:7B-):-S#:-S7:):((:)):|/:)=))O:-):-B=;I-)8-|L-):-a:-$[-(:O)8-}2:-P(:|=P~:-?#-o=D7:-SS@-):^o:-w7:P2):):-c:)]~X(:-h:-t8-7X_X:!!m/:-q:-bd^#(^Blog Thinker