Home/ Questions/Q 6247895
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-24T12:57:30+00:00

I have a facebook app which run only through a fan page. Go to

  • 0

I have a facebook app which run only through a fan page.
Go to app : http://apps.facebook.com/imageassistant/ (You should have a fan page to check this)

I need to increase the height of my canvas page as much as I can with a fix width value(If you run my application you will see)

I have a index.php file which include fbmain.php file

//index.php
<?php
 include_once "fbmain.php"; // this file do all authentication parts
//some codes
?>

I need to resize my all pages in my app
I found some codes related to this from facebook developer page 

window.fbAsyncInit = function() {
  FB.Canvas.setSize();
}

// Do things that will sometimes call sizeChangeCallback()

function sizeChangeCallback() {
  FB.Canvas.setSize();
}

and this

FB.Canvas.setSize({ width: 640, height: 480 }); // Live in the past

But I don’t know how to use these codes in my app and where should I put those?
Do I have put this code in each and every file in my app?
Do I have to change the app settings in my developer app page also? (IFrame Size to Show scrollbars or Auto-resize before do this)
Can anyone please post the complete answer including where should I put that?
Note : I am using php sdk

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    But I don’t know how to use these codes in my app and where should I put those?

    There are a number of valid ways of doing this the following is just one:

    <!doctype html>
<html xmlns:fb="http://www.facebook.com/2008/fbml">
    <head>
        <!-- YOUR HEADER CONTENT -->
    </head>
    <body>
        <div id="fb-root"></div>

        <!-- You Page Content HERE -->

        <script>
          window.fbAsyncInit = function() {
            FB.init({appId: 'your app id', status: true, cookie: true, xfbml: true});
            FB.Canvas.setSize();
          };
          (function() {
            var e = document.createElement('script'); e.async = true;
            e.src = document.location.protocol +
              '//connect.facebook.net/en_US/all.js';
            document.getElementById('fb-root').appendChild(e);
          }());
        </script>
    </body>
</html>

    Do I have put this code in each and every file in my app?

    If you want the iFrame to resize then you need to include this kind of code in each and every page.

    Do I have to change the app settings in my developer app page also?

    For this to work you need to select the auto-resize option in the developer app.

    You man also want to consider FB.Canvas.setAutoResize if your content’s size is dynamic.

    You also may come accross issues where FB.Canvas.setSize fires too early in which case you can use setTimeout to delay it – from experience I’ve found 200ms to be about optimal:

              window.fbAsyncInit = function() {
            FB.init({appId: 'your app id', status: true, cookie: true, xfbml: true});
            window.setTimeout(
                function() {
                    FB.Canvas.setAutoResize();
                },
                200
            );
          };
    • 0