¿Cómo puedo colocar el botón de ‘Me gusta’ en mi página o blog?

21 mayo, 2010

boton me gusta facebook en nuestro blog
Facebook se ha propuesto que la red sea un espejo de su lógica y comunidad y al revés que los contenidos online quepan todos entre sus páginas, grupos y perfiles. Por este motivo, Mark Zuckerberg, cofundador de esta red social, destacó en su conferencia F8 para desarrolladores que iba a dar su ”paso más innovador en Internet” al poner a disposición de cualquier blog o página el famoso ‘Me gusta’ de esta red social.

Tras el lanzamiento y liberación del ‘I like’ para toda la red, miles de páginas lo han incluido entre sus íconos y artículos. Ya que si un artículo o promoción le gusta una a una persona y lo comunica en tu blog, todos los amigos de éste se enterarán de lo que a él le gusta. Si suponemos que la media de amigos de los perfiles españoles en Facebook, esto significa que tienes 200 lectores potenciales al contenido de tu sitio web.

Ahora bien, ¿cómo hago para colocar el botón de ‘Me gusta’ en mi blog? Comenzamos por obtener el código, que posteriormente deberemos colocar en la plantilla HTML de nuestro blog. Acudimos a nuestra página en Facebook y en la columna de derecha, justo debajo de la imagen de tu avatar, damos a ‘Editar Página’. Una vez dentro del editor, en la columna de la derecha en la categoría ‘Promociona tu página’ clickamos encima de ‘Promociona con un Me gusta en tu página’.

Este enlace te llevará a una página de Facebook Developers en dónde están todos los Social Plugins propios de Facebook: Caja de Comentarios, Caja de Me gusta (fans) de la página o Live Stream, entre otros. Una vez que ya estemos en este espacio, debes seleccionar en su listado de plugins de la derecha ‘Like Button’.

Dentro de la página de este plugin de Facebook, debemos obtener nuestro código. Para ello, rellenamos el formulario que tenemos colocado en la parte de abajo: url de tu blog, tamaño, fuente, color… hasta que diseñemos el botón que mejor pueda quedar en nuestro sitio. Damos a obtener código y copiamos en el bloc de notas de nuestro ordenador el mismo. Aparte de este código, Facebook nos aconseja estas tres etiquetas de HTML que podemos incluir dentro del  ya generado. Por ejemplo para el Blog de ONO serían:

-> <meta Property=”og:title” content=”Blog oficial de ONO “/> (El título de tu página o Blog, en nuestro caso Blog Oficial de ONO).

-> <meta Property=”og:site_name” content=”Oblog”/>(El nombre de su sitio web, en nuestro caso Oblog).

-> <meta Property=”og:image” content=” http://blog.ono.es/wp-content/themes/oblog/images/ono_logo.png”> (La imagen más representative de tu sitio, en nuestro caso el logo de ONO).

Con el código generado acudimos al gestor de contenidos de nuestro blog, ya sea WordPress, Blogspot o Typepad, por citar sólo los tres más usados. En él buscamos el ‘Editor de Apariencia’ de nuestras páginas del blog, copiamos del bloc de notas este código de HTML y lo pegamos en la parte de la  plantilla de nuestro blog (portada, artículo, página…) en la que queremos que aparezca el botón de ‘Me gusta’.

