CODEWITHSUNDEEP
javascriptfacebookfacebook-graph-apifacebook-javascript-sdk
user1072337
user1072337

Reputation: 12945

Making Facebook Dialog Feed Box appear in the same window as a modal instead of popup of a page

I would like Facebook Dialog Feed to appear as a modal in the same page. The user is authenticated earlier before this call, using PHP. I tried using the iframe property for display, but it is still appearing as a popup.

The code is below:

window.fbAsyncInit = function () {
   FB.init({ appId: '****************', cookie: true, xfbml: true, oauth: true });
   if (typeof facebookInit == 'function') {
       facebookInit();
   }
};

(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 facebookInit() {
  FB.ui({
    url : 'http://url.com',
    method: 'feed',
    name: 'Hey',
    link: 'http://url.com',
    display: 'iframe',
    picture: '',
    caption: fb_description,
    }, function (response) {
        if (response && response.post_id) {
            window.location = "/hello";
        } else {
            window.location = "/hello";
        }
    }
  ); 
}

Is there a reason why this is appearing as a popup and not appearing as a modal?

Upvotes: 1

Views: 1318

Answers (1)

Sahil Mittal
Sahil Mittal

Reputation: 20753

The only way to show the feed dialog in the same window instead of popup is to use the direct url redirection.

You can use it like this-

function facebookInit() {
    var app_id = "{app-id}";
    var fb_description = "{description}";
    var redirect_uri = "{redirect-url}";
    var link = "{link to share}";
    var name = "{name}";

    var url =   "https://www.facebook.com/dialog/feed?"+
                "app_id="+app_id+
                "&caption="+fb_description+
                "&link="+link+
                "&name="+name+
                "&redirect_uri="+redirect_uri;

    location.href = url;
}

Edit:

The documentation says-

If you are using the JavaScript SDK, this will default to a modal iframe type for people logged into your app or async when using within a game on Facebook.com, and a popup window for everyone else

If your app is inside the facebook, then only it will open as a model iframe type, else, a popup or completely on window will be shown.

Upvotes: 1

Related Questions