I am trying to use Facebook's javascript SDK login / logout button (https://developers.facebook.com/docs/facebook-login/login-flow-for-web) together with Facebook's comments plugin (https://developers.facebook.com/docs/plugins/comments/). My code is as follows:
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '############',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
// Load the SDK asynchronously
(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));
</script>
// Facebook login button
<div class="fb-login-button" data-max-rows="1" data-size="medium"
data-show-faces="false" data-auto-logout-link="true">
</div>
// Facebook comments plugin
<div class="fb-comments" data-href="##########" data-numposts="5"
data-colorscheme="light" social="true">
</div>
Both features work individually, but if a user logs in by clicking the "comment using... Facebook" button inside the comments box, the login button does not change to a logout button.
FB.Event.subscribe provides a mechanism for detecting login events, but the comments plugin doesn't appear to trigger any events when a user logs in with it.
Does anyone have any idea how to make the main login button change to a logout button when a user logs in using the comments plugin?
Here's the response from Facebook:
At this time this behavior is by design. The social plug-ins are designed to cover the majority of use cases from our developers and the general use case for the comments plugin is sites which do not explicitly integrate Facebook login, so the comments plugin does not provide login events.
However, since the login for a user is only triggered when they attempt to post a comment, for logged out users, you should subscribe your JS SDK implementation to the "comment.create" event instead of a login event. In this case, if desired, you can trigger a refresh of your page to show the "log out" button.
I did try attaching a refresh action to the comment.create event, but the event only fires when the user actually posts a comment, not when they log in to the comments plugin. All in all, pretty disappointing.