How to Add a Facebook Like Button or Like Box

by Posted on

The Easiest Way to Add a Facebook Button to Your WordPress Site

In this post, I’ll explain the differences in the Facebook Like Button and the Facebook Like Box. I will also explain the step-by-step process of adding this functionality to your website using WordPress as an example.

Button vs Box

 
The Facebook Like Button is used for visitors of your website to ‘like’ a particular post, page, site or any other criteria a website has to offer. This is done by assigning a URL to ‘like’. Do not confuse this with a ‘Share’ button which allows Facebook users to share a post, video etc. with their Facebook friends.


I am currently using the Socialize plugin on the Ask Adam League that is running on WordPress.

The Facebook Like Button has some great advantages. It allows users of the Facebook community to ‘like’ something which in turn shares that something and broadcasts it out to all of their Facebook friends via their News Feed. Also, this something that they like will remain on their profile for other people to see and visit.

The Facebook Like Box on the other hand allows visitors to ‘Like’ a Facebook Fan Page. It also has other functions such as showing the faces of people on Facebook who like the Fan Page and it can also display the latest post on the Fan Page.

Important:

An interesting note here is that you can use the Facebook Like Button as a Facebook Like Box but only a Facebook Like Box can be used as a Facebook Like Box. This is how it works. In the Facebook Like Box Generator you are prompted to add a Facebook Page URL in the respective field pigeonholing the developer into using the Facebook API strictly for users to ‘like’ a Facebook Page. However, in the Facebook Like Button Generator the user is allowed to add any URL they want. This makes it possible for users to ‘like’ the corresponding page that the developer is suggesting. How a Facebook Like Button can be used as a Facebook Like Box is simple; add a Facebook URL to the URL field and how you are on your way to making a Facebook Like Button that when clicked will allow a Facebook user to ‘like’ your Facebook page. For example, the Ask Adam League currently has a Facebook Like Button on the site. When clicking on this Like Button, the visitor will be Liking the Facebook Fan page for the Ask Adam League. They will also be able to see other friends of theirs that like the Ask Adam League Facebook Fan Page.

How to Add a Facebook Like Button to a WordPress Site

Adding either the Facebook Like Box or Button is very similar so instead of writing War and Peace here I’ll show you the steps for the Like Button.
Notes: These steps include using the code from the Facebook Developers website and not a WordPress plugin as I’ve found many of the plugins to be confusing or very spotty with their functions.
These steps will show you how to add a Facebook Like Box to your WordPress sidebar using a text widget; the simplest way I have found to add the Like Button.

Generate the Code:

  1. Go to the Facebook Like Button generator. This is where you will set the parameters for your Facebook Like Button and generate the code for your WordPress widget.
  2. The first step for generating the code is to get the URL for your page. I will choose to use the Ask Adam League Facebook page in this example since I want my site visitors to ‘like’ my Facebook page. Just visit the page and grab the full URL there and paste it into the ‘URL to Like’ field. (I’ve noticed that Firefox 3 on my Mac did not generate the Like Button example. It wasn’t until I updated to Firefox 4 that this happened).
  3. Select the different parameters for your Like Button such as pixel width and color scheme. You can also toggle on or off Faces which just displays the faces of the users who like your page.Click ‘Get Code’ and you’ll be presented with two different types of code; iFrame and XFBML. XFBML works for me (I’ll let the coder community explain the differences).
  4. Copy the XFBML code.

Insert the Code:

  1. Login to your WordPress CMS and go to ‘Widgets’ under the ‘Appearance’ pulldown on the right.
  2. Here you’ll have all of your widgets available that can be installed in your sidebar. If you don’t know what these do just think of them as little applications that do things on your sidebar.
  3. Grab the ‘Text’ widget and drag-and-drop it to anywhere you want the Facebook Like Button to be with all of your other widgets on the sidebar respectively. (if there is currently a text widget on your sidebar that you would like to install the Facebook Like Box code to with some other code there will be no problem at all).
  4. Crack open the Text widget by clicking on the pulldown. Your text widget will open up exposing the field where you will enter the code.
  5. Paste the code that you copied from the code generator.
  6. Click ‘save’.
  7. Bring up the page(s) that has your new Facebook Like Button to check it out.

Yeah yeah. I know we only have 12 people who like us on Facebook. Give us a sec.
Now anyone that visits your site will be able to like your Facebook Fan page. You can follow these same steps with the Facebook Like Box generator to make a Like Box if you wish.

Send me a comment if you guys have any questions. Good luck!

Note: My first time adding the Like Button it took almost 2 hours for it to show up on my page. Whether it took the Facebook API a million years to work or whatever else was going on I do not know.

Published by Donald Sinatra

