Facebook: Module + comments counter - Blogger Version 2013!

Hello GUYS, Today I want to show how you can Put your facebook comment box into your blog!

well, we begin by:



First Copy This Code


<b:includable id='fbcomments' var='post'>
  <b:if cond='data:post.allowComments'>
    <div class='comments' id='comments'>
      <a id='fbcomments'/>
      <h4><span class='fb-comments-count' expr:data-href='data:post.canonicalUrl'/> <data:commentLabel/></h4>
      <div class='fb-comments' expr:data-href='data:post.canonicalUrl' data-num_posts='6' data-order_by='social' data-width='600' data-colorscheme='light' />

      <div id='backlinks-container'>
        <div expr:id='data:widget.instanceId + &quot;_backlinks-container&quot;'>
          <b:if cond='data:post.showBacklinks'>
            <b:include data='post' name='backlinks'/>
          </b:if>
        </div>
      </div>
    </div>
  </b:if>
</b:includable>


Modèle ►Change HTML code Then►

► Search this Code: (Using CTRL+ F) OR ( F3)

<b:widget id='Blog1' locked='true' title='Articles du blog' type='Blog'>

►Past The First Code after The Second One :


=======================================================================================
►After Search Those Code (Using CTRL+ F) OR ( F3)

<b:include data='post' name='comments'/>
<b:include data='post' name='threaded_comments'/>

 ►And Replace By
<b:include data='post' name='fbcomments'/>

 Script

<div id='fb-root'/>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) {return;}
  js = d.createElement(s); js.id = id;
  js.src = '//connect.facebook.net/en_US/all.js#xfbml=1';
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>

 

For the module to become operational, you must copy the above script in the HTML code of the blog just after the tag <body . >.

OpenGraph Protocol Facebook

1-Complete <html> ....> tag  

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

xmlns:og='http://opengraphprotocol.org/schema/'

2-Add <META> tags right after <head>:

For mode "administrator" is enabled, fb mentions: app_id and fb: admins should appear.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
  <meta expr:content='data:blog.pageTitle' property='og:title'/>
  <meta expr:content='data:blog.CanonicalUrl' property='og:url'/>
<b:else/>
  <meta expr:content='data:blog.title' property='og:title'/>
  <meta expr:content='data:blog.CanonicalHomepageUrl' property='og:url'/>
</b:if>

  <meta expr:content='data:blog.title' property='og:site_name'/>
  <meta content='article' property='og:type'/>