How to Add the Facebook Like Button to WordPress Blogs

Blogging, Tutorials Add comments




Today, Facebook officially released its social plugins as part of its world domination plans. Now you can like every page on the internet and share it on Facebook. For website owners, it can be a great source of traffic.

This tutorial will show you how to add the Facebook Like Button to your WordPress Blog.

Go to http://developers.facebook.com/plugins

Select the Like Button Plugin – http://developers.facebook.com/docs/reference/plugins/like

Customize the button as you want -

Select the layout, width, font etc and click on Get Code. Keep the dummy URL as it is – http://developers.facebook.com/

For static pages, you can directly enter the URL and get the code.

If you have a WordPress blog, you can get dynamically generate Like buttons for every page without having to generate new code every time.

The sample code for my blog is
-
<iframe src=”http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.pathikshah.com%2F&amp;layout=button_count&amp; show_faces=false&amp; width=450&amp; action=like&amp; font=trebuchet+ms&amp; colorscheme=light” scrolling=”no” frameborder=”0″ allowTransparency=”true” style=”border:none; overflow:hidden; width:450px; height:px”></iframe>
-
Replace the blog URL with

<?php_the_permalink();?>

Just copy this code if you want -
-
<iframe src=”http://www.facebook.com/plugins/like.php?href=<?php_the_permalink();?>&amp; layout=button_count&amp;show_faces=false&amp; width=450&amp; action=like&amp; font=trebuchet+ms&amp; colorscheme=light” scrolling=”no” frameborder=”0″ allowTransparency=”true” style=”border:none; overflow:hidden; width:450px; height:px”></iframe>
-
This will automatically create Facebook Like buttons for every page of your blog. Just place this code in your sidebar or on single.php of your WordPress theme.

This is the code I added on single.php just below the page title.
-
<iframe src=”http://www.facebook.com/plugins/like.php?href=<?php the_permalink();?>;&amp ;layout=button_count&amp; show_faces=false&amp; width=80&amp;action=like&amp; font=trebuchet+ms &amp; colorscheme=light” scrolling=”no” frameborder=”0″ allowTransparency=”true” style=”border:none; overflow:hidden; width:80px; height:20px”></iframe>
-
Just tinker with the code and add it to your blog. If you have any doubts, leave a comment.

Related Posts

12 Responses to “How to Add the Facebook Like Button to WordPress Blogs”

  1. Butti Says:

    Sirji, where is the like button here, i want to like your posts

  2. Marge Says:

    How do I use this like button for any page on my site – not wordpress? What is the code to reference to current url so that I can place this code in my template and all my webpages will have the like button.

  3. Pathik Says:

    If you have static HTML pages, you can’t automatically generate permalinks for all your pages.

    If not, find a way to generate permalinks using PHP and replace the static URL with that.

    Try this

    http://www.webcheatsheet.com/php/get_current_page_url.php

  4. Facebook ‘Like’ Button Says:

    [...] http://www.pathikshah.com/blog/how-to-add-the-facebook-like-button-to-wordpress-blog/ http://www.webcheatsheet.com/php/get_current_page_url.php [...]

  5. Eun Zhuang Says:

    We take the opportunity of this blog post to inform everyone about our effort to create a steady and fair environment for Facebook users. As you may already know Facebook Accounts are SUSPENDED with geometrical progress. We started a petition against this policy and we ask to unite your voice with ours to create the proper attention and rectify this issue with Facebook admins. Current editors at various magazines want to see that there is a certain interest before they create articles to their websites and/or magazines. To all visitors and to blog owner we ask to support our petition here : http://FacebookDisabled.me (redirects to petitionspot) – Twitter : http://twitter.com/facebookpetitio . Thanks everyone for this time !!

  6. PlF Says:

    Here’s the Facebook Like button plugin available from WordPress:
    http://wordpress.org/extend/plugins/like
    No coding necessary, you can customize the look and placement of the button in the settings interface

  7. How to Add Twitter Button to Wordpress and Blogspot Blogs | Pathik Shah Says:

    [...] add a Facebook Like button to your WordPress and Blogger blogs. Check out this tutorial – Add the Facebook Like Button to WordPress [...]

  8. Joan Smith Says:

    Rather interesting place you’ve got here. Thanx for it. I like such topics and anything connected to this matter. I would like to read more on that blog soon.

    Joan Smith
    east london escorts

  9. ibm laptops Says:

    It’s really glad to read about the following topic which has enhanced my knowledge regarding topic and plus has given alot of

    ideas which I can think on.So I would say thank you to the blog owner for providing this amazing information.

  10. ibm laptops Says:

    i have been pleased after reading this blog the knowledge which has been provided via this blog is simply tremendous.
    i really appreciate the blogger for doing this work.

  11. Ron Yan Says:

    That is cool, thanks a lot for sharing. I would also love to see it to my site.

  12. Penny David Says:

    Its awesome post. Thanks for sharing it with me!

Leave a Reply

All rights reserved by Pathik Shah.
Entries RSS Comments RSS Log in