2 Ways to Like Add Facebook Like to Your WordPress Site
Facebook wants us to like things rather than fan or share them. I’m not, like, really liking, this change, like, you know? It makes me think of people who use like every three words they say and about passing notes in junior high. “Chris – do you think Billy likes me? Can you ask him? But don’t tell him I wanted to know.”
So, we can now add like buttons to our website. What’s cool about it is that it will show the little avatars of the people who liked your article and will post on their wall and newstream that they liked the article (if their settings allow for that).
There are two ways to add the like button in WordPress.
Code
The code method is the first way. I would add the following to the bottom of my post in the single post page. It’s usually single.php under Appearance > Editor
<iframe src="http://www.facebook.com/plugins/like.php?href= <?php the_permalink(); ?>&layout=standard&show_faces=true &width=450&action=like&colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height:px"></iframe>
You can change some of the variables such as the width, change scrolling to yet, add a border, etc. Note that the url being shared is
<?php the_permalink(); ?>
That is so it pulls the specific WordPress post that is being liked. Make sure that the code added is still within the loop on the single.php page. I would put it below
<?php the_excerpt(); ?> or <?php the_content(); ?>
I have tried putting it at the top of the post but even when I set the height on the code, it pushes the beginning of the post down too far. It’s almost like (no pun intended) that it’s making room for the hoards of Facebook users who are going to be liking your post. If you’ve found workaround for this please let me know.
If you want to read more about this code or play with the fancy code generator it is available on the Facebook Developer’s Like Button Page.
Plugin
You can also install the WordPress plugin called Facebook Like Button. It basically does what the code above does but there was one thing I didn’t like about it. It adds the like code everywhere and not just to posts. I might want someone to like my Services page but it doesn’t make a lot of sense to have a like button on my contact page. It is, however, super easy to set up. Just be sure to select the iframe option in the plugin settings.
So there you have it – two ways to add the Facebook like button to your WordPress site. Hope you liked it.
photo credit: found_drama
Keep Reading:
Did you enjoy this article? I can assist you with your WordPress or Facebook project. Contact me and I will provide you with an estimate. You can also connect with me on Facebook or follow me on Twitter. If you are looking for Hosting, WordPress Theme, Newsletter or other recommendations, please view my detailed list.
April 28, 2010 at 2:44 am
I just know that I can like the post, but yeah, I think this is also useful because sometimes when there are thousand of people that likes a certain post you can’t see them right away. Thank you for sharing this!
April 29, 2010 at 9:55 am
HI Kay – Great – I hope it helps. I haven’t added this yet to my own site – not sure if I’m going to.
April 28, 2010 at 6:59 am
Nice one, Kim
thanks a lot for tip.
I’m going to use the plugin for now, just to see the results !
Have a kick-ass day !
.-= Mars Dorian´s last blog ..How to Bring Down the Sky ! =-.
April 29, 2010 at 9:56 am
Hi Mars – It seems that other plugins have been released too but this is the one most people are using. I just don’t like that you can’t set whether it’s on posts, pages, or both.
April 28, 2010 at 7:55 am
For those of your readers who, like me, employ the WP Thesis package, you need to create a custom function like I’ve done at the bottom of my posts. There’s an ongoing debate on the best way of writing the function at http://diythemes.com/forums/showthread.php?p=129651
.-= Ari Herzog´s last blog ..22 Questions You Asked Me — and My Answers =-.
April 29, 2010 at 9:57 am
Hi Ari – Well … Thesis ;-) Seems like with most things a custom function needs to be used. Does the plugin not work?
April 29, 2010 at 12:48 pm
I don’t know if the plugin works. I haven’t tried it.
April 28, 2010 at 11:22 am
Re: ” it pushes the beginning of the post down too far” I use the version with count and no faces, this way the widget is much more compact.
.-= gxg´s last blog ..For Facebook, it’s just business =-.
April 29, 2010 at 9:57 am
Hi Gxg – That’s a good idea – I think that most people will want to see the avatars but I could be wrong.
April 28, 2010 at 12:08 pm
Hey Kim, this instructions are great. I wish the plugin were more flexible though.
Thanks for the details!
@Ileane
.-= Ileane | The Podcast Blog´s last blog ..HootSuite’s Ow.ly Shortener Just Got Better =-.
April 29, 2010 at 9:58 am
Hi Ileane – The plugin has already been updated since I wrote the post so it’s possible that they’ve added new features.
April 28, 2010 at 1:39 pm
LOL! I will NOT be adding this button, because, like, I totally agree with what you said, for sure.
.-= Adrenalynn´s last blog ..This Post Has No Title, Just Words and a Tune =-.
April 29, 2010 at 9:58 am
Hi Adrenalynn – LOL – I don’t know if I will add it or not but I’ve already been asked to do it for a number of people. Looks like it’s going to be popular.
April 28, 2010 at 2:23 pm
I agree – I’m not sure how I feel about the move from “fan” to “like.” But, WHATEVER. ;)
.-= vered – blogger for hire´s last blog ..Vaginal Rejuvenation Awareness Day? Seriously? =-.
April 29, 2010 at 10:00 am
Hi Vered – I care because it’s a pointless change and now we need to rewrite articles or any other marketing materials. A lot of people were using Become a Fan buttons on their custom pages and now those all need to be changed to Like.
May 21, 2010 at 9:56 am
Hey Kim
For what it’s worth, I used the code version and specifying a height of 25 did the trick of getting rid of all that extra space. However, I’m sure when I get all those hoards of people ‘liking’ my posts I’ll have to change that to make room ;)
Thanks for the tips!
Lucy
.-= Lucy Beer´s last blog ..Should You Worry About Your Bounce Rate? =-.
May 21, 2010 at 10:27 am
Hi Lucy – Thanks for the tip :-) And lol …
I haven’t added it on this site … not sure if I’m going to.
May 21, 2010 at 10:38 am
Yea I just added it to mine as an experiment….we’ll see if it sticks ;) I’m thinking that it could be an easier way to get exposure on Facebook rather than trying to drive traffic to a ‘fan’ page (which I haven’t bothered to set up yet). I’ll let you know if anything interesting comes of it.
.-= Lucy Beer´s last blog ..Should You Worry About Your Bounce Rate? =-.
October 11, 2010 at 7:44 pm
Anybody who has a blog should have the like button added to their site as it offers the potential to get added visitors.
Bill Gassett´s last post ..Stopping a Foreclosure Via a Short Sale