fb:login-button not show , no code changed - facebook

Question

today somebody reports me that the "Facebook login button" suddenly disappear, on his website that i made , actually yesterday was working ok, and i did not change any code at all for weeks , i have activated the July, August Changes since i made the website, in order to avoid this problems
this is my code
<div id="fb-root"></div>
<div class="fb-login-button" onlogin="Facebook_login()" autologoutlink="true">Login with Facebook</div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'FB APP ID',
status : false,
cookie : true,
xfbml : true,
oauth : true
});
};
(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
function Facebook_login () {
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
window.location = "THE URL TO PROCESS THE LOGIN";
}
});
}
</script>

Answer 1

We experienced the same issue on our website. Looks like Facebook has changed the implementation of the login button, it is now created within an iframe. It also no longer supports the 'onlogin' attribute (no longer in the docs).
We fixed by adding our own button, using the FB SDK FB.login method.
For you it would look something similar to (assuming you use jQuery for the click event)
<div id="fb-root"></div>
<button class="fb_login">Login with Facebook</button>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'FB APP ID',
status : false,
cookie : true,
xfbml : true,
oauth : true
});
$(".fb_login").click(function() {
FB.login(Facebook_login);
});
};
(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
function Facebook_login () {
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
window.location = "THE URL TO PROCESS THE LOGIN";
}
});
}
</script>

Answer 2

Hi you are not the only one experiencing trouble since today.
My website isn't displaing correctly the button and the login is broken, too.
This seems to be a bug on Facebook side, introduced with today's update, see here:
http://developers.facebook.com/bugs/386085844776949 and here
http://developers.facebook.com/bugs/250500218391321
Try subscribing to the bugs to have FB look at them.

Answer 3

Sometimes, it happens due to not re-initializing the Fb.init function. I solved this problem by parsing Fb.XFBML and i added FB.XFBML.parse(); in script tag just before fb-login button as :
<script>FB.XFBML.parse();</script>[enter image description here][1] <fb:login-button scope="public_profile,email" onlogin="checkLoginState();"> </fb:login-button>
You can see a sample of code here:
[1]: https://i.stack.imgur.com/YM7QM.png