(+84) 463.28.7979

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.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>