To get the additional information you just need to focus on user´s scope. When user click on facebook login button it calls the FB.login(). Now if you want to receive the user´s email then replace FB.login() with FB.login(function(response) {
}, {scope: ´email´}); in script code. and also onclick event of the facebook code.
Following is the javascript code to put on your webpage. and replace the App ID you recently generated while creating the app.
----------------------------------------------------------------------------------------------------------------------------------
window.fbAsyncInit = function() {
FB.init({
appId : ´xxxxxxxxxxxxxxxxx´,
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
FB.Event.subscribe(´auth.authResponseChange´, function(response) {
if (response.status === ´connected´) {
testAPI();
} else if (response.status === ´not_authorized´) {
FB.login(function(response) {
}, {scope: ´email´});
} else {
FB.login(function(response) {
}, {scope: ´email´});
}
});
};
(function(d){
var js, id = ´facebook-jssdk´, ref = d.getElementsByTagName(´script´)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(´script´); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
function testAPI() {
console.log(´Welcome! Fetching your information.... ´);
FB.api(´/me´, function(response) {
document.getElementById(´name´).innerHTML=response.name;
document.getElementById(´email´).innerHTML=response.email;
});
}
function fblogin(){FB.login(function(response){ }, {scope: ´email´});}
----------------------------------------------------------------------------------------------------------------------------------
Following is the HTML code for button, You can customize the button , just call the fblogin() defined in javascript with onclick event.
----------------------------------------------------------------------------------------------------------------------------------
<a style="background:none;cursor:pointer;" onclick="fblogin()"><img alt="login with facebook - anyforum.in" src="/images/fblogin.png" /></a>
<div id="name"></div>
<div id="email"></div>
