Add Facebook Like Button To Blogger Posts




As we all know facebook is one of the largest social media company in the word.If your blog have any fan page then it will help you a lot in increasing traffic on your blog.We already shared all types of twitter tweet buttons and here also we are giving all types of facebook like buttons.i.e. vertical count,horizontal count and without count.You can add this button just below of of post tile and below of the post.Just follow my instructions carefully....

Note - This button will not like your fan page it will like and share your post

How To Add Facebook Like Button To Blogger Posts?



  1. Go to Blogger Dashboard > Design > Edit HTML
  2. First take a backup of your template
  3. Tick  the expand widget check box
  4. Find for below code in your template


<data:post.body/>

If you wish to add like button just below of post title the add the below code just before of<data:post.body/>

and if you wish to add this like button just below of your post then add below code justbelow of <data:post.body/>

Facebook Like Button Styles


You can add like button in three styles :
  1. Vertical Count
  2. Horizontal Count
  3. Without Count

1. Vertical Count


<b:if cond='data:blog.pageType != &quot;static_page&quot;'> <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.canonicalUrl + &quot;&amp;send=false&amp;layout=box_count&amp;show_faces=false&amp;width=55&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=62&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:55px; height:62px;'/> </b:if>

2. Horizontal Count


<b:if cond='data:blog.pageType != &quot;static_page&quot;'> <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.canonicalUrl + &quot;&amp;send=false&amp;layout=button_count&amp;show_faces=false&amp;width=90&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=21&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:90px; height:21px;'/> </b:if>

3. Without Count


<b:if cond='data:blog.pageType != &quot;static_page&quot;'> <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.canonicalUrl + &quot;&amp;send=false&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=35&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:35px;'/> </b:if>

If you faced any problem, please do not hesitate to let me know. :)

Labels: ,