.
- Goto the Facebook developers page to customize the Like button. The button can be customized to be displayed as “Like” or “Recommend“. I went with Like itself, because it is so widely used in all of facebook and helps a reader map it to FB at first sight.
- In the URL to like, enter “post.url“,
as this is how the unique permalink of each blog post is represented
within the blogger template. By default, this will be set to
“http://developer.facebook.com” and must be edited to suit your blog.
- After customizing the button, click on the Get Code button to get the code to be inserted into the template.
- Select the code in the top, with the iframe.
- Goto Layout->Edit HTML in your blogger dashboard. Select the checkbox “Expand widget templates“.
- Take a backup of the existing template before proceeding, by clicking on the link “Download full template“.
- Search for the line “<div class=’post-header-line-1′>” in your template.
- Insert the copied code in between <div class=’post-header-line-1′> and </div>.
Now
preview the template before saving the changes, to see if the button
looks fine. While customizing the like button in facebook, only the
width is specified and not the height. I have set it to be 30px and this
looks fine. After previewing the changes, save the template and you’re
done!