Sunday, December 12, 2010

Add the Facebook Like Button Below every Post


  Facebook has come up with  a new set of Social plugins which enable you to provide engaging social experiences to your users with just a line of HTML. The Facebook Like Button is One of them. You can see a demo of the like button  on this page. 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 . Here is a little Demo of what you will see 

If you are already having the like button on your blog, and wish to upgrade to the newerdesign of the like button, the read the Upgrade Instructions 

How to Add the Facebook Like Button Below every Post

1. First Generate the Facebook code using the options below. (Code will be updated with these details)
Demo:
Button Type                  
Text on the Like Button 
Color Scheme               
Font                              
Float                             
Location                        
Display                          


<b:if cond='data:blog.pageType == &quot;item&quot;'><div><iframe allowTransparency='true' expr:src='&quot;http://www.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&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/></div>
</b:if>


2. Copy the Above code. Login to your Blogger Account and go to Design > Edit HTMLand click on the check box which says “Expand Widget Templates
3. Look for <data:post.body/> and immediately after that place the copied code.
4. Save the template and you should see the Like Button near each of your posts. You are done :) 
Do you feel that the Like Button is boring and not so likable? – Then checkout theFacebook Like box, a styled version of the Like Button which would definitely bring you more “Likes” 

Upgrading the Old Like Button to the Newer Design?

If you are trying to upgrade your Facebook Like button to the newer design, then Go toDesign > Edit HTML and Expand your Widget Templates. Look for layout=standard in the Facebook iframe code. and change it to layout=button_count , save the template and you are done :) 
Also Check out : 

  1. Facebook Share Count Buttons For Blogger
  2. Create Facebook Fan Page for your Blog
If you liked this post, then consider “Like” ing it :)

0 comments:

Post a Comment