Marketing en Internet, Posicionamiento web y mucho más Un blog de APASIONADOS sobre la parte técnica y curiosidades del Marketing en Internet…
El control de las barras de desplazamiento en las solapas de Facebook es un tema bastante engoroso y que hay que hacer a través del Facebook JavaScript SDK y su función «FB.Canvas.setAutoResize«. Justamente esa función se reemplaza el 1 de enero de 2012 por la función «FB.Canvas.setAutoGrow«, dejando de estar activa la primera que todos estamos usando ahora.
Este no es el único cambio que va a haber en Facebook para comenzar el año, hay un listado de todos los cambios aquí: Platform Updates: Operation Developer Love.
Todos los que hayáis intentado crear una solapa IFRAME para una página de empresa de Facebook os habréis encontrado con el problema de las barras de desplazamiento que o no desaparecen o que desaparecen después de unos segundos (y con comportamientos distintos en distintos navegadores y versiones de los mismos).
Con este código deberíamos de poder deshacernos de las barras de desplazamiento en cualquier solapa de Facebook y bajo cualquier navegador:
El código CSS necesario:
body {
margin:0;
padding:0;
overflow: hidden;
}body.profile {
width: 520px;
}body.app {
width: 760px;
}
En la solapa hay que asignarle al body la clase «profile«:
<body class=”profile”>
En la aplicación hay que asignarle al body la clase «app«:
<body class=”app”>
Al final del archivo HTML (antes de la etiqueta </body>) hay que incluir el siguiente código:
<div id=”fb-root”></div>
<script type=”text/javascript”>
window.fbAsyncInit = function() {
FB.init({
appId: ‘ID_DE_TU_APLICACION’,
status: true,
cookie: false,
xfbml: true
});
// Esta función adapata el tamaño del IFRAME en un intervalo de 100 ms al tamaño del código.
FB.Canvas.setAutoGrow(100); // Antes aquí se usaba: setAutoResize()
};
(function() {
var e = document.createElement(‘script’);
e.async = true;
e.src = document.location.protocol +
‘//connect.facebook.net/es_ES/all.js’;
document.getElementById(‘fb-root’).appendChild(e);
}());
</script>
OJO: Hay que reemplazar «ID_DE_TU_APLICACION» con el ID de la aplicación de la solapa.
Y para que funcione en la configuración de la aplicación de Facebook en el punto «Canvas Height» tiene que estar seleccionado «Ajustable (Por defecto: 800px).
Por tanto, si estás usando setAutoResize() en alguna solapa, cámbialo por FB.Canvas.setAutoGrow antes de final de año, porque sino el 1 de enero de 2012 ya no funcionará.
