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

How to Add a Live Facebook Share Button to Your WordPress

Last updated on by
Follow WPBeginner on YouTube
How to Add a Live Facebook Share Button to Your WordPress

You have probably seen the famous retweet button by tweetmeme on various blogs. We have written a tutorial in the past about how to add a retweet button on your blog. Now fbshare.me introduces a live Facebook share button that keeps count of the link shared on Facebook, and it allows people to share links through this link just like tweetmeme button. In this tutorial, we will show you how to add a facebook share button to your WordPress.

There is a widget that you can download to make the process easy and automated.

For code junkies, and those who do not like to use plugins here is the code you would need to add in your theme file.

<script src="http://widgets.fbshare.me/files/fbshare.js"></script>

This code will most likely be placed in your single.php. Make sure that you use the appropriate styling to make it fit your needs. The code mentioned above is a general code, and it will show a large button with the count, but if you want to know the parameters that you can use, here they are:

  • size – The size of the button: ‘large’ OR ‘small’ (if not specified, defaults to ‘large’)
  • url – The URL of the page you want shared on Facebook (if not specified, defaults to that of the page on which the button is displayed)
  • title – The name of the page you want shared on Facebook (if not specified, defaults to that of the page on which the button is displayed)
  • google_analytics – If no awesm_api_key specified, sets whether fbshare.me links have Google Analytics parameters added: true OR false (if not specified, defaults to false)
  • awesm_api_key – For existing awe.sm customers only (if not specified, will use fbshare.me links)

So an advanced code will look like:

script>var fbShare = {
url: 'http://www.wpbeginner.com',
size: 'small',
google_analytics: 'true'
}</script>
<script src="http://widgets.fbshare.me/files/fbshare.js"></script>

Feel free to customize it to fit your needs. We are planning to add this on our next design update as well.


Editorial Staff at WPBeginner is a team of WordPress lovers led by Syed Balkhi. Page maintained by Syed Balkhi.

WPBeginner's Video Icon
Our HD-Quality tutorial videos for WordPress Beginners will teach you how to use WordPress to create and manage your own website in about an hour. Get started now »
  • http://twitter.com/codenamepapa CodeNamePapa

    the official FB “Share” widget works fine, but intermittently the counter section will “hide itself” for some reason. This is annoying when I have a Retweet button, Buzz, StumbleUpon, etc. and there’s the FB Share button about 1/4 the height of the rest.

    SO, I tried the fbshare.me plugin… my issue with this: when testing it out, it doesn’t match the current number of shares in the official FB “Share” widget that’s already on the page… like, a 2,200+ share was only 450 with the fbshare.me plugin. what gives?!

  • Digidoll

    I put both FB Share & TweetMeMe on my site manually(without the plugin) as suggested here for my single.php. How should the code go if I want it in my index.php? I tried it and the data doesnt show correctly that way. If I want to share a post from the index.php they all show the same info for each post and they all link back to my index page instead of the post. I’ve seen it work correctly on other sites but I dont know if they’re using the actual plugin or not. I didnt want to use the plugin bc it wasnt validating. Does anyone know what I should do? Any help would be most appreciated!

    • http://www.wpbeginner.com Editorial Staff

      You would have to add the code manually inside the >> loop << for it to work on your index.php file.

  • http://www.niche-blogging-profits.info Rick

    Thanks for this. Offering the facility to share on Facebook should be a good way of generating more traffic for a blog.

  • http://www.shoutmeloud.com Harsh Agrawal

    Few Days back facebook also released an official facebook share count button.. Though if I compare fbshare.me and facebook official button.. My vote will go for fbshare.me one…

  • http://www.faqpal.com FAQPAL

    Good idea to make the button similar to Tweetmeme, more bloggers will be more apt to use it.

    • http://www.wpbeginner.com Editorial Staff

      Yes, we are planning on adding it in our site as well in the coming site update.