Monday, April 2, 2012

Tips Cara Memasang Kotak Komentar Facebook

Posted By: Randy Ikas - Monday, April 02, 2012

Share

& Comment

Banyak sahabat blogger yang sudah berbagi cara memasang kotak komentar di blog [blogspot]. Kali ini saya pun ingin berbagi Tips Cara Memasang Kotak Komentar Facebook. cara yang saya bagikan ini menggunakan script baru sehingga sudah ada pemberitahuan [notify] bila ada komentar masuk.

Modal utama untuk bisa memasang kotak komentar facebook di blog harus memiliki applikasi di facebook, jika belum punya silahkan buat disini. Setelah memiliki applikasi berarti kita sudah mendapat ID Applikasi pastikan pada setting aplikasi domain dan site URL diberi domain kita ex: http://www.emingko.com, selanjutnya ikuti langkah berikut:


Login ke blogger --> Rancangan -- Edit HTML -- centrang pada Expand Template Widget. Karena prosesnya cukup sulit sebiknya Anda download template lengkap seandainya ada masalah bisa dikembalikan.

Cari code <html tambahkan kode di bawah di bagian belakangnya

xmlns:fb='http://www.facebook.com/2008/fbml'

Contoh: <html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' ...... xmlns:fb='http://www.facebook.com/2008/fbml'>
Sekarang copy kode di bawah, taruh tepat di atas kode </head>



<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta expr:content='data:blog.pageName' property='og:title'/>
<meta expr:content='data:blog.url' property='og:url'/>
<meta content='article' property='og:type'/>
<b:else/>
<meta expr:content='data:blog.title' property='og:title'/>
<meta expr:content='data:blog.homepageUrl' property='og:url'/>
<meta content='blog' property='og:type'/>
</b:if>
<meta content='my site name' property='og:site_name'/>
<meta content='http://Google.com/help/hc/images/logos/blogger_logo.gif' property='og:image'/>
<meta content='you'r app ID' property='fb:app_id'/>
<meta content='you'r profil ID' property='fb:admins'/>

Ganti my site name dengan nama blog Anda

Ganti http://Google.../blogger_logo.gif dengan link image blog Anda [yang ini tidak diganti juga tidak apa-apa]
Ganti you'r app ID dengan ID Appliksi yang Anda buat tadi
Ganti you'r profil ID dengan ID profil facebook Anda, contoh link profil facebook "http://www.facebook.com/profile.php?id=123456789" yang dicetak tebal itu IDnya.

Kemodian copy kode di bawah, taruh di bawah kode <body>

<div id='fb-root'/>
<script src='http://connect.facebook.net/en_US/all.js#appId=you'r app ID&amp;xfbml=1'/>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : &#39;you'r app ID&#39;,
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
FB.Event.subscribe(&#39;comment.create&#39;, function(response) {
// do something with response.session
// you can add any function here to fire on comment

alert(&#39;a comment was just created&#39;);
});
FB.Event.subscribe(&#39;comment.remove&#39;, function(response) {
// do something with response.session
// you can add any function here to fire on remove

alert(&#39;a comment was just removed&#39;);
});
};

(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>

Ganti you'r app ID dengan ID Appliksi yang Anda buat tadi

Terakhir copy kode di bawah, taruh di bawah kode <data:post.body/>

<fb:comments expr:title='data:post.title' expr:href='data:post.url' expr:xid='data:post.id' migrated='1' notify='true' numposts='5' width='490' xid='you'r app ID'></fb:comments>

Ganti you'r app ID dengan ID Appliksi yang Anda buat tadi
Catatan:
  • Agar tidak muncul dua kotak komentar sebaiknya sembunyikan kotak komentar bawaan, caranya atur di pengaturan --> komentar --> sembunyikan komentar lalu simpan pengaturan.
  • Pemberitahuan bila ada komentar di blog akan masuk ke akun facebook kita seperti pemberitahuan jika ada yang mengomentari status, pemberitahuan juga masuk ke link ini http://developers.facebook.com/tools/comments/

About IKASMEDIA.COM

IKASMEDIA adalah blog yang didedikasikan untuk membangun pendidikan melalui khususnya pendidikan di daerah 3T Mari bersama membangun indonesia menuju generasi emas dan indonesia sejahterah. Kupang 2015

0 komentar:

Post a Comment

Copyright © 2015 IKASMEDIA™ is a registered trademark.

Designed by Templateism. Hosted on Blogger Platform.