How to Add a Facebook Like Button to Your Website
[Edit 03 Sep 2010 - Please also checkout my post How to Add a Facebook Like Box to Your Website]
Recently Facebook changed the language for Pages from “Fan” to “Like”.
In their words,
To improve your experience and promote consistency across the site, we’ve changed the language for Pages from “Fan” to “Like.” We believe this change offers you a more light-weight and standard way to connect with people, things and topics in which you are interested.
Fortunately, for those of us who had already added the Facebook Fan button to our sites,
.. the <Become a Fan> button automatically turned into a <Like> button,
Social Plugins
Shortly after Facebook released a new range of social plugins which compliment this new change in language.
These social plugins let you see what your friends have liked, commented on or shared on sites across the web. All social plugins are extensions of Facebook and are specifically designed so none of your data is shared with the sites on which they appear.
Facebook have now made it even easier to integrate these social plugins to your website or blog.. all you need to do is paste in a single line of HTML code and your site will be Facebook ready.
Like Button
The Like button lets users share pages from your site back to their Facebook profile with one click.
If you are using WordPress it is extremely easy to add a Like button to your pages. All it takes is to add a single line of code to your single.php file.
To do this click on Editor,
Click on single.php,
Now copy and paste the following code into this file (adjusting the height and width as necessary),
[Edit 10/08/2010 - please amend the code from above to show “show_faces=” and NOT “show-faces=”]
I have pasted this code towards the top and bottom of single.php – that way it will appear at the top and bottom of each post that I create.
Check it out for yourself –> scroll to the top and bottom of this post.
That’s it.
It doesn’t get much easier than that!
Finally..
If you liked this post please register to receive The Social Media Guide’s free newsletter that’s packed with tips, guides and more!
Most of these posts are available to download for free as PDFs for registered members.
Please follow me on Twitter,
Make sure you let your Facebook friends know you liked this too.. by clicking on the Like button below,
Related posts:
- Add a Facebook Fan Button to your Website
- How to Speed Up your Website with GZip Compression
- NetworkedBlogs – Bring your Blog to Facebook
- How to Add a Retweet Button Inside Your PDF Documents
- How to Brand your Tweets with Your Website’s URL
- GButts: The All-in-One Google Button
- Import your Blog’s Feeds to Facebook
10 Comments
This is perfect for todays world since facebook is a huge part of it. Thanks for sharing!
Also check out AddThis (www.addthis.com) which gives people the ability to share a page/article with others. One of the major benefits of using it is you can see how many people have shared your pages/articles, their location and which social network they shared it on.
Nice one…this button feature is a gem! Will have to include that on most of my websites from now on. Thanks for sharing!
Thanks for the comment.. good to hear from another Gold Coaster!
Here's the WordPress plugin:
http://wordpress.org/extend/plugins/like
No coding necessary, you can customize the look and placement of the button in the settings interface.
Worked like a charm! Thanks as always for your easy step-by-step instructions.
You mentioned if we're using WP…What if we're not? I can't get this to work in blogger and neither can anyone else I know who uses blogger. Frustrating.
Thi spost may help if you are using Blogger http://www.devfuel.com/2010/04/blogger-add-facebo…
Thanks very much for your post. This was exactly the How-To I was looking for
(to link the button to the specified article and not only to the website).
By the way, in your code it should be "show_faces=" and not "show-faces=".
Michael
Thanks Michael for picking up the typo!