Insertar gadget de Facebook para mostrar fans en tu página o blog

Bienvenidos a VerTutoriales.com en esta ocasión una forma rápida de insertar el cuadro (<iframe>) que nos ofrece Facebook para nuestros fans, puedes editar tu aspecto desde:

Mostrar fans de Facebook en tu página

Tambien puedes insertar el siguiente código, solo debes de tener en cuenta cambiar los parámetros:

<iframe src=”http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FVerTutoriales%2F120742064665406&amp;width=292&amp;colorscheme=light&amp;show_faces=true&amp;stream=true&amp;header=true&amp;height=427″ scrolling=”no” frameborder=”0″ style=”border:none; overflow:hidden; width:292px; height:427px;” allowTransparency=”true”></iframe>

o si quieres:

<script src=”http://connect.facebook.net/en_US/all.js#xfbml=1″></script><fb:like-box href=”http://www.facebook.com/pages/VerTutoriales/120742064665406″ width=”292″ show_faces=”true” stream=”true” header=”true”></fb:like-box>

Los atributos son los siguientes:

  • href – La url de tu página en facebook
  • width – el ancho en píxeles de la ventana que mostrará los fans
  • height – el alto, ten en cuenta que si vas a poner las “faces” para que se vean las imagenes ha de ser más alto
  • colorscheme – El color de la ventana, las opciones: ‘light’, ‘dark’ (claro y oscuro)
  • show_faces – Si quieres que muestre la foto de tus seguidores valore: true o false (si o no)
  • stream – specifies whether to display a stream of the latest posts from the Page’s wall
  • header -si quieres que se muestre una cabecera en la ventana que ponga “facebook” :D

Espero que os sirva, si teneis duda comentar y en un rato os lo contesto.

Te puede interesar:

13 Comments

  • SEMDNTDB commented on 23 septiembre, 2011 Reply

    ¡Hola! Querría poner este gadget en mi blog pero cuando ya está instalado y voy a la página principal para ver cómo ha quedado me sale este mensaje: Could not retrieve id for the specified page. Please verify correct href was passed in.

    ¿Me podrías decir como puedo hacer para que funcione correctamente? Gracias :)

    • VideoTutoriales commented on 23 septiembre, 2011 Reply

      Ese error ocurre cuando en el gadget que te ofrece facebook no has seleccionado tu página dejando el Id de facebook vacío, para ello tendrás que seleccionar tu página en en gestor propio de facebook o añadirlo a mano del código que ya has copiado.

      Un saludo!

  • Nicolas commented on 7 noviembre, 2011 Reply

    Hola! Quiero poner este Gadget en mi página usando Dreamweaver, tanto si pego el codigo de IFrame en una tabla o si pego el de script, cuando abro la pàgina es como si no se hubiera hecho nada, aparece todo en blanco.

    Podrías ayudarme, ya leí las instrucciones de Facebook, las de tu página y vi distintos tutoriales y nada funciona, sabès cual podria ser el problema?

    Gracias!!

    • VideoTutoriales commented on 7 noviembre, 2011 Reply

      Buenas Nicolás,

      Si no pegas el código no podré ayudarte mucho, en principio si has copiado el script que te resuelve Facebook ya sea con iframe o script, debiera de funcionar sin problema, lo único que se me ocurre es que no tengas bien puesto el id, pero lo dicho, si pegas el código será más sencillo de solucionar.

      Un saludo!

  • Helena commented on 21 diciembre, 2011 Reply

    Podrías poner un tutorial donde copiar el la id dentro del código puesto que a mí también me da el mismo problema
    Could not retrieve id for the specified page. Please verify correct href was passed in

    He copiado todos los códigos de diferentes formas y nada.

    gracias de antemano

  • Helena commented on 21 diciembre, 2011 Reply

    Te paso el código en iframe puesto que mi web no soporta el div en ningún navegador a ver si puedes decirme dónde hay que colocar la Id.

    • VideoTutoriales commented on 21 diciembre, 2011 Reply

      Podéis probar directamente con el Like Box que te genera la aplicación de facebook, si aún así no te funciona, déjame la página de facebook y te pego el código como debiera ser.

      Un saludo!

  • Helena commented on 22 diciembre, 2011 Reply

    La pagina de facebook es Todotvseries he puesto un gadget por el momento pero quiero poner el plugin del Megusta con las caras.

    gracias de antemanoo

  • VideoTutoriales commented on 23 diciembre, 2011 Reply

    Buenas de nuevo Helena, como te comenté, usando el like box puedes parametrizarlo y la propia aplicación de facebook te da el código para pegarlo, tienes que tener en cuenta que la dirección de tu página en facebook es la siguiente:
    http://www.facebook.com/pages/Todotvseries/305935256113626

    Un saludo!

  • Manu commented on 25 julio, 2012 Reply

    Hola, tengo un problema y es que mi fan box a desaparecido, solo veo un recuadro en blanco.
    Mi blog es éste: http://letrasquesemueven.blogspot.com.es/
    y mi pagina de facebook es esta:
    https://www.facebook.com/pages/LetrasQueSeMueven-Manu-LF/248572851834116

    el código que me funcionaba (el que ahora sale en blanco) empieza por script, los que empiezan por div ID no me servían.

    Espero tu ayuda, muchas gracias.

    Aquí te pego el código:
    FB.init(“1b8f0f706c312c05f42224b5b3399f80″);

    • VideoTutoriales commented on 25 julio, 2012 Reply

      No sé si ya lo has corregido, pero está correctamente :)

      Un saludo!

  • Nancy commented on 8 agosto, 2012 Reply

    Hola he pegado el scrot en un gadget de mi blog, pero no me sale absolutamente nada, jejejejeje, no se si lo estoy haciendo bien, este es mi código que he pegado:

    Ayuda por favor!!!!

    Gracias

    • VideoTutoriales commented on 9 agosto, 2012 Reply

      No puedes pegar el código al completo, separa las etiquetas o elimina los iframes, sino el gestor del blog omite esa parte.

      Un saludo!

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos necesarios están marcados *

Puedes usar las siguientes etiquetas y atributos HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>