Monday 23 April 2012

How to add different type Facebook like button in your blog.


Today I discuss how to add different types of Facebook like button in your blog. Now facebook is the leeding social site. You can see that, my blog has a Facebook like button at the end of a post and another just below the post title. Some days ago I discuss, how to add Facebook like button in your bog but today I discuss about different type of facebook like button. Facebook like button allow visitor to like your post so that other facebook friend can see this. Facebook like button helps you to increase traffic to your blog. 


There are three type of Facebook like button are shown in below

   

You can add any of them in your blog.

At first login your bolg with your Blogger ID,


Step 1. Go To Dashboard > Choose blog > Template > Edit HTML > Check "Expand Widget Template".

Step 2. Search (Ctrl+F) for
<data:post.body/> and immediately before it place the following code:

Standard Facebook like button.

Code:

<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.url + &quot;&amp;send=false&amp;layout=standard&amp;show_faces=false&amp;width=400&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=30&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:400px; height:30px;'/> </b:if>



Facebook like button with box count on top.

Code:

<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.url + &quot;&amp;send=false&amp;layout=box_count&amp;show_faces=false&amp;width=50&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=63&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:50px; height:63px;'/>
</b:if>

Facebook like button with box count at side.

Code:

<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.url + &quot;&amp;send=false&amp;layout=button_count&amp;show_faces=false&amp;width=95&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=25&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:95px; height:25px;'/>
</b:if>



Step3:

Now save the template. You are done.

Related post



0 comments:

Post a Comment

Note: only a member of this blog may post a comment.

Don't miss any update. to get our all update, like our Facebook fan page or follow us on Twitter or you can subscribe email newsletter.