Facebook has come up with a new set of Social plugins which enable you to provide engaging social experiences to your users. The Facebook like button will allow your readers to quickly share your posts with their Facebook Friends.
You can also get to know how many people liked your blog post.
How to add the Facebook Like button below every post
1. Login to your Blogger account and go to Layout > Edit HTML and click on the check box which says “Expand Widget Templates”
2. Look for <data:post.body/> and immediately after that place the following code:
This code will show the Like button on post pages only. If you want to display it everywhere, then remove the two lines of code in red.
3. Save the template and you should see the Like button below each of your posts.
Optional Customisations
a) Try changing action=like to action=recommend in the code to view “Recommend” instead of “Like”
b) Try changing colorscheme=light to colorscheme=dark or colorscheme=evil
c) You can change the font by editing the font=arial parameter. You can change it to any of
You can also get to know how many people liked your blog post.
How to add the Facebook Like button below every post
1. Login to your Blogger account and go to Layout > Edit HTML and click on the check box which says “Expand Widget Templates”
2. Look for <data:post.body/> and immediately after that place the following code:
<b:if cond='data:blog.pageType == "item"'>
<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&layout=standard&show_faces=false&width=100&action=like&font=arial&colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/>
</b:if>
<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&layout=standard&show_faces=false&width=100&action=like&font=arial&colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/>
</b:if>
This code will show the Like button on post pages only. If you want to display it everywhere, then remove the two lines of code in red.
3. Save the template and you should see the Like button below each of your posts.
Optional Customisations
a) Try changing action=like to action=recommend in the code to view “Recommend” instead of “Like”
b) Try changing colorscheme=light to colorscheme=dark or colorscheme=evil
c) You can change the font by editing the font=arial parameter. You can change it to any of
- font=lucida+grande
- font=segoe+ui
- font=tahoma
- font=trebuchet+ms
- font=verdana