Monday, September 26, 2011

How to resize Facebook UI dialog

Once, I had to re-size the facebook UI dialog while working on friends invitation widget for greenarrow.com The widget was loaded under a popup which was wrapped up by an iframe as well. In this case it was not showing properly, the widget was not accommodate in that popup. That's why had to re-size the widget. I did that by following way..
var old_size = FB.UIServer.Methods["apprequests"].size;
FB.UIServer.Methods["apprequests"].size = {
 width:320,
 height:430
};
FB.ui({
 method: 'apprequests',
 message: 'A nice customizable first page application, visit - http://www.greearrow.com'
}, function() { });
FB.UIServer.Methods["apprequests"].size = old_size;
I have stored the old size first and then assign the size which i was needed. After that re-assign the old size again so that it does not broke my another UI dialog. Because in other case i have used default size.

Update:

Use following css class to resize the dialog:
.FB_UI_Dialog {
  width: 320px !important;
}


No comments:

Post a Comment