Create a “Share on Facebook” link in your WordPress blog

With its over 200 millions registered users (read 200 Million Strong) Facebook can bring a lot of traffic to your blog, so in my opinion it’s very important to add a “Share on Facebook” button to your blog.

Facebook Sharer

If you noticed, Facebook as a sharer url allowing you to share a link.

I am going to use this feature to create the button.

sharer.php needs two variables to share your page: u for the link and t for the title, so we need to create a link like

http://www.facebook.com/sharer.php?u=the_link&t=the_title

WordPress functions

The function that returns URL for the permalink to the post currently being processed is the_permalink(). You can read more information about it at the official page.

The function to get the title is (guess what?) the_title. More information at the official page.

Some icons

Just in case you are looking for some interesting Facebook icons, I am giving you a couple of links:

http://csi.nfshost.com/goodies/
http://www.webfruits.it/dblog/articolo.asp?articolo=62 (this one is in italian, just go on download button at the end of the page).

If you know more links about free Facebook icons, just let me know and I’ll add them here.

The code

Time to write some code now… in your wp-content/themes/ folder of your WP installation, locate the folder of your theme and check for single.php file.

Warning: not all themes have a single.php file… if you can’t find it, then probably the right file to edit is index.php… anyway it could be the right file if you see the_content() function.

The code I suggest you to add, after the_content, is

<a href="http://www.facebook.com/sharer.php?u=<?php the_permalink();?>&t=<?php the_title(); ?>" target="blank">Share on Facebook</a>

And you’ll have your Facebook link like the one I added on my blog.

Rate this post: 1 Star2 Stars3 Stars4 Stars5 Stars (33 votes, average: 4.39 out of 5)
Loading ... Loading ...
WordPress themes are designs for WordPress - one of the most popular blogging software nowadays.
You will be pleasantly surprised by WordPress Themes provided by Template Monster. All of them are of professional design and high quality.
Be my fan on Facebook and follow me on Twitter! Exclusive content for my Facebook fans and Twitter followers

This post has 18 comments

  1. Viktor Hesselbom

    on April 17, 2009 at 9:30 pm

    Very nice. Thanks, I’ve added the same to my blog.

  2. Monkios

    on April 20, 2009 at 4:13 pm

    Don’t you have a link that does exactly that just below “The geek has spoken” ?

  3. Devon

    on April 21, 2009 at 6:04 am

    This is GREAT for getting hits for your website. Thanks for the guide!

  4. 10 WordPress 2.7 Hacks That I Have Added This Month | Blogging | So You Want To Teach?

    on April 21, 2009 at 6:09 am

    [...] Create a “Share on Facebook” link in your WordPress blog [...]

  5. Roger Mitchell

    on April 29, 2009 at 1:27 am

    This seems to be exactly what I want, but as a new user I am unable to find the wp-content/themes/ folder and therefore can’t find the single.php file.
    I go to appearance, themes and it shows my current theme at the top. Do I then go to edit CSS? Can you guide me on how to find the folder and file I need to change?

  6. Bachir

    on June 6, 2009 at 3:58 pm

    Looks like you like WpRecipes…

  7. zplits | what's the latest?

    on September 20, 2009 at 3:01 pm

    Hi Sir, thanks for this great tut. It was very helpful. Integrated it in my site http://www.whatsthelatest.net.

    GOD bless and more power.

  8. Says

    on November 10, 2009 at 10:04 pm

    Thanks for the code. I was able to place it in my wordpress theme but there’s one thing that I’m having a problem with.

    the link works fine but unlike on your site, The title of the story does not show up, neither does the sentence or two that follows the title. Instead all I get the site link and the site name.

    Here’s a screen shot of what I’m getting: http://www.phresh.cc/fb_screen.jpg

  9. Says

    on November 11, 2009 at 10:44 pm

    I figured it out. Thanks.

  10. Akosiniko

    on May 15, 2010 at 1:01 pm

    i was also able to put a “share on facebook” and “retweet button” for my worpress.com blog.
    html codes because java script don’t work.
    Check this guys :)
    Thanks
    http://akosiniko.wordpress.com/2010/05/15/shareonfacebookandretweetbuttons/

  11. Larry Levenson

    on November 3, 2010 at 5:44 pm

    Very helpful. Exactly what I was looking for. Thank you!

  12. Ted

    on February 8, 2011 at 2:09 am

    Unfortunatelly, this won’t validate:

    Whitespace in query component. Use %20 in place of spaces.

    How to use %20 for titles with spaces in between?

  13. Facebook Ad Power

    on March 6, 2011 at 8:31 am

    Having a facebook share button has become a necessary thing for blogs. Instead using of plugins we can use this code.
    Thank you for sharing this simple tips.

  14. Kyx

    on April 18, 2011 at 12:34 am

    Yeah..

  15. Willie » Create a “Facebook Share” button or link

    on July 22, 2011 at 6:20 am

    [...] References:: http://www.emanueleferonato.com/2009/04/17/create-a-share-on-facebook-lin-in-your-wordpress-blog/ [...]

  16. Justin

    on October 14, 2011 at 8:03 pm

    Shanks. Using this code in a custom site I’m building.

  17. Yasir

    on October 22, 2011 at 6:58 pm

    thanks for sharing nice dude

  18. kostas

    on October 26, 2011 at 9:11 pm

    I want to add this functionality to my static iframe tab in my facebook fan page.How i can do that?
    THANKS