53 Comments

  1. Cinica

    mayo 24, 2010 a las 5:03 am

    Aun no lo logro =/

    • Oblog

      mayo 24, 2010 a las 9:41 am

      Porqué exactamente? qué te aparece?

  2. ARKANFLOW

    junio 5, 2010 a las 10:42 pm

    Sabes …..no encuentro en el HTML de mi blogspot donde intalar el codigo esta en ingles ayudame …

    • Oblog

      junio 7, 2010 a las 9:22 am

      Hola, está en modificar apariencia o en editar plantillas

  3. Miguel

    junio 8, 2010 a las 6:15 am

    ta mare donde esta mi pagina de facebook , te refieres a mi perfil? debajo de mi avatar o foto no veo esa opcion

    • Oblog

      junio 8, 2010 a las 9:29 am

      No me refiero, a una página de Facebook, tienes que entrar a editar página debajo de tu avatar de la página.Ahí entras en Promocionar mi página y dentro de las categorías de la izquierda de la pantalla en Like Button

  4. Juan

    junio 13, 2010 a las 11:56 pm

    Gracias man, me canse de buscar esto ja…

  5. Daniel Guerrero Viveros

    julio 22, 2010 a las 4:02 am

    muy buen sitio!

  6. Daniel Guerrero Viveros

    julio 22, 2010 a las 4:03 am

    me gusto!

  7. Snark

    julio 27, 2010 a las 6:07 am

    mejor esta este solo es un me gusta pequenito y practico
    http://www.facebook.com/widgets/like.php?&layout=button_count&href=AKI SU LINK

  8. Miguel

    agosto 2, 2010 a las 6:15 am

    Hola amigo ya logre colocar mi caja de me gusta de facebook en mi pagina pero hay un problema , ¿por que no se puede visualizar a mis seguidores de facebook ? para poder verlos tengo que inciar sesion, no entiendo que hice mal? por ejm en tu caja de me gusta puedo ver a tus seguidores de facebook y no necesito iniciar sesion , a que se debe eso?

  9. María

    agosto 10, 2010 a las 11:16 am

    He seguido todos los pasos y me resulta imposible. Las totos me las pone chiquititas y descuadradas, no como las tenéis aquí. ¿A qué puede ser posible? Gracias

  10. Cristian A. Marcó

    agosto 23, 2010 a las 11:39 pm

    Grasias por tu alluda

  11. ranci

    septiembre 9, 2010 a las 4:18 am

    hey quien sabe como colocar la caja de me gusta en mi perfil?? no logro entender como??

  12. Holocausto

    septiembre 19, 2010 a las 4:48 am

    Unete

  13. videomatch

    octubre 29, 2010 a las 5:52 am

    quiero que aparezca en la pagina principal y no en los muros solos

    • Oblog

      octubre 29, 2010 a las 9:24 am

      Hola, no te entiendo muy bien podrías específicar más, en qué página principal?

  14. johnny

    enero 4, 2011 a las 11:33 pm

    por cuano le doy general codigo no sale el codigo.

    please lo necesito urgente

    • Oblog

      enero 10, 2011 a las 10:46 am

      Hola,

      A nosotros si que nos sale, prueba en varios navegadores y mira en la parte de arriba si se ha bloqueado la pestaña emergente que te debería salir.

      Esperamos que esto funcione.

      Un abrazo

  15. amilcar

    enero 12, 2011 a las 3:50 am

    olle como que ya pude ponerlo pero no encontre la insignia que añadiera un me gusta solo encontre una que decia que ami me gustaba eso pero no un boton de me gusta, me podrias ayudar con eso?

  16. Cecilia

    enero 25, 2011 a las 6:57 am

    Se puede colocar “Me gusta” al lado del título del facebook y los que le hacen click se incorporen automáticamente a mis amigos.

  17. Cecilia

    enero 25, 2011 a las 7:04 am

    La página de la marca que manejo recibe 200 visitas diarias y eso significa muchas confirmaciones que hacer. Cómo se puede simplicar esto.

  18. berseker uchiha

    febrero 7, 2011 a las 8:56 pm

    una pregunta como le puedo hacer si cuando quiero registrar mi numero de telefono en el facebook para poder usar facebook connect y me aparece del pais que soy pero no me aparece mexico como le puedo hacer?

    • Oblog

      febrero 8, 2011 a las 10:31 am

      Hola, se debe de tratar de un error de Facebook escribe a su soporte para ver qué ocurre con este tema.

      Saludos

  19. JJCame

    marzo 4, 2011 a las 9:22 pm

    Aun no logro poner en mi pagina el boton de me gusta pues no me aparece la opcion editar pagina la he buscado como dicen pero solo aparece configuracion de la cuenta, si me pudieran ayudar por favor se los agradedceria mucho….. =(

    • Oblog

      marzo 7, 2011 a las 1:33 pm

      Hola para poder ayudarte nos tienes que indicar que servicio estás utilizando WordPress, blogger…
      Y así sabríamos guiarte
      Saludos

  20. paula

    marzo 12, 2011 a las 4:37 am

    em lo ke yo kiero poner es el botón d eme gusta como el tuyo k dice ONO en facebook y no me sale =/

  21. cristian gonzalez

    marzo 20, 2011 a las 7:02 pm

    ojala resulte

  22. SOFIA

    julio 5, 2011 a las 11:55 pm

    Puse editar pagina pero no me sale en ninguna parte “promocionar tu pagina” ..me aparece “promocionar con un anuncio” y yo no quiero hacer eso…qe puedo hacer???como se hace??

  23. Pingback: ¿Cómo puedo colocar el botón +1 de Google en mi página o blog? | Ono

  24. Stephanie Muñoz

    agosto 10, 2011 a las 4:26 pm

    Hola que tal!, oye disculpa me podrías decir si puedo poner este botón “ME GUSTA” para alguna aplicación o fotografías mismas en facebook ¿? es que resulta que ya busqué por todas partes y nadie me resuelve eso… :( gracias de antemano :D

  25. glenda tapia

    marzo 27, 2012 a las 6:22 pm

    hola stoi haciendo una pagina q m pidieron en la scuela stoi utilizando asp se podria utilizar st codigo???

  26. edgar

    abril 8, 2012 a las 5:35 am

    hola me pregunto si esto solo funciona para paginas de facebook o perfiles normales es que quiero promocionar mi blogs y en mi pagina normal de facebook no encuentro eso de lo que dices ah y otra pregunta ¿en la nueva biografria donde lo encuentro? gracias

  27. dark

    abril 25, 2012 a las 1:17 am

    mmm yo lo puese un mi web y se ve bien esta es http://www.elmasterdj.es.tl entren y miren todo lo que le pueden poner a su web

  28. dark

    abril 28, 2012 a las 8:35 pm

    elmasterdj.es.tl

  29. David

    mayo 3, 2012 a las 10:20 pm

    ONO ha sido -con diferencia- la empresa que más me ha engañado, facturado de más y me ha hecho perder el tiempo poniendo reclamaciones. NUNCA JAMAS volveré a contratar nada con ONO. Es vergonzoso. 

  30. jose

    mayo 9, 2012 a las 8:20 pm

    hola mi gente espero la esten pasando bien

  31. Teofilo

    junio 7, 2012 a las 1:52 am

    ufff no encuentro donde esta esa parte que dices con el nuevo diseño de facebook ya no aparece esa opcion me podrias decir por donde se encuentra gracias de antemano

  32. jerson

    junio 25, 2012 a las 4:23 pm

    esto es una mierda

  33. Agapito

    julio 16, 2012 a las 4:39 pm

    Es el peor artículo que he visto nunca sobre como poner un botón de Facebook.

    Por ejemplo, dices:

    “¿cómo hago para colocar el botón de ‘Me gusta’ en mi blog? Comenzamos por obtener el código”

    Ahhh, claro, “el código”, rezaré a Dios para que el “código” me baje del cielo… a no! calla, si lo explicas a continuación:

    “Acudimos a nuestra página en Facebook y en la columna de derecha, justo debajo de la imagen de tu avatar, damos a ‘Editar Página’. Una vez dentro del editor, en la columna de la derecha en la categoría ‘Promociona tu página’ clickamos encima de ‘Promociona con un Me gusta en tu página’.”

    Yo conozco uno mejor, “el cielo está enladrillado, quien lo desenladrillará, el desenladrillador que lo desenladrille, buen desenladrillador será”.

    A ver majete, ¿¿¿sabe que es un PUTO LINK??? ¿¿¿y si cuelgas el PUTO LINK directamente en lugar de escribir gilipolladas???

    O mejor!!! ¿¿¿Y si dejas de escribir artículos y así no perderemos el tiempo los demás???

  34. rudimi

    julio 20, 2012 a las 6:13 am

    http://www.siragon.com/promocion/participantes.php?Id=125 ayudenme a ganar este concurso entrando a el link y dando me gusta a jose gonzaez se los agradezco es para mi importante ganar

  35. Pepe

    julio 22, 2012 a las 12:49 pm

    De donde sacaste los botones de compartir esos que tienes al final de la entrada?

  36. JUANCHO

    julio 27, 2012 a las 7:26 pm

    que bueno lo usare en mi pagina web gracias por este articulo me servira mucho

  37. jonatan

    julio 28, 2012 a las 1:29 am

    Hola amigo , muy linda tu pagina , este tema que estas usando en tu pagina como se llama ? es gratis para wordpress? me gustaria usarlo si no te molesta .

  38. Everlyn

    agosto 2, 2012 a las 6:14 pm

    esto de poner face en cada entrada ayuda a atraer visitas?

  39. lucrecia

    agosto 9, 2012 a las 3:19 pm

    Puedo poner el botón de “me gusta” en un newsletter HTML? Si es posible, me ayudan a hacerlo? Recién estoy dando los primeros pasos con el dreamweaver y me gustaría agregar este botón en los boletines que publicamos. Ya generé el código que necesito pero no me doy cuenta de como hacer para incluirlo en un HTML.
    Desde ya muchisimas gracias y muy bueno tu sitio!

  40. Lorenzo Rodriguez

    septiembre 12, 2012 a las 3:26 am

    Hola gracias por compartir este contenido de valor en tu blog y no vender tu conosimiento lo que algunos hacen por ay.

  41. Rudy

    septiembre 17, 2012 a las 2:42 pm

    buenas no se donde poner el codigo y me esta sacando de mis casillas
    me lo podrias masticar bn no se que es el avatar ( a no ser que te refieras a mi foto )

    lo unico que quiero es saber donde introducir el codigo nada mas

    gracias

  42. Paula

    octubre 8, 2012 a las 5:42 am

    Te felicito, me fue de gran ayuda.

  43. JulianaKool

    noviembre 22, 2012 a las 8:33 pm

    Para los que deseen una forma sencilla de insertar el boton “me gusta” en sus sitios web aqui les dejo el codigo, es la manera mas secilla que conozco de hacerlo.

    En su sitio web, van a el editor de HTML e insertan el codigo que puse cambiando unicamente lo que esta en mayuscula por la direccion o url de su pagina del facebook, actualizan y listo

    Ojo, ésto solo funciona para “páginas del facebook” no para perfiles personales de facebook, asi que no pierdan el tiempo poniendo la url de su perfil porque no funcionará.

    My Great Web page

    Espero que les sea de utilidad. Saludos.

  44. JulianaKool

    noviembre 22, 2012 a las 8:38 pm

    Lo siento, no deja publicar el codigo aqui :S si quieren mi correo es julianakool@gmail.com y les paso el código.

    No me deja publicarlo aqui

  45. Juan Luis

    marzo 21, 2013 a las 2:32 pm

    Muchas gracias por tu excelente solución, ya lo he instalado en mi web, muchas gracias.

  46. david

    agosto 29, 2013 a las 7:17 am

    Amigo buenas noches: Me podrías enseñar cómo colocar mi enlace a Facebook del mismo modo que tú colocas TUS SUGERENCIAS en tu blog, por favor.
    Saludos…

Comentarios

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>