Add Facebook Send Button for Blogger Blogspot

In our previous post, we introduced the new Facebook Send Button for Blogger. In this post, we will present a short tutorial on integrating the Facebook send button to your blogger template. I would like this send button to come just below my blog post title. But, you can just extend this tutorial to place it anywhere on your blog. So, to get started, navigate to the URL given in our initial Send button tutorial for Blogger and get your code for the Send Button. You can follow the steps given below, once you have the code.

1) In Blogger, navigate to Design. Click on Edit HTML. Check on "Expand Widget Templates". Take a complete backup of your current template, before we add the code for Send button. Example screeshot below:

Backup Your Blogger Template -  Facebook Send Button Addition

2) Now, Find the tag in your template, and add the following code just above it

<script src="http://connect.facebook.net/en_US/all.js#appId=APP_ID&amp;xfbml=1"></script>

3)Now, inside your template, find the location where you want to place the "Send Button" and add the following piece of code

<fb:send href="example.com" font="tahoma" colorscheme="dark"></fb:send>

4) The code given in step (3) is sample only. You can replace it with the code generated from Facebook page. To place it below the Title URL, you can find the "a expr:href='data:post.url'" in your template and add it below the template as shown in the section below

        <b:if cond='data:post.url'>
          <a expr:href='data:post.url'><data:post.title/></a>&lt;br&gt;<fb:send href="example.com" font="tahoma" colorscheme="dark"></fb:send>

And that is it..If you click on preview, you will get the "Send" button showing up on your blog post.