Friday, January 13, 2012

Height of Facebook custom Page Tabs

This is a quick tip: I am currently working on a Facebook app. I have a demo for a custom Page Tab. But somehow the height was not setting properly. The canvas height setting in the Developer setting was to Fluid. I have no clue where was the setting for Page Tab. Anyway after a little search I found that the following code works:

<div id="fb-root"></div>
<script type="text/javascript" src=""></script>
<script type="text/javascript" charset="utf-8">
FB.Canvas.setSize({height: 1500});

I placed it at the bottom of my Application's custom Page Tab, before the end body tag. The height value is according to your needs. I am yet to look how this would work with flexible height (determined after iframe renders). Will update that later, for today this will do.


Anonymous said...

thank you, this is exactly what I was looking for!

Anonymous said...

If you have jQuery, you could use:

FB.Canvas.setSize({height: $(document).height()});

Otherwise, you could use:


Mark Philips said...

Thank you very much for this script, works properly!

Anonymous said...

This did not work until I added the FB.init()

FB.init({appId: 'Your ID', status: true, cookie: true, xfbml: true});
FB.Canvas.setSize({height: 1500});

Works great - Thanks

Post a Comment