6 December 2012

Add Facebook Like Button in your Blog


1. Go to Your blog.

2. Click on the "Design" link in Header bar right side.

3. Click on the "Edit HTML" button under the "Live on Blog".

4. Click on the "Proceed".

5. Check the CheckBox "Expand Widget Templates".

6. Search for the "<data:post .body=".body">".

7. Just before this line paste the following code.

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

8. Above code will show the Facebook button and will say to Like the page.

9. If you want to display a FB Like button the with counter showing how many "Likes" are there
   user the following code.

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

10. Click on "Save template". And its done Check it out. Happy Blogging.  :)

1 comment:

  1. Nice one. Thanks for such nice post. Its really easy and helpful.

    ReplyDelete