Facebook Send Button For Blogger

Facebook send button for blogger Facebook has recently launched a new button for sharing in private. This button features are amazing and it’s completely different from the “facebook like button”. It allows your visitors (if they logged in FB accounts) to send your blog posts to their facebook friends, there is no need to mention how important is this and facebook for marketing your blog as we all know that facebook already sending blogs thousands of visitors every day.
Facebook send button for blogger
As Facebook mentioned in their Developer Blog:
"The Send button is a social plugin that websites can use to let people send a link to a friend through Facebook Messages, post it to a Group, or email it to an individual. For example, if you see a Mother's Day gift idea on 1-800-Flowers.com, you can now send a message or email to your family members to discuss. Or say you're training for a marathon and you come across a great article about running shoes on The Huffington Post. Now you can share it with your entire running group in just one click."
Try this :
Follow these steps to add the "Facebook Send Button" to your Blogger blog.
Step 1 :
Log in to Blogger, go to Design / Layout > Edit HTML and tick the "Expand Widget Templates" checkbox.
blogger design
blogger edit html
blogger expand widget

Step 2 :
Now find (CTRL+F) this in the code:
</head>
And place the following code just before/above it:
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1' type='text/javascript'/>

Step 3 :
Now find (CTRL+F) this in the code:
<data:post.body/>
To place the Facebook Send button at the top left corner of your post paste this code before/above it :
<div style="float:left; padding:4px;">
<fb:send expr:href="data:post.url" font="arial" colorscheme="light"></fb:send>
</div>
Note :
  • To change the button position from "Top-Left" to "Top-Right" just change the float position to left. i.e. float:right changes to float:left.
  • To place the Facebook Send button at the end of your post paste the code after/below <data:post.body/>.
  • To change the light light color scheme button to dark, just change this code in the above codes, colorscheme="light" to colorscheme="dark"

Step 4 :
Save the template.
Labels: