Jumat, 02 Februari 2018

how to add facebook comment in blogger

Latest version Facebook comment box for Blogger - The Comments plugin lets people comment on blog post on your site using their Facebook account. If people wish to they can share this activity to their friends in News Feed as well. This comment box also contains built-in moderation tools and special social relevance ranking.

There have been many facebook comment box in internet but today i am share the latest version of facebook comment box. Recently facebook developer update their Facebook Comment box plugin version v2.3. The main facilities are using of facebook comment box is, visitors are easily explain their opinion about your content and admin can catch his/her visitors easily.

eg facebook coment for blogger


Latest version facebook comment box look more beautiful then previous version. First of all, in this tutorial we are talking about the facilities of the Facebook comment box. We all know that Facebook is the most popular social network site in the world.

They always release new features to serve the people and to catch the visitors more on the Facebook. So Facebook comment box is one of the best popular feature of facebook. When some people like and reply to their comment.

notification is appeared to the user. And it also provides multiple commenting features. The main disadvantage of Facebook comment box in blogger is that Google spider never crawl Facebook comment as blog comment, so these comment can not be useful in the view of optimization.

Here's how to step by step

  • Go blogger
  • Templates
  • Edit templates
  • Searh code <head>
Put this code under the <head>

<meta expr: content = 'data: blog.url' property = 'og: url' />
<meta expr: content = 'data: blog.title' property = 'og: site_name' />
<b: if cond = 'data: blog.pageName'>
<meta expr: content = 'data: blog.pageName' property = 'og: title' />
</ b: if>
<meta content = 'website' property = 'og: ketik' /> </ b: if> </ b: if> </ b: if>
<b: if cond = 'data: blog.postImageThumbnailUrl'>
<meta expr: content = 'data: blog.postImageThumbnailUrl' property = 'og: image' />
</ b: if>
<meta content = 'YOUR_APP_ID' property = 'fb: app_id' />
<meta content = 'http: //www.facebook.com/username' property = 'fb: admins' />
<meta content = 'article' property = 'og: type' />

Replace YOUR_APP_ID with the App ID which you saved on your computer earlier.
http://www.facebook.com/username is the link of Facebook admin url.Just replace with your facebook profile url.

Step 2

Install the code below after the <body> tag. If you have added this, then ignore it.
<div id = 'fb-root' />
<script type = 'text / javascript'>
// <! [CDATA [
window.fbAsyncInit = function () {
FB.init ({
appId: 'YOUR-FB-APP-ID',
status: true, // check login status
cookie: true, // enable cookies
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>

YOUR-FB-APP-ID "replace it with your Facebook APP ID
 Now again search <div class='post-footer-line post-footer-line-1'>  and past the following code below the above code.

<b: if cond = 'data: post.isFirstPost'>
<script> (function (d) {
  var js, id = 'facebook-jssdk'; if (d.getElementById (id)) {return;}
  js = d.createElement ('script'); js.id = id; js.async = true;
  js.src = & quot; // connect.facebook.net/en_US/all.js#xfbml=1&quot ;;
  d.getElementsByTagName ('head') [0] .appendChild (js);
} (document)); </ script>
</ b: if>
<b: if cond = 'data: blog.pageType == & quot; item & quot;'>
<div id = 'fb-root' />
<script> (function (d) {
  var js, id = 'facebook-jssdk'; if (d.getElementById (id)) {return;}
  js = d.createElement ('script'); js.id = id; js.async = true;
  js.src = & quot; // connect.facebook.net/en_US/all.js#xfbml=1&quot ;;
  d.getElementsByTagName ('head') [0] .appendChild (js);
} (document)); </ script>
<div style = 'margin: 20px 0 0 0; background: white; border: 1px solid silver;'> <fb: comments colorscheme = 'light' data-version = 'v2.3' expr: href = 'data: post .canonicalUrl 'expr: title =' data: post.title 'expr: xid =' data: post.id 'width =' 100% '/> </ div>
</ b: if>
   <div class = 'clear' />

Save templates


EmoticonEmoticon