06 November 2009 ~ Comments ~ Share ~

How to add Official Facebook Share Count button in Blogger?

Blogger Facebook Howto Tips and Tricks Tutorial

Remember, a while ago we covered “How to add Tweet This to Blogger templates?“.  And if you know, recently, Facebook has also allowed an easy integration of an Official Facebook Share button in any website.  This button is their Tweetmeme version of Facebook Share.

Facebook share count buttonIf you use Wordpress, you know there are many plug-ins which allows official or unofficial version of Facebook Share count button.  Though the people using Blogger are out of luck because Blogger doesn’t support plug-ins.  Don’t worry, I have created an easy hack for you to include the OFFICIAL Facebook Share count button in your Blogger blogs.

Here is how to add Official Facebook Share Count Button to Blogger:

  1. Go to your Blogger Dashboard.
  2. Then go to Layout -> Edit HTML.
  3. Check “Expand Widget Template”.
  4. Search for the following section of code:

    <div class=’post-body’>  OR  <data:post.body/>

  5. Now add the following code (just copy/paste) right after this line:

    <b:if cond=’data:blog.pageType != &quot;item&quot;’>
    <div style=’float:left; margin-right:10px;’><a expr:share_url=’data:post.url’ name=’fb_share’ type=’box_count’>Share</a><script src=’http://static.ak.fbcdn.net/connect.php/js/FB.Share’ type=’text/javascript’/></div></b:if>

  6. Do a ‘Preview Template” if you want.  And if no error is shown, Save your template.
  7. That’s it.  Visit your blog.  You should see a Facebook Share button on the left side of your post.
  8. When readers click on this button, it will be able to fetch your blog post title and a little description.
  9. The counter will keep increasing as more and more people share your articles.
  10. Enjoy…!!!

Now if you want, you can change the location of this button wherever you want with a little CSS modification and the location where the above code is added.  Do a trial and error to find the best location for this button yourself.

Let me know if you get any error messages etc.   I would love to hear how it works out for you.  Drop in comment if you were able to add Facebook Share Count button to your Blogger Template.

If you like this tutorial, then please share this article on Digg, Twitter, Facebook and other social networks as a favor.  I will really appreciate your help.

VN:F [1.7.7_1013]
Rate this post:
Rating: 0.0/5 (0 votes cast)
VN:F [1.7.7_1013]
Rating: +2 (from 2 votes)

Related Posts

Tags: , , , ,
Line Break

Author: Anurag Bansal (498 Articles)

Anurag Bansal is a technology enthusiast, gadget lover, Internet addict, Fun loving person who like to read and write about Technology. Feel free to follow him on various social networks including Twitter (@technomania) and Facebook (facebook.com/anuragbansal).

  • I am getting the following error message when I try to add the code as specified above.

    Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
    XML error message: Open quote is expected for attribute "{1}" associated with an element type "cond".

    Can you please help?
  • Hi Noel,
    Please check you have ‘Expand Widget templates’ enabled.
    And then confirm that you have copied the complete code.
    Please send me your full HTML template if you still have issues.

    Thanks
    Anurag Bansal
  • How/Where can i send you the HTML code? I dont want to paste it here in the comments.
    Thanks for your support.
  • You can send me the code at "blog [at] knowliz [dot] com". I will check as soon as possible.
    Thanks
  • NoeL, I have sent you back the corrected template for Facebook button. Hope it works for you now. Let me know either way.
    Thanks..
blog comments powered by Disqus