Blogger
also providing their comment system and in some templates have threaded comments
system in blogger. But now a days social media is increasing and most of
traffic also come from social media therefore adding Facebook comment system is
a good idea for get feedback from social media king site Facebook. In today’s
tutorial we will discuss on Facebook comment system and learn how to add this
system in Blogger blog / site. So, Lets start our today’s tutorial.
Source |
How To
Get Facebook
App ID?
This
tutorial divided in some steps you need just follow these steps giving below.
- First Go to Facebook Developers Page
- Give you app name as your site title name etc and click on continue button as showing below
Source |
- Now fill security check captcha and then continue
- Now you go on a new page here you can see your app id and we need it in next steps
Source |
How To Add Facebook Comments In Blogger?
- First go to Blogger > Template > Edit HTML
- Now search for <html and just after it give a space and paste the below code
xmlns:og='http://ogp.me/ns#
xmlns:og='http://ogp.me/ns#
- Now search for tag and just below it paste the following code
<div
id="fb-root"></div>
<script>
window.fbAsyncInit
= function() {
FB.init({
appId :
'YOUR_APP_ID',
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>
- Replace YOUR_APP_ID with your Facebook Application ID
- Now search for </head> and just above it paste the below code
<meta property="fb:app_id"
content="YOUR_APP_ID" />
- Replace YOUR_APP_ID with your Facebook Application ID
- Now search for <b:includable id='comment-form' var='post'> just after it paste the below code
<b:if
cond='data:blog.pageType == "item"'>
<div
style='padding:20px 0px 5px 0px; margin:0px 0px 0px 0px;'>
<script
src='http://connect.facebook.net/en_US/all.js#xfbml=1'
/>
<div>
<fb:comments
colorscheme='light'
expr:href='data:post.url'
expr:title='data:post.title'
expr:xid='data:post.id'
width='550'
/>
</div>
</div>
</b:if>
- Now click on Save Template button and you are done !
- Now you have successfully added Facebook Comments System in Blogger for result check preview of your site
xmlns:og='http://ogp.me/ns#
0 comments:
Post a Comment
Please leave a comment as your signature for a visit... Thank you!!!