WPBeginner

Beginner's Guide for WordPress

  • Blog
    • Beginners Guide
    • News
    • Opinion
    • Showcase
    • Themes
    • Tutorials
    • WordPress Plugins
  • Start Here
    • How to Start a Blog
    • Create a Website
    • Start an Online Store
    • Best Website Builder
    • Email Marketing
    • WordPress Hosting
    • Business Name Ideas
  • Deals
    • Bluehost Coupon
    • SiteGround Coupon
    • WP Engine Coupon
    • HostGator Coupon
    • Domain.com Coupon
    • Constant Contact
    • View All Deals »
  • Glossary
  • Videos
  • Products
X
☰
Beginner's Guide for WordPress / Start your WordPress Blog in minutes
Choosing the Best
WordPress Hosting
How to Easily
Install WordPress
Recommended
WordPress Plugins
View all Guides

WPBeginner» Blog» Tutorials» How to Add Facebook Send Button in WordPress

How to Add Facebook Send Button in WordPress

Last updated on June 22nd, 2012 by Editorial Staff
148 Shares
Share
Tweet
Share
Pin
Free WordPress Video Tutorials on YouTube by WPBeginner
How to Add Facebook Send Button in WordPress

Previously, we showed you how to add the Facebook Like Button in WordPress. The like button allowed your users to like/share your blog posts with their friends on Facebook. Recently, Facebook has announced a new addition to this like button known as the “Send button”. The send button allows your users to share your blog posts with their friends that are on Facebook as well those who are not on Facebook. They can also use the send button to send the message to Facebook Groups that they are part of. Think of this as an email-this button on steroids because it has the social touch to it. Each send counts as a like on Facebook. When someone likes a post, it is shared with all of their friends. But due to hundreds of friends that each person has, the news feed is crowded with so many other things causing your post to be ignored most of the time. The Send button is here to solve that problem because now users can actually suggest your post to a selected friends / groups which will allow you to get GUARANTEED exposure as most people check their Facebook messages. In this article, we will show you how to add the Facebook Send Button in your WordPress blog.

Note: Sometimes, Facebook doesn’t show the right thumbnail image, or the right title by default. To prevent that issue, you should add Facebook Open Graph Meta Data in your WordPress.

Now that you know that this is useful, lets add it in your WordPress posts. First open your single.php file in your theme’s folder, then paste the following code inside your loop (In some themes, you will need to locate loop.php file to do this):

<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:send href="<?php echo get_permalink(); ?>" font=""></fb:send>

But the problem with above code is that it is not the best method. Facebook Send Button can only work well when it is in combination with the like button because without it, it has no social effect. So let us show you how to combine the like button and Send button in one like we have it in this post above.

<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like href="<?php echo get_permalink(); ?>" show_faces="true" width="450" send="true"></fb:like>

As of now, the send button does not work with the iFrame version of the Like Button, so you would have to use it this way.

Once you paste the code, you are done. You should see something like what we have at the top of our post. (Click on the button to see its functionality )

There are other parameters and options for this plugin.

If you want to show the friend icons under the button, then you should use the parameter:

show_face=true

If you want to display the simple button with only the count and nothing else, then you want to use the parameter:

layout=box_count

If you want a darker color scheme for your button, then you need to use the parameter:

colorscheme=dark

If you want to change the text from Like to Recommend, then use the parameter:

action=recommend

We think that this send button will be very helpful. Because it is very new, we do not have the data to present it to our users on how much it is helping us, but if you subscribe to our newsletter, then you can be sure to receive updates about this and other cool marketing tricks that will help you grow your blog.

148 Shares
Share
Tweet
Share
Pin
Popular on WPBeginner Right Now!
  • How to Start Your Own Podcast (Step by Step)

    How to Start Your Own Podcast (Step by Step)

  • How to Properly Move Your Blog from WordPress.com to WordPress.org

  • Checklist

    Checklist: 15 Things You MUST DO Before Changing WordPress Themes

  • Google Analytics in WordPress

    How to Install Google Analytics in WordPress for Beginners

