Facebook Comment Plugin For Blogger

Posted in Blogging Tips

 Facebook, the talk of the world social networking site has not just been titled as the king of connecting people but also as the king of connecting websites.Facebook offers features for a third party site to use so that it can easily connect to facebook and one of that features is the Facebook Comment Plugin.

Facebook comment plugin can serve wel as your blog or website's comment system as it offers a unique and trusted way to make your readers indulge on your blog's activities.

 

So here are the steps on How you could instal the facebook comment system plugin on your blogger blog:

 

 

1.) Firstly, Go to www.facebook.com/developer to login and create a new application,

Yes! you'll be making an application since facebook treat websites as an application.

 

 

2.) Then click on "Set Up New Application"

 

 

 

 

 

3.) Then Fill up the "Application Name" field with the name of your blog and tick on the "Agree",

then Click "Create Application".

 

 

 

 

4.) After filling up and agreeing to Facebook Terms, you will be redirected to your Application's Dashboard.

5.) On the left side panel, Go to "Mobile and Devices" and note down your application id.

Facebook

 

6.) Go to Blogger.com and login your account and when in Dashboard, Go to Your Blog-> Design-> Edit HTML and Check the Expand Widget Templates box

 

 

 

Tip: It is wise to save and Backup your template first before doing anything.


 

7.) Now for it's time for a code hunting, Find " <data:post.body/>" on your template code.

 

 

Trick: It might be hard to manually search for the code, so you can try to use the find tool of your web browser by Pressing "CTRL+F" on your keyboard.

 

8.) After Finding the code, copy and paste this code below just "After" the code you have previously searched:

 

<b:if cond='data:blog.pageType == &quot;item&quot;'>
  <div id='fb-root'/>
  <script>
  window.fbAsyncInit = function() {
  FB.init({appId: &#39;YOURAPPID&#39;, status: true, cookie: true,
  xfbml: true});
  };
  (function() {
  var e = document.createElement(&#39;script&#39;); e.async = true;
  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>
  <fb:comments/>
  </b:if>

 


And Change The YOURAPPID into the Application I.D. that you have noted earlier on Facebook Developers.

 

(Note: Depending on how your Blogger template was coded and customized, you might find more than one "<data:post.body/>",

In this case you need to try it one by one to see which one is the default template code.)

 

And That's It! You now have a super sociable comment system plugged on your Blogger blog! Stay tuned for more blog customization tricks and tips.

Tags: facebook, comments, blogger, blog, tricks

Loading Comments...

Comments

{ds_PageTotalItemCount} commentcomments
{pvComments::date}
{pvComments::comment}

Post a Comment

Close