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.
If 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:
- Go to your Blogger Dashboard.
- Then go to Layout -> Edit HTML.
- Check “Expand Widget Template”.
- Search for the following section of code:
<div class=’post-body’> OR <data:post.body/>
- Now add the following code (just copy/paste) right after this line:
<b:if cond=’data:blog.pageType != "item"’>
<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> - Do a ‘Preview Template” if you want. And if no error is shown, Save your template.
- That’s it. Visit your blog. You should see a Facebook Share button on the left side of your post.
- When readers click on this button, it will be able to fetch your blog post title and a little description.
- The counter will keep increasing as more and more people share your articles.
- 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.
![[Valid RSS]](http://img80.imageshack.us/img80/339/validrssrogers.png "Validate my RSS feed")
[...] This post was mentioned on Twitter by Anurag Bansal, Anurag Bansal. Anurag Bansal said: @amandafazani How to add Official Facebook Share Count button in Blogger? Plz have a look – http://su.pr/3NOge5 Plz RT if you like. TIA [...]
@amandafazani How to add Official Facebook Share Count button in Blogger? Plz have a look – http://su.pr/3NOge5 Plz RT if you like. TIA
How to add Official Facebook Share Count button in Blogger? | Knowliz http://su.pr/3NOge5 #Blogger #Facebook
How to add Official Facebook Share Count button in Blogger? | Knowliz: Drop in comment if you were able to add .. http://bit.ly/377Acs
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 copies the complete code.
Please send me your full HTML template if you still have issues.
Thanks
Anurag Bansal
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 copies 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..
thats cool! I knew how to put a facebook add as a friend button but this is new for me. Thnx for the know-how
Thankyou for the facebook share code. Anybody getting error can try again as I have successfully added after facing errors initially.
the code initially was showing error -”XML error message: Open quote is expected for attribute “{1}” associated with an element type “cond”. ” I replaced all the – ’ – with – ' – and it is now working with charm. thanks
Works ok, but doesn't have the actual post title come through (the url shows up as if it is the title).
For those getting the xml error, note that the actual text that appears up there has “smart quotes” for the single quotation marks. You need to manually change each of these to a regular single quote (the one on your keyboard) to make it work.
Thank you so much! Works like a charm!
Very helpful thanks!
This is very helpful HTML code. Thanks a lot. I really appreciate it.
This is very helpful HTML code. Thanks a lot. I really appreciate it.