About the Editorial Staff

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi. Trusted by over 1.3 million readers worldwide.

The Ultimate WordPress Toolkit

36 Comments

Leave a Reply
  1. harsh says:
    Sep 2, 2013 at 11:12 am

    how can i add this button in my wordpress website..in single.php which section should i paste this code?

    Reply
    • Editorial Staff says:
      Sep 3, 2013 at 3:13 pm

      You would paste this within the loop.

      Reply
  2. tuffluvxpress says:
    Jan 2, 2012 at 2:22 pm

    why when I add the like and send button on my site when I test it and try to add something, Half of the box appear at the back of the page and I can see the small send box, please help

    Reply
    • wpbeginner says:
      Jan 3, 2012 at 8:57 am

      Not sure what you are talking about there. Any way you can maybe take a screenshot and paste it to an image upload service then paste a link here.

      Reply
  3. wpbeginner says:
    Jun 11, 2011 at 5:13 am

    @prakhar.code nope.

    Reply
  4. prakhar.code says:
    Jun 11, 2011 at 2:05 am

    Can this code be implemented on wordpress.com blogs?

    Reply
  5. Jimmy says:
    May 13, 2011 at 6:22 am

    hi,
    I just implement the like/send button on a site, I use the code generated in developers.facebook.com, but the “Send” button is not display, only the like/recommend button, do u have an idea?

    Reply
    • Editorial Staff says:
      May 17, 2011 at 11:41 am

      Don’t know why it is not showing. Use the code that we have in this article.

      Reply
  6. Earl B Russell says:
    May 12, 2011 at 4:18 pm

    So I’d prefer not to receive these commercially-oriented announcements. Thanks!

    Reply
  7. Earl B Russell says:
    May 12, 2011 at 3:18 pm

    Is it correct that plugins can’t be installed on the free version of WordPress? If so, that should be made clear at the beginning of any plugin announcements.

    Reply
    • Editorial Staff says:
      May 12, 2011 at 3:55 pm

      Yes you are correct, plugins are not allowed on free version of WordPress. However, it is not the plugin author’s responsibility to add that in announcement. It should be made clear on free version of WordPress site. We have an infographic that shows you the difference between Self Hosted WordPress vs. Free WordPress.com Sites.

      Reply
  8. ed says:
    May 12, 2011 at 2:45 pm

    I’m using the Smart Share plugin…how would I add the facebook send button to the plugin (like your site).

    Reply
    • Editorial Staff says:
      May 12, 2011 at 3:55 pm

      The new version already adds that.

      Reply
  9. Kavita says:
    May 9, 2011 at 5:05 am

    I have just now added the code to my post pages and am eager to see the results.

    Reply
  10. hawdy says:
    May 6, 2011 at 5:06 am

    i tried your code in single.php and it work well. But, i want to add it at sharebar plugin. and it appear nothing.. How to add send button in sharebar like in this site? thanks in advance

    Reply
    • Editorial Staff says:
      May 6, 2011 at 7:24 am

      Use our SmartSharing plugin :)

      Reply
      • Husein Yuseinov says:
        May 7, 2011 at 11:40 pm

        I’m already using your smartsharing plugin, is the send button implemented there or I shod do it manually?

        Reply
        • Editorial Staff says:
          May 9, 2011 at 8:51 am

          Its implemented there.

  11. Earl B Russell says:
    May 5, 2011 at 12:57 pm

    Is it correct that this new Send Button feature does not work on the free, simpler version of WordPress that I’m using?

    If so, that point needs to made upfront and repeated often in the article above.

    Reply
    • Editorial Staff says:
      May 5, 2011 at 1:42 pm

      Yes, it will not work on WordPress.com site.

      Reply
  12. Kevin Yang says:
    May 3, 2011 at 10:42 pm

    Hey, I like this site. very good for a new blogger like me. I just want to know, do you offer customized wordpress editting?

    Reply
    • Editorial Staff says:
      May 4, 2011 at 9:01 pm

      Yes we do. Look in the services tab in the navigation :)

      Reply
  13. FAQPAL says:
    May 2, 2011 at 5:49 pm

    Another Facebook button? Like Harsh, I will have to think about this one, seems to be too many buttons and widgets from Facebook as is.

    Reply
  14. jessi says:
    May 2, 2011 at 1:53 pm

    its totally new,i would like to try it..presently im using facebook like and facebook share….thanx for sharing your knowledge.

    Reply
  15. Lincoln Adams says:
    May 2, 2011 at 1:26 pm

    They’re deprecating the FBML language so eventually the send button code will have to be updated to use the iFrames version instead, which is still nonfunctional. Leave it to Facebook to release a new feature that only works using outdated code.

    In addition, using the Send button can produce some strange redirecting quirks in IE7/8 that I was only able to resolve by switching over to iFrames. And this is using the code straight from the FB developers page too (with the exception of adding the necessary WordPress tags of course.)

    Anyone using the Send Button might want to check how it appears in IE7/8 just to ensure it’s not borking anything there.

    Reply
    • Editorial Staff says:
      May 2, 2011 at 1:31 pm

      They deprecated Static FBML, so that no new applications can use it. The switch was from FBML to XFBML. Haven’t seen the news of XFBML being deprecated yet, so can you please point us to your source. The code above is using XFBML.

      Reply
      • Lincoln Adams says:
        May 2, 2011 at 1:38 pm

        Ah, thanks for clearing that up, no I haven’t seen anything about XFBML either, I only now learned there was a difference.

        I double checked and the code I used that was creating problems in IE7/IE8 was XFBML, so this is a potential issue that can still arise for some users. I think it depends on the makeup of your site (what JS scripts you’re using etc.) so YMMV.

        Reply
  16. jean says:
    May 2, 2011 at 8:10 am

    Thks alot! very useful

    Reply
  17. Sharon says:
    May 1, 2011 at 9:07 pm

    great tip! I hadn’t heard about the send button. Thanks as always

    Reply
  18. hafid says:
    May 1, 2011 at 4:26 pm

    hi , i’ve done it and it 100% working … thanks a lot

    Reply
  19. ed says:
    May 1, 2011 at 1:45 pm

    Can’t adjust the height with the code?

    Reply
  20. Joan says:
    May 1, 2011 at 12:01 pm

    Thanks, i implemented it on my site changing en_US for es_ES, one thing i don’t like is in the send option they don’t have the possibility to choose what thumbnail send :(

    Reply
    • Editorial Staff says:
      May 3, 2011 at 6:28 pm

      The thumbnail can be chosen by using the og: tags in your header. You can’t offer multiple images (you are right about that).

      Reply
  21. Anand Kumar says:
    May 1, 2011 at 10:42 am

    Now their should be all in one button (official) for Facebook!! Why sjould We add 3 different button for a single site. :(

    Reply
    • Editorial Staff says:
      May 3, 2011 at 6:29 pm

      This is the reason why they built-it into Like Button.

      Reply
  22. Harsh Agrawal says:
    May 1, 2011 at 10:01 am

    I’m still considering if I should add this new button or not.. I already have Fb like and share count button.. One more FB button..I have to rethink….

    Reply

Leave a Reply Cancel reply

Thanks for choosing to leave a comment. Please keep in mind that all comments are moderated according to our comment policy, and your email address will NOT be published. Please Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.

Over 1,320,000+ Readers

Get fresh content from WPBeginner

Featured WordPress Plugin
TrustPulse
TrustPulse
Instantly get 15% more conversions with social proof. Learn More »
How to Start a Blog How to Start a Blog
I need help with ...
Starting a
Blog
WordPress
Performance
WordPress
Security
WordPress
SEO
WordPress
Errors
Building an
Online Store
Useful WordPress Guides
    • 7 Best WordPress Backup Plugins Compared (Pros and Cons)
    • How to Fix the Error Establishing a Database Connection in WordPress
    • Why You Need a CDN for your WordPress Blog? [Infographic]
    • 30 Legit Ways to Make Money Online Blogging with WordPress
    • Self Hosted WordPress.org vs. Free WordPress.com [Infograph]
    • Free Recording: WordPress Workshop for Beginners
    • 24 Must Have WordPress Plugins for Business Websites
    • How to Properly Move Your Blog from WordPress.com to WordPress.org
    • 5 Best Contact Form Plugins for WordPress Compared
    • Which is the Best WordPress Popup Plugin? (Comparison)
    • Best WooCommerce Hosting in 2020 (Comparison)
    • How to Fix the Internal Server Error in WordPress
    • How to Install WordPress - Complete WordPress Installation Tutorial
    • Why You Should Start Building an Email List Right Away
    • How to Properly Move WordPress to a New Domain Without Losing SEO
    • How to Choose the Best WordPress Hosting for Your Website
    • How to Choose the Best Blogging Platform (Comparison)
    • WordPress Tutorials - 200+ Step by Step WordPress Tutorials
    • 5 Best WordPress Ecommerce Plugins Compared
    • 5 Best WordPress Membership Plugins (Compared)
    • 7 Best Email Marketing Services for Small Business (2020)
    • How to Choose the Best Domain Registrar (Compared)
    • The Truth About Shared WordPress Web Hosting
    • When Do You Really Need Managed WordPress Hosting?
    • 5 Best Drag and Drop WordPress Page Builders Compared
    • How to Switch from Blogger to WordPress without Losing Google Rankings
    • How to Properly Switch From Wix to WordPress (Step by Step)
    • How to Properly Move from Weebly to WordPress (Step by Step)
    • Do You Really Need a VPS? Best WordPress VPS Hosting Compared
    • How to Properly Move from Squarespace to WordPress
    • How to Register a Domain Name (+ tip to get it for FREE)
    • HostGator Review - An Honest Look at Speed & Uptime (2020)
    • SiteGround Reviews from 4196 Users & Our Experts (2020)
    • Bluehost Review from Real Users + Performance Stats (2020)
    • How Much Does It Really Cost to Build a WordPress Website?
    • How to Create an Email Newsletter the RIGHT WAY (Step by Step)
    • Free Business Name Generator (A.I Powered)
    • How to Create a Free Business Email Address in 5 Minutes (Step by Step)
    • How to Install Google Analytics in WordPress for Beginners
    • How to Move WordPress to a New Host or Server With No Downtime
    • Why is WordPress Free? What are the Costs? What is the Catch?
    • How to Make a Website in 2020 – Step by Step Guide
Deals & Coupons (view all)
Beaver Builder Coupon Code
Beaver Builder Coupon
Get the best possible price on this easy drag-and-drop page builder plugin. From just $99 in 2020.
Unbounce
Unbounce Coupon
Get 20% OFF on Unbounce landing page and conversion platform.
Featured In
About WPBeginner®

WPBeginner is a free WordPress resource site for Beginners. WPBeginner was founded in July 2009 by Syed Balkhi. The main goal of this site is to provide quality tips, tricks, hacks, and other WordPress resources that allows WordPress beginners to improve their site(s).
Join our team: We are Hiring!

Site Links
  • About Us
  • Contact Us
  • FTC Disclosure
  • Privacy Policy
  • Terms of Service
  • Free Blog Setup
  • Free Business Tools
Our Sites
  • OptinMonster
  • MonsterInsights
  • WPForms
  • SeedProd
  • Nameboy
  • RafflePress
  • Smash Balloon

Copyright © 2009 - 2021 WPBeginner LLC. All Rights Reserved. WPBeginner® is a registered trademark.

Managed by Awesome Motive | WordPress hosting by SiteGround | WordPress CDN by MaxCDN | WordPress Security by Sucuri.