Impostare l’altezza dei tab di Facebook oltre 800 pixel

social e dintorni — By on 4 luglio 2012 11:00

Vi è mai capitato di realizzare un tab su Facebook e di fare i salti mortali per concentrare tutto in un’altezza di 800 pixel? Già perché 800 pixel è l’altezza di default dei tab di Facebook, ma per fortuna esiste uno modo per impostarla a dimensioni maggiori.

Prima di tutto bisogna caricare il Javascript SDK di Facebook aggiungendo il seguente codice in fondo alla pagina appena prima del tag </ body>:

 

<div id="fb-root"></div>
<script src="https://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId : 'YOUR-APP-ID-HERE', // make sure to change to your application ID!
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
</script>

 

Una volta caricato il Javascript SDK, è possibile utilizzare la funzione FB.Canvas.setSize () per eliminare le barre  di scorrimento. Inserire il seguente codice prima del tag </ head> della pagina html:

 

<script type="text/javascript">
window.fbAsyncInit = function() {
FB.Canvas.setSize();
}
// Do things that will sometimes call sizeChangeCallback()
function sizeChangeCallback() {
FB.Canvas.setSize();
}
</script>

 

Questo script dice a Facebook di ridimensionare l’iFrame ogni volta che viene caricata la pagina e ogni volta che la dimensione dei contenuti cambia.

That’all!

Tab Sony Xplore su Facebook

Tag: , ,

3 Comments

  1. Elisa ha detto:

    Ma non funziona!!! c’è qualcosa da mettere nei css? L’iframe mi rimane sempe fisso anche se è impostato su fluid e compaiono gli scroll…

  2. Elisa ha detto:

    anzi ti dirò: io vedo gli scroll anche su questa tab che hai pubblicato

  3. Emanuela De Vecchi ha detto:

    Elisa,
    il css non va toccato, basta inserire gli script indicati nelle posizioni indicate. Il tab di Sony pubblicato nel post è solo un esempio, non realizzato da me, che io visualizzo correttamente con qualsiasi browser e su diversi computer, senza alcuna scrollbar.

    Temo tu abbia qualche problema di visualizzazione. Prova a cambiare browser o PC e verifica di non aver fatto qualche zoom (con ctrl + rotellina del mouse) per ridimensionare la visualizzazione nel browser.

    Io con questa tecnica ho realizzato diverse tab, tutte funzionanti.

    Fammi sapere 🙂

Leave a Comment