Search This Blog

Wednesday, November 16, 2011

cara menambahkan kotak komentar FB di Blog (how to make comment box facebook)

of course you're boring with the basic comment box in your blog, now i want to give an tips to you :
to make the comment easier, you use the comment box facebook in your blog,
How to make it?
first of all you hidden the deffault comment:
goes to your account, and than click
  • Setting
  • comment
  • select hidden
  • and save

Now the step to make comment box :
1. login to your facebook
2. Goes to Facebook developer
3. chose app and create new app
and than

 and than add the code in blogger template :

 goes to design and than edit HTML and than give check at expand template widget,

and than :
press CTRL + F and find <body
and than Copy this script below of <body
<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : &#39;your APP-ID &#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>

  •  change App id with your App Id, and than Find </head> 
  • and copy this script below </head>

 <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='Your Blog Name' property='og:site_name'/>
<meta content='http://google.com/help/hc/images/logos/blogger_logo.gif' property='og:image'/>
<meta content='your APP-ID' property='fb:app_id'/>
<meta content='your Profile-ID-Facebook ' property='fb:admins'/>
<meta content='article' property='og:type'/>


  •  and than find <data:post.body/>
  • copy this script below that 
<b:if cond='data:blog.pageType == "item"'><br /> <p align='left'><a href="http://www.kumpulancara.com/" target="new"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIsxsxsAqbj4u03XRpaSLeVXfjDcor-H5SAqdR-WFbA54E8jYYtjYX0XKBk3ExvsNEAyW6TnnPHTagWRzTS9yPpTz0Q_i62eSu3UePJXjVwu8rNUGddYnWKAfW8LnrIsGekrmWarjuE_A/s1600/comment.gif" /></a></p><div><fb:comments width='450' expr:title='data:post.title' expr:url='data:post.url' expr:xid='data:post.id'/></div></b:if><br />

Save You Setting,,,,, Good Luck... 
if your confuse, just leave a comment,,,


klik the advertise please,, :-)


note : Download your deffault template to keep your template, if this there is something wrong,,,,


No comments:

Post a Comment

tinggalkan komentar


Popular Posts