Friday, 22 June 2012

Add Facebook Like Button for Blogger Posts

While you blogging with your own blog, you may interest in enabling your viewers to share your blog content through social media to their profiles or friends. It enables your blogger friends to share information easily and help to increase your blogger traffic through sharing content over social media. Such a way is Facebook Like button. It interpret you, how many Facebook users interest in particular post in your blog and sharing it over their Facebook profile. Now Facebook Like button added a Send button along with it. So while your friends sharing your blog contents over their profile, they may able to send your posts to their Facebook friends too.

It doesn't matter you are Facebook member or not. You can implement Facebook Like button to let other Facebook members to vote on your blog posts. There are two implementations of Like button, XFBML and Iframe. But here we gonna use XFBML version and its also

available in HTML5 markup which is more versatile and supports Send button. But the only disadvantage with Facebook like button is, if you migrate to another domain after implementing like button, the likes will be vanished and you can't restore them back. If you wish to migrate to another domain, just don't depend on your Facebook likes. It's just a motivator and believe in the content you provide on your blog. So you won't need to worry about likes. The most important thing is content quality and you can gain likes back for them anytime.

Before You Go:

* Unless if you have implemented Facebook JavaScript SDK in your blog, you have to add it before you proceed with steps.

* If you are a Facebook member, you can see insights for your posts being liked and shared on Facebook and you are allowed to customize image and snippet posted on user's wall whenever they like your posts through Facebook Like social plugin. If you would like to grab those features, implement Facebook Open Graph Protocol on your blog.


1. Go to Blogger Dashboard.

2. Click on your Blog Title.

3. Navigate to Template tab.

4. Click on Edit HTML button.

5. Click Proceed button to view Template Editor.

6. Tick on, Expand Widget Templates.

7. Search (Ctrl + F) for <data:post.body/> in template and add one of following code according to your preferred implementation code and layout style just after that. You can use XFBML or HTML5 markups.


Post a Comment

Your Comment Posted After Approved.