How to Add Facebook Like Button on Website

Posted in Tutorials

In this tutorial, we will show you how to add a Facebook “Like” button on your site. For example, the like button looks like this …

 

1. First go to Facebook Developer site. And click “Like Button” under “Social Plugins”.

2.  Enter the URL of your site.

3.  By default, you get the standard Like button.  But you can choose the “button_count” style …

or the “box_count” style …

4.  You can leave other settings as-is or change them.  You can change your color scheme to “dark” for example…

5.  Click the “Get Code” button.

6.  Copy the code that is under the iframe box …

and dismiss the dialog by clicking OK.

7. Paste Facebook code into the HTML of the site.  Depending on your HTML code, you may need to add a containing div in order to position it with CSS.

8.  Now whenever someone clicks the Like button, they will be prompted to log into their Facebook account (if they are not already logged in).

9.  After they log in, then Facebook increments the Like button count by one.

10.  If they hit the Like button by mistake, they can “Unlike” by clicking the button again.

Note that the X appears when they hover over the button after they had clicked it the first time.  So they can not like a site more than once.

 

 

 

---