jueves, 23 de agosto de 2012

Cambiar alto tabs de Facebook y eliminar scroll bars



Muchas veces cuando tratamos de implementar tab para facebook no vemos en la necesidad de usar un mayor espacio del proporcionado por facebook en un fab de un fan page, para esto facebook ha creado un par de funciones que nos permiten jugar con esto, permitiendo de esta manera des hacernos de las molestas scrollbars del iframe donde esta contenida tu aplicación. Para esto te recomiendo uses el sig código fuente:

CSS

 body{  
      margin:0;  
      padding:0;  
      font: 14px/130% Arial, Helvetica, sans-serif;  
      width: 810px;  
      margin: 0;  
      padding: 0;  
      overflow-x: hidden;  
 }  

HTML

 <div id="fb-root"> </div>  
 <!-- carga SDK de Facebook-->  
 <script src="//connect.facebook.net/en_US/all.js"></script>   

Javascript

 window.fbAsyncInit = function() {  
      FB.init({  
           appId   : '397364806984767', // App ID  
           status   : true, // check login status  
           cookie   : true, // enable cookies to allow the server to access the session  
           xfbml   : true // parse XFBML  
 });  
                  // Additional initialization code here  
 };  
                 // Load the SDK Asynchronously  
 (function(d){  
   var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];  
   if (d.getElementById(id)) {return;}  
        js = d.createElement('script'); js.id = id; js.async = true;  
           js.src = "//connect.facebook.net/en_US/all.js";  
           ref.parentNode.insertBefore(js, ref);  
 }(document));  
 FB.Canvas.setSize({ width: 810, height: 1200 });  

Una ves cargada la SDK de facebook la funcion FB.canvas.setSize te permitira jugar con el tamaño del iframe de facebook. Mientras el CSS elimina los molestos scroll bars del iframe del tab de Facebook


Saludos!
hasta la próxima

2 comentarios:

  1. hola, sabes como condicionar el acceso a una aplicación pero dentro del facebook? muchas paginas en facebook te piden que presiones me gusta antes de continuar.

    ResponderEliminar
  2. espero no sea demasiado tarde, en esta url esta explicado como hacerlo

    http://www.bufa.es/facebook-sdk-php-detectar-me-gusta/

    ResponderEliminar