If you just want to set up a simple Facebook login button for your site, it is extremely straight forward and takes about five minutes. But simply having a Facebook login button isn't very helpful because the login transaction goes through Facebook's system and you never get to find out who just logged in and you cannot add them to your user database.
What developers typically need to do is to get the Facebook login button to work together with the site's existing user and session management while maintaining the site's security level. So, in order to have the Facebook login button work seamlessly with a site's own registration system, further steps than just the basic setup are needed. These steps include working with the Facebook SDK to pull user data that your application requires, and integrating the user data with your own user management system.
Step 1: Placing the Facebook Login Button
Placing the Facebook login button on your site is relatively simple. This article will walk you through the setup process, but for reference you should also read through the official page for the Facebook login button setup documentation.
To place the actual button, you need to add a few snippets of code into your HTML. First, just paste the following code into your HTML, preferably in the header so that it is above the code used to place the actual button:
appId : 'insert_your_app_id_here',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true
Of course, there are a few adjustments you have to make. If your website uses a language other than English, you need to change the
en_US extension to the extension that corresponds to your website's language. You also need to change the
appId field to the application ID Facebook provided you when you made an application in your developer account.
Below that, somewhere in the body of your pages, you can place the code that renders the actual Facebook button. Here is how that code looks like:
<fb:login-button show-faces="false" perms="user_about_me,email,user_location" autologoutlink="true" width="200" max-rows="1">
That will get the login button to appear. Now you need to make it work with your site.