Insertar botón “Me gusta” de Facebook en tu web

10 comentarios

Agregar el botón “Me gusta” de Facebook en cualquier página web es bastante sencillo. El botón contiene una serie de parámetros configurables que podemos cambiar desde el mismo código del iframe o directamente en el generador del botón en facebook en http://developers.facebook.com/docs/reference/plugins/like.

Parámetros del botón “Me gusta”:

  • href : Es la dirección a compartir. (ej: http://www.bufa.es/)
  • layout : Estilo del botón. Valores: standard o button_count
  • show_faces : Muestra el avatar de a quiénes le gusta. Valores: true o false.
  • width : Ancho del iframe.
  • action : Texto del botón. Valores like o recommend. (Me gusta o Recomendar)
  • font : Tipo de fuente a utilizar.
  • colorscheme Esquema de colores. Valores: light o dark.
  • locale : Idioma

Ejemplo 1 (standard):

<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.bufa.es&amp;layout=standard&amp;show_faces=true&amp;width=450&amp;action=like&amp;font=trebuchet+ms&amp;colorscheme=light&amp;height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:80px;" allowTransparency="true"></iframe>

Ejemplo 2 (button_count):

<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.bufa.es&amp;layout=button_count&amp;show_faces=true&amp;width=450&amp;action=like&amp;font=trebuchet+ms&amp;colorscheme=light&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:21px;" allowTransparency="true"></iframe>

Ejemplo 3 (box_count):

<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.bufa.es&amp;layout=box_count&amp;show_faces=true&amp;width=450&amp;action=like&amp;font=trebuchet+ms&amp;colorscheme=light&amp;height=65" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:65px;" allowTransparency="true"></iframe>

Para cambiar el idioma del botón “Me gusta” de facebook podemos añadirle la variable “locate” al like.php. Por ejemplo, si queremos que aparezca siempre en Español (‘es_ES’):

<iframe src="http://www.facebook.com/plugins/like.php?locale=es_ES&href=http%3A%2F%2Fwww.bufa.es&amp;layout=standard&amp;show_faces=true&amp;width=450&amp;action=like&amp;font=trebuchet+ms&amp;colorscheme=light&amp;height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:80px;" allowTransparency="true"></iframe>

Este post ha sido archivado en Facebook.

  • http://pagina-web.cl/ Jorge

    Muchas gracias, me sirvio mucho. Este tema “Me gusta”

  • http://odagames.host56.com/prestashop zuzo

    Me marca un error al dar “Me gusta”
    Dónde puedo solucionar esto, me dice que necesita página de referencia

  • carlos

    Hola, por casualidad sabes como puedo hacer que aparezca el boton me gusta con el Flash CS5?
    estoy haciendo un pagina en flash sin tener idea de usar el programa, asi que se me ha hecho indispensable los tutoriales,
    Muchas gracias de antemano

    Slds

  • http://comoestaelmundo.com Zherg

    Muchas gracias por la explicación. Aprovecho para preguntar si suele notarse de forma clara algun aumento de visitas por el hecho de tener el botón. Un saludo!!

  • maria josé

    ¿por qué me sale en inglés??

  • http://www.23grados.com Gerson

    Hola.. me gustaría saber por qué al ingresar este código, en mi pág aparecen menos ME GUSTA de las que realmente tengo en la pag de face….?
    Saludos y gracias por su ayuda

  • SERVANDO

    SALUDOS, QUISIERA SABER COMO PERSONALIZAO LOS BOTONES DE FACEBOOK T TWITTER SIMILAR A LOS QUE USAN UDS.

  • http://www.ufanbuilder.com Sara Morán

    Os recomiendo una aplicación genial para Facebook. Se llama UFANBUILDER y consiste en generar automáticamente una web completa de acabado profesional dentro de tu página de facebook. Una vez instalada se elige un diseño y se edita la web con un completo gestor de contenidos. Además, dispone también de otras aplicaciones como Tienda en Facebook, Gestión Inmobiliaria, etc…Podeis echarle un vistazo en la web oficial http://www.ufanbuilder.com
    Espero que os sirva. Saludos.

  • http://www.radiopozarica.com Carlos

    Gracias lo intente con el mismo facebook y no me funciono da demasiadas opciones y la verdad me enredo y el que tienen ustedes el primero si me funciono a la primera gracias.

  • https://sites.google.com/site/estudiodisenovalencia/ fernando

    Muy bueno, gracias ya esta en marcha: https://sites.google.com/site/estudiodisenovalencia/

¿Te ha sido útil?haz click en
+1https://plus.google.com/share?url=http://goo.gl/Q4i3j