Using facebook registration plug-in users can easily sign up on your website using facebook data. With one simple facebook login the form will be filled with user appropriate data. This plug-in is a simple iframe you can place it anywhere on your webpage. You can also add a custom field if facebook doesn’t have.
Download Script 
Live DemoAuthor
1. Creating Facebook App
a) First step is to Create a Facebook App.
b) Give a name for the Application and agree the Terms and Conditions.
c) On the Web Site tab give the values for siteURL and site domain
d) Store the App ID and App Secret.
2. Designing the Database
Create a table depending upon the fields we required in the registration process.
CREATE TABLE users
(
uid int(11) PRIMARY KEY AUTO_INCREMENT,
fullname varchar(50),
email varchar(50) UNIQUE,
password varchar(50),
gender varchar(6),
dob varchar(16)
);
(
uid int(11) PRIMARY KEY AUTO_INCREMENT,
fullname varchar(50),
email varchar(50) UNIQUE,
password varchar(50),
gender varchar(6),
dob varchar(16)
);
3. Designing the Registration Form
a) We are using iframe provided to by facebook to display registration form.
b) You all have to do is just replace client_id and redirect_uri with your Facebook App Id and the redirection url.
c) In this tutorial we are designing a form with name, email, password, gender, date of birth and captcha.
registration.php
<iframe allowtransparency="true" frameborder="no" height="600" scrolling="auto" src="http://www.facebook.com/plugins/registration.php?
client_id=183620578322567&
redirect_uri=http://example.com/store_user_data.php?&
fields=[
{"name":"name"},
{"name":"email"},
{"name":"password"},
{"name":"gender"},
{"name":"birthday"},
{"name":"captcha"}
]"
scrolling="auto"
frameborder="no"
style="border: none;"
width="500"
height="600">
</iframe>
client_id=183620578322567&
redirect_uri=http://example.com/store_user_data.php?&
fields=[
{"name":"name"},
{"name":"email"},
{"name":"password"},
{"name":"gender"},
{"name":"birthday"},
{"name":"captcha"}
]"
scrolling="auto"
frameborder="no"
style="border: none;"
width="500"
height="600">
</iframe>
The above iframe will render output like this
4. Reading and Storing the Callback Data
store_user_data.php
<?php
define('FACEBOOK_APP_ID', 'your_app_id'); // Place your App Id here
define('FACEBOOK_SECRET', 'your_app_secret'); // Place your App Secret Here
// No need to change the function body
function parse_signed_request($signed_request, $secret)
{
list($encoded_sig, $payload) = explode('.', $signed_request, 2);
// decode the data
$sig = base64_url_decode($encoded_sig);
$data = json_decode(base64_url_decode($payload), true);
if (strtoupper($data['algorithm']) !== 'HMAC-SHA256')
{
error_log('Unknown algorithm. Expected HMAC-SHA256');
return null;
}
// check sig
$expected_sig = hash_hmac('sha256', $payload, $secret, $raw = true);
if ($sig !== $expected_sig)
{
error_log('Bad Signed JSON signature!');
return null;
}
return $data;
}
function base64_url_decode($input)
{
return base64_decode(strtr($input, '-_', '+/'));
}
if ($_REQUEST)
{
$response = parse_signed_request($_REQUEST['signed_request'],
FACEBOOK_SECRET);
$name = $response["registration"]["name"];
$email = $response["registration"]["email"];
$password = $response["registration"]["password"];
$gender = $response["registration"]["gender"];
$dob = $response["registration"]["birthday"];
// Connecting to database
mysql_connect('DATABASE_HOST', 'YOUR_USERNAME', 'YOUR_PASSWORD');
mysql_select_db('YOUR_DATABASE');
// Inserting into users table
$result = mysql_query("INSERT INTO users (name, email, password, gender, dob) VALUES ('$name', '$email', '$password', '$gender', '$dob')");
if($result){
// User successfully stored
}
else
{
// Error in storing
}
}
else
{
echo '$_REQUEST is empty';
}
?>
define('FACEBOOK_APP_ID', 'your_app_id'); // Place your App Id here
define('FACEBOOK_SECRET', 'your_app_secret'); // Place your App Secret Here
// No need to change the function body
function parse_signed_request($signed_request, $secret)
{
list($encoded_sig, $payload) = explode('.', $signed_request, 2);
// decode the data
$sig = base64_url_decode($encoded_sig);
$data = json_decode(base64_url_decode($payload), true);
if (strtoupper($data['algorithm']) !== 'HMAC-SHA256')
{
error_log('Unknown algorithm. Expected HMAC-SHA256');
return null;
}
// check sig
$expected_sig = hash_hmac('sha256', $payload, $secret, $raw = true);
if ($sig !== $expected_sig)
{
error_log('Bad Signed JSON signature!');
return null;
}
return $data;
}
function base64_url_decode($input)
{
return base64_decode(strtr($input, '-_', '+/'));
}
if ($_REQUEST)
{
$response = parse_signed_request($_REQUEST['signed_request'],
FACEBOOK_SECRET);
$name = $response["registration"]["name"];
$email = $response["registration"]["email"];
$password = $response["registration"]["password"];
$gender = $response["registration"]["gender"];
$dob = $response["registration"]["birthday"];
// Connecting to database
mysql_connect('DATABASE_HOST', 'YOUR_USERNAME', 'YOUR_PASSWORD');
mysql_select_db('YOUR_DATABASE');
// Inserting into users table
$result = mysql_query("INSERT INTO users (name, email, password, gender, dob) VALUES ('$name', '$email', '$password', '$gender', '$dob')");
if($result){
// User successfully stored
}
else
{
// Error in storing
}
}
else
{
echo '$_REQUEST is empty';
}
?>
Adding a custom field
If you want to request user for additional information that facebook may not have then add a custom field in JSON string.{"name":"phone", "description":"Phone Number", "type":"text"}
cool post.we are gonna to implement Registration Plugin
amazing you can do that my bos...
awesome3x...\m/
Very nice.... iam amazed with this facebook plugin! Never thought of using user's facebook data in a registration form... cool idea :)
Prefectoooooooo!
thanks jani its great
btw we don't need to verify the string's right? like mysql_real_escape_string. Facebook do this for us? :)
Nice work man! Great post.
how can i verify from my database that for example, Username is taken or e-mail is taken using this plugin?
Thanks in advance!
it is good post. Nice work Ravi
@bhargavlalo
i get
"Can't parse fields attribute. Is it a JSON array or CSV list?"
can anybody explain?
thanks
It is not a CSV list. You can print the multidimensional array and see all the fields.
print_r($response);
What programming language are u using to create this plugin?This is really useful
keren banget
Nice post..
@Singh: We are not creating any plugins. Facebook is providing the plugin we need to read the data with PHP.
Nice post. Ravi could you tell me if I can change the language of this: "Have a Facebook account? Log in to prefill the form below with your profile information.", I need in Spanish. Thank you.
@Fede : Thank You for asking me a Good Question. Try this link
http://www.facebook.com/editaccount.php?language
This is not exactly what you needed but it will help after login.
Thank You Very much u kno m finding this almost 2 days @ last i found, Thank GOD Alhamdhulillah , Thank U
Thanks Ravi, I´m going to study. I´ll publish who I discover.
Ravi, sorry. But this is not the solution.
Ravi i dd everything but i cudnt retrieve the profile picture !! giv me a solution !! i tried as several way but i cudnt !! and while u answer these giv in detail PLEASE, coz m not wel experience on these !!
Thaxx Again !!
Ravi thank you for this article.
i get the
"Can't parse fields attribute. Is it a JSON array or CSV list?"
you say "You can print the multidimensional array and see all the fields."
im noobie on this stuff.
where do i place the "print_r($response);"?
thank you for help.
yeah the reason for the error is just change inside field double quotation to single quotation then it will alright, thats what I do and now its working perfectly...
Im waiting for the answer any1 kno that hw to insert the profile picture ??
Thanks for useful code and stepwise information you have given. Keep sharing similar stuff.
Great thanks
Great tutorial... Thanks
This doesn't work. I've tried it several times and there is no data being inserted into the users table. store user data file is accessed and page is just blank. I don't know how any of you are getting this to work and I teach PHP MySQL
With firebug it's easy to change email or any other information in hidden fields...
Nice work man! Great post.
Doesnt work. Ran twice with old app id, new ones, ran with no changes. Doesnt pass data to the db.
Hi,
Is it necessary that your Facebook application is approved before performing this whole stuff. Or you can do this just by creating a new app from scratch which is not approved yet........
hi, it's possible to save into database the url of profile photo of facebook?
affter am registaring with my demo i am getting a blank page please chek it out on http://webkoot.tk/test/index.html
is their a way to have custom fields but not force a user to enter anything in them?
For example i want to include custom field business name but not everyione has a business
@Reply to Above:
Yes you can but you need Client Side Validation. See the below link
http://developers.facebook.com/docs/plugins/registration/advanced/
nice post..
thanks for sahring
hi Ravi
I was trying with your sample code. am getting the following code.
http://phpstudents.co.in/testfacebook/index.html
But i have put my correct client id provided to me by facebook.
Please help me
Hi Ravi,
I have followed your code and am getting these errors are you able to help at all?
Undefined index: signed_request in /var/www/vhosts/ridden.it/httpdocs/fb/store_user_data.php
which is on like 33 which is this line :
$response = parse_signed_request($_REQUEST['signed_request'],
and I am alos getting this :
Undefined offset: 1 in var/www/vhosts/ridden.it/httpdocs/fb/store_user_data.php
which is on line 8 which is this line:
list($encoded_sig, $payload) = explode('.', $signed_request, 2);
Thanks
Glynn
Hi Ravi,
This facebook Registration form script is excellent.
Thanks,
Satyram.S
Thanks This what I searched
script is running , how can i change the background color of iframe , i dont need white ground ? plz help me out ?
script is running , how can i change the background color of iframe , i dont need white ground ? plz help me out ?
@Saurabh
Iframe third party not in our control.
Nothing being inserted into the database what could be the error?
What if you have your own reg form and want the url to redirect to it?
Is it any different to read the JSON?
How do I prefill the form with the response from fb?
Great Post!
any idea how to use a tab app as the redirect_uri?
It will redirect but doesn't have the form data in the signed request...?
Thanks!
YOU ARE GREAT! Thanks
i tryed to register on facebook, but i am seeing in the page was please type your email address at the space made for first name, i don,t why please i need help.
how can i do this tutorial with asp.net ??
Hi Ravi,
What the best way to redirect users after successful insert into the DB? i am getting "Warning: Cannot modify header information - headers already sent by " error when i try to use
if($result){
// User successfully stored
header('Location: http://www.google.com/');
}
Can you help please? I check back on this post.
Is there a way to make it save the passwords in md5?
Thank you.
How do I read fb user_about_me?? It is coming up empty and I can't figure out why.
Thk for tutor.
How to get user location?
$location= $response["registration"]["location"];
result is array...
please for respone.
thk
Thank you sooo sooo very much..had been looking for this from 2 weeks...this one really works great :) :) :) :)
hello..i want to set cookies so that the registered users can be detected after login..please provide the session code for that...
I keep getting this, any ideas? "Can't parse fields attribute. Is it a JSON array or CSV list?"
The form is working for me except there is no data being inserted into the users table. I did not modify anything except ma database connection. Any idea???
To all those who are getting a parse error:
The script should look like this -
fields="[
{'name':'name'},
{'name':'email'},
{'name':'password'},
{'name':'gender'},
{'name':'birthday'},
{'name':'captcha}
]"
Take note of the double quotes/single quotes and missing double quotes after the FIELDS attribute declaration
Hope this helps,
C
Awesome post work for me 100%.
Thank a lot
i want to add signup and sigh in both facility in my site.
how can i add this?
i got this type of error.
can you please solve my problem?
error is "Can't parse fields attribute. Is it a JSON array
or CSV list?"
everyone can read your password in db with this script so besecure...
@Irwan said...
$location= $response["registration"]["location"]["name"];
try this hope this works.
tenqyu so much.. :)
hello everyone,
somebody help me
where exactly can i Add th following custom field following custom field-
1.type of model,
2.height,
3.weight,
4.haircolor,
5. bust size
6.5 photo uploads,to request user for additional information that facebook may not have,please help me with the script.thank you.
can i test this in localhost??
Can't find the data in the database, whatever I do...
It does print the Array, but further then that I don't get.
THIS:
CREATE TABLE users
(
uid int(11) PRIMARY KEY AUTO_INCREMENT,
fullname varchar(50),
email varchar(50) UNIQUE,
password varchar(50),
gender varchar(6),
dob varchar(16)
);
Should Be:
CREATE TABLE users
(
uid int(11) PRIMARY KEY AUTO_INCREMENT,
name varchar(50),
email varchar(50) UNIQUE,
password varchar(50),
gender varchar(6),
dob varchar(16)
);
----
'FULLNAME' SHOULD BE 'NAME'
My database requires city , state - How can I pull these out?
The registration.php works fine for me.
I'm successfully connecting to the mysql database and printing the array works, but it does not store into my database. I've even tried "inTowns" suggestion above. I feel like i'm sooo close! Any help would be Greatly appreciated. Thank you!
Hello, thank you for sharing this script!! I've got the database to work correctly and everything is working awesome
However, Can you share how to have the form also send a simple email that is not dynamic? I just want to send a thank you message with a link while also retaining their information in the database.
Thank you!!
I found an error on functions.php line 15. But everything's awesome! Thanks,
Awesome job!! Just what I needed
How can you add a redirect to the homepage after it's stores the data? Can you add that action to the store_data_user.php?
Update: I got it to work where it just posts the signed requests. It won't add to my database though? any ideas?
Very Good but one question how can i get die Facebook_id to update the photo from fb to my space?
this is a good resource
When i register it directs me to store_user_data.php which is a blank page and neither my data is saved in DB
Awesome Awesome Awesome
Dear All,
Have any body for help me? When I save my FB application then give me "Error,
sharp-warrior-9347.herokuapp.com must be derived from your Site URL or your Mobile Web URL." Plz advice me, how can save my application
can you please recheck the code's and if possible upload a zip file with the codes
i am getting an error
store_user_data.php?. It may be down for maintenance or configured incorrectly.
Here are some suggestions:
Reload this webpage later.
HTTP Error 500 (Internal Server Error): An unexpected condition was encountered while the server was attempting to fulfill the request.
my data is not stored in database, any one help plz
hi, tank you finaly i find a tutorial that's works!
doesnt work on IE. How can I fix it?
it really helped me
but i wanna know
wht is the login process
suppose i registered the site and put the data in the
databse the way u told
but then what actually happens when user login/
i mean
tht session and the various things we do in normal procedure?
and how i restrict the pages if usr is not logged in?
Wow. Thank you, this is exactly what I needed. One oint is that I had to change fullname to name and it worked like a charm. :-)
gud articel
but when i get it page is blank no data printed on callback url
i'm getting the same error as: hafsa.iwe
I can see the form, but when i submit, callback page does not exist, and it does not store data in DB.
Any advice?
Thx!
how to create it in zend framework
Can i use this in my localhost????
Hi..
I am in confusion..
Every article i search for facebook users registration in wordpress, i only find creating a seperate table for it.
Can i ask a little help from you guys..
I want to create facebook users to register in my website..
the new user_id to be created for my wordpress should be the email id of the facebook user.
Instead of creating new user table, cannot we send the facebook user data to wordpress table wp_users.
Hoping to get a good response for you guys.
Thank You
Ratan Thapa
mail@ratan.com.np
www.ratan.com.np
helpful......mind blowing man......
hey man great script but i am just having some issues.. when i submit the registeration form i get a blank next page... nothing is saved in my database table either... what could possibly be the error?
Can i have two dynamic dropdowns as custom fields (so both takes data from db, second depands on first dropdown)?
Renate
hi,good one but i am stuck in one more issue ,....so can u solve this problem
problem is I want to prefill the sign up form of the site i created i.e i am getting a form from facebook by doing this but,i want only attributes and all other things should be of my choice( i mean look and feel ,like color,background etc)
so any idea how to implement this
Can't parse fields attribute. Is it a JSON array or CSV list?
:-(
help !!!
Hello, what about how to un-suscribe users from my website using Facebook ? it is possible ?
As I can notice when a user registers and confirms by facebook registration plugin it seems that, Facebook marks as registered to this user. But how can you unmark this user if he wants to unsuscribe ?
not working dear, as on your site it is not redirecting anywhere. same is happening on my site. Please help
This isnt loading form.
ERROR:
"Unable to load the registration form for Frostbox. You may have previously blocked this app on Facebook. Go to your Facebook privacy settings to unblock this app. (Error: That 'redirect_uri' isn't allowed for that client_id.)"
Please help.
Hi Ravi,
I'm trying to get the script to work. The registration form looks good, but then I get a 404 error when the form is submitted and the redirect goes to the store_user_date.php. Did I miss something? I'd appreciate any help you could offer.
Best,
-Jim
i've follow all the instructions above and only change the database part. but why i cannot direct to user_data_info.php after clicking register?please help.
I get the following error;
Unable to load the registration form for Skalshop. You may have previously blocked this app on Facebook. Go to your Facebook privacy settings to unblock this app. (Error: Can't parse fields attribute. Is it a JSON array or CSV list?)
I've created a app, and replaced the appid, somehow as soon as I change/remove the redirect_uri (change from default given by Facebook) it all stops working. What could I be doing wrong?
For complete documentation go to
https://developers.facebook.com/docs/plugins/registration/
Good plugin very useful i like it. thank you..
can I use store_user_data.php for facebook login and how ? Thank you
I tried this, but get:
Unable to load the registration form for Sportxast Beta Registration. You may have previously blocked this app on Facebook. Go to your Facebook privacy settings to unblock this app. (Error: Can't parse fields attribute. Is it a JSON array or CSV list?)