11,483 Replies to “How to Add a Facebook Like Button or Like Box”

  1. Somebody necessarily assist to make significantly posts I would state.
    This is the first time I frequented your website page and to this
    point? I amazed with the analysis you made to make this actual put
    up amazing. Great job!

  3. Black Friday may still be the most popular shopping day of the
    year, but Thanksgiving Day is growing as competition. How to find a decent fire extinguisher service Are you ready for installing such
    fire suppression system. It will not take you long to
    become excited that you made a intelligent choice when you chose to have purchased her pots and pans set.

  4. ᕼello, Ι enjoy reading all of уour article post. I like
    to write a little comment to support you.

    Here is my page: ip phone number, Jeanne,

  9. You can locate laptop bags with an additional padded sleeve to safely retailer your laptop when you happen to be on the bus, walking to the coffee
    shop, or biking to operate.

    Look into my web-site: dakine backpacks ski; Lenora,

  10. ブログでアクセスを増やすにはテンプレートを変える事をオススメします。
    何故ならテンプレートを変更する事でインデックス促進になったりキーワードをキチンとクローラーに伝えることが出来る様になるからです。

  11. You can certainly see your enthusiasm within the work you write.
    The arena hopes for even more passionate writers such
    as you who are not afraid to say how they believe. Always go after your heart.

  12. As we all know, there is unfortunately nothing juicier to the
    media than a perceived female feud, actual existence of it notwithstanding.

  14. Nice post. I was checking continuously this blog and I’m impressed!

    Extremely useful info particularly the last part 🙂 I care for such info a lot.
    I was seeking this particular info for a very long time. Thank you and best of luck.

  20. さしあたり仮想空間やソーシャルネットワーキングで巷で話題、一吹きするだけでカンタンに脱毛できるという脱毛スプレー「ナークスK」について調べてみました！サイバー空間の口コミでも「すごくカンタン！」と高評価の除毛スプレー「ナークスK」の口コミや利きを見てみて。

  21. Due to the quality construction, most customers are happy they chose Flexsteel years down the road because their furniture still looks great and is providing
    excellent comfort. Luxury seat cushions consist of high
    resilient foam for optimal comfort. And if you’ve run across the Flexsteel brand, either in a store or
    online, you’ve probably seen the Dylan and Latitudes names on the
    Flexsteel pieces you’ve seen.

  24. Hello would you mind letting me know which web host you’re utilizing?
    I’ve loaded your blog in 3 different browsers and I must say this blog loads a lot faster
    then most. Can you recommend a good hosting provider at a fair
    price? Cheers, I appreciate it!

  25. F*ckin’ amazing issues here. I’m very happy to peer your article. Thanks a lot and i am taking a look ahead to contact you. Will you please drop me a e-mail?
    [url=http://fastchoise.tumblr.com/]kaikePa[/url]

  26. With havin so much written content do you ever run into
    any issues of plagorism or copyright infringement?
    My blog has a lot of exclusive content I’ve either created myself or
    outsourced but it appears a lot of it is popping it up all over the
    web without my agreement. Do you know any ways to help prevent content from
    being stolen? I’d genuinely appreciate it.

  28. Hello, Neat post. There is an issue with your website in web explorer, might
    test this? IE still is the marketplace leader and a good component of people will leave out your
    excellent writing due to this problem.

  30. We are a group of volunteers and starting a new scheme
    in oour community. Your site provided us ith useful info to work
    on. You have performed an impressive activity and our wuole community shall be thankful to you.

  32. Thank you for every other wonderful article. Where else may anyone get that type of info in such an ideal way of writing?

    I have a presentation next week, and I am on the look for such information.

  33. Great beat ! I would like to apprentice while you amend your site,
    how can i subscribe for a blog web site? The account helped me a acceptable deal.

    I had been a little bit acquainted of this your broadcast provided bright
    clear idea

    Have a look at my blog post … เครื่องดูดฝุ่นอุตสาหกรรมราคา

  36. Wonderful beat ! I would like to apprentice even as you amend your site,
    how can i subscribe for a blog web site?

    The account helped me a acceptable deal. I had been a little bit acquainted of this your
    broadcast offered bright transparent concept

    Here is my web page … referencement google

  38. Hello there I am so grateful I found your blog, I really found you by accident, while I was
    researching on Yahoo for something else, Anyways
    I am here now and would just like to say thank you for a marvelous post and a all round interesting blog (I also love the theme/design), I don’t have time to
    read it all at the moment but I have saved it and
    also added your RSS feeds, so when I have time I will be back to read
    much more, Please do keep up the excellent work.

    My web-site … seo search engine optimization services

  40. Hello there! This is my first comment here so I just wanted to give
    a quick shout out and tell you I really enjoy reading your articles.
    Can you suggest any other blogs/websites/forums that
    go over the same subjects? Thanks a ton!

    My website – superbowl champ

  42. The other day, while I was at work, my sister stole my iphone and tested to see if it can survive a 40
    foot drop, just so she can be a youtube sensation. My apple ipad is now destroyed and she
    has 83 views. I know this is totally off topic but I had to share
    it with someone!

    my web site … Phuket dj

  43. I am curious to find out what blog platform you happen to be utilizing?
    I’m experiencing some minor security problems with my latest site and I would like to find something more safeguarded.
    Do you have any solutions?

  46. I’m not sure where you’re getting your info, but good topic.

    I needs to spend some time learning more or
    understanding more. Thanks for wonderful information I was looking
    for this info for my mission.

  48. hello there and thank you for your info – I have definitely picked up
    anything new from right here. I did however expertise a few technical points using this web site, since I experienced to reload the site lots of times previous to I could get it to load properly.
    I had been wondering if your web host is OK? Not that I’m complaining, but sluggish loading instances
    times will often affect your placement in google and could damage
    your high quality score if advertising and marketing with Adwords.
    Well I’m adding this RSS to my email and could look
    out for much more of your respective interesting content.
    Make sure you update this again soon.

    Feel free to visit my web page … Chair Massage

  50. Greetings! Very helpful advice in this particular post!
    It’s the little changes that will make the most important changes.
    Thanks a lot for sharing!

    Here is my web-site – dj Phuket

Leave a Reply