Add The Brand New Facebook Send Button To Your Blog

Facebook have just created a brand new shiny button you can add to your blog for people to share your content.The button was released just today so it’s not even a day old and you can be one of the first to have it on their blog, Yep people will be seeing it for the first time and checking it out on your blog ! So what is the new Facebook button and what does it do ?

We are all used the the Facebook Like Button by now, well this is a Facebook Send Button.When clicked a pop up appears for users to send the page of your blog they are on to their friends.But rather than posting on their wall as with the Like button the are sending by Direct Email.So you can enter the name of any facebook friend and send it to their Facebook Email or you can even enter the Regular Email of someone, for example their Gmail or Yahoo Mail address and the post will be sent to that Email.

How Cool Is That ! In a way it’s a regular ‘Email This’ button with integrated Facebook Email.On a quick note have you activated your Facebook Email ? Go to your Facebook messages page and you will see a link at the top of the page to activate it.

Facebook also had their thinking hats on by making the new send button available in a new side by side combo format with the Like button.So were you have the like button on your blog now you can add the send button right beside it taking up no extra space.

You can try out the Facebook Send Button at the bottom of this and all posts on Spice Up Your Blog.

Now we seen the button and what it does lets add it to your blog.First up there are two ways you can have the button, in a combo with the like button and on it’s own.I will give you the code for both and then we can see were to place it on your blog.

Video Tutorial – For extra help We have a video tutorial at the bottom of the post.

WordPress And Other Blog Platforms – See how you get your send button here :Facebook Developers Send Button

Facebook Like And Send Combo Buttons Code :

<div id=’fb-root’/>
<script src=’’/>
<fb:like expr:href=’data:post.url’ send=’true’ show_faces=’false’ width=’450′>
</fb:like><a href=””><img alt=”Best Blog Tips” src=””/></a>

Standalone Facebook Send Button

<div id=”fb-root”></div>
<script src=”″></script>
<fb:send expr:href=’data:post.url’></fb:send><a href=””><img alt=”Best Blog Tips” src=””/></a>


Add Your New Facebook Send Button To Blogger

The button can easily be added to your sidebars by pasting the code into a html/javascript gadget.Below i will show you a the two most popular positions on your blog for the buttons.

A. Directly Below The Post Titles At The Top Of All Posts.
B. At The Bottom Below All The Posts.

Add The Facebook Send Button To Your Blogger Posts

Step 1. For Both positions we go to your blogs html page, so in your Blogger Dashboard Click Design > Edit Html and Tick The Expand Widget Templates Box :

Design Edit Html Widget Templates

A – To place the button at the top of your posts Find the following piece of code in your blogs Html and paste the Facebook Button code Directly Below / Under It: (Click Ctrl and F for a search bar to help find the code – More Info

<div class=’post-header-line-1′>

If you cant find that look for this :

<div class=’post-header-line-1’/>

B. To place the button at the bottom of your posts Find the following piece of code in your blogs Html and paste the Facebook Button code Directly Below / Under It: (Click Ctrl and F for a search bar to help find the code – More Info

<div class=’post-footer’>

Or Alternatively Below This Code :


Once you have the code in position save your template and check out your cool new Facebook Send Button.


OK as i said this new Facebook Social button has just been released so you can be one of the first to get it.Make sure to check out more of our Facebook Posts and Social Media Posts.


  1. How did u add blogger comments, disqus comments, facebook comment? i too using disqus comments. Sometime comments are not display in disqus. i need to see in dashboard-> comments.

    Thanks in advance

    Hari (


  2. Siddharth BaishyaApril 27, 2011 at 4:25 AM

    This is cool link.. can i implement in my wordpress blog as well.


  3. I did exactly what you said and it didn’t show up. I even went and took my like button off, just in case that was the problem. My like button was the iframe code. Any suggestions?


  4. I also just tried your new facebook like button, but it didn’t show up either, the old like button showed up. It’s like part of the code is missing. Maybe when I copy and paste?


  5. @ Bonnie – That is the code i added here and in the test blog on the video.I had a look at your blog and you have a lot of “Stuff” going on in the sidebars and footer, maybe that is interfering with the code but i cant see how..

    @ Siddharth – I added a link to the post For WordPress and other Blog Platforms the code i have in the post is for Blogger Users only.


  6. Wow Paul, Your blog’s new look is nice, comments with tabs , admin badge,pop up for social bookmarking, everything is just nice. Hope you will write a tut on these too 🙂


  7. I love this dual button. My question is this. How do I get rid of a tiny square that appears below it? I got it when I first used your “like” button without the “send” and could not figure out why it was there. Now I get it with this dual button feature as well. I do not really know html; just using what you provide and enjoying that. Any ideas? Thanks


  8. Rosie@leavesnbloomApril 29, 2011 at 8:39 PM

    It worked perfectly Paul on my 2 blogs – thankyou


  9. @ Rosie – I would never be in doubt it works for you 🙂 I’m glad you like it.


  10. hello paul. can u do tutorial bout facebook comment like urs? comment using facebook, hotmail … thanks


  11. FINALLY one that works! the others would work but only show when you opened the comments (i’m using disqus in blogger) but this code actually shows the like and share button without having to open the comments up. THANK YOU!


  12. Sheila in SpringfieldMay 4, 2011 at 5:01 PM

    Paul, I have successfully added the facebook like button to my blogger blog. I can’t tell who has “liked” my posts though. I can sometimes see the name of one person, but usually it’s just a number of likes. I thought maybe this was because the users were not facebook users (no account) but most of my traffic comes thru my facebook posts that link back to my blog. Any thoughts?

    Thanks very much for all your helpful tutorials!


  13. Sheila – You cant actually Like something on Facebook unless you have a Facebook account, as you are putting that Like on your wall.The button will show the names of your friends who have Liked the post the rest of the names will not be visible.I guess once people are liking your content that’s great even if you cant see exactly who it is.


  14. Unfortunately I can’t make it work also. I did eveything correctly but buttons doesn’t show.


  15. the buttons doesnt work also


  16. I have had the like and send buttons you featured on my blog, – for about a month now. They were working fine until just recently. Now, when I click ‘like’ nothing seems to happen. It seems to work if other people have already liked the post but not if I am the first.

    Any hints? I really enjoy this enhancement and I think it has increased my traffic, but I do need it to work properly!


  17. Thank you for the tutorial. Everything worked perfectly.


  18. i like bar button this site (bar slide left) could you share code for me?



  19. Alexander-Julian GibbsonJanuary 5, 2012 at 1:13 AM

    The HTML codes that you have to find are not present in my Template


  20. nicely explained and interesting! I recently added a facebook fanpage pop out widget in my blogger

    but it not work well on IE and Opera while I open post page! can anyone tell me how to solve it??


  21. Thanks Paul…super easy ans super cool! I love it. You are a great teacher. I’ve learned so much from you. Thanks!