Recuerda también leer Cómo integrar Twitter con Blogger y todos nuestros Tutoriales para Blogger!
Ya os hablé hace bastante tiempo sobre cómo integrar nuestro blog de Blogger con Twitter, una de las redes sociales más de moda en estos momentos. Pero si hay una red social que realmente está triunfando en todo el mundo es Facebook, así que ¿sería una buena idea integrar nuestro blog con ella no?
Si usáis Facebook, y apuesto a que prácticamente todos vosotros lo haréis en mayor o menor medida, sabréis que cuando nos gusta algún enlace, foto o grupo hay una opción llamada “Me gusta” para dejar claro que compartimos esa opinión, nos hace gracia o que literalmente nos gusta eso.
Así que lo que lo que vamos a hacer en este artículo es añadir el botón de “Me gusta” debajo de cada artículo de nuestro blog, para que nuestros lectores más vagos que no suelen dejar comentarios al menos muestren su conformidad con el post y para que los que comentan también puedan dejar más claro aun que les ha gustado.
Agregar el botón a nuestro blog es muy sencillo. Como ya viene siendo habitual, tendremos que hacer cambios en la plantilla, así que lo primero será guardarnos la plantilla original por si hacemos algo indebido.
Empezaremos dirigiéndonos a “Diseño” – “Edición de HTML” y marcaremos la casilla de “Expandir plantillas de artilugios”. Normalmente este tipo de botones se suelen colocar justo debajo del artículo, así que tendremos que buscar la siguiente línea:
<div class=’post-footer-line post-footer-line-1′>
Justo debajo de esa línea pegaremos este otro código (atención con el inicio, cierre y el espacio):
<b:if cond='data:blog.pageType == "item"'><iframe expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&layout=button_count&show_faces=true&width=100&action=like&font=arial&colorscheme=light"' scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:100px; height:px"></iframe></b:if>
Así de fácil es añadir el botón a nuestro blog. Realmente se puede añadir en cualquier parte del blog, depende donde peguemos el código de arriba, pero lo normal es pegarlo debajo de cada post.
Si observáis el código veréis valores de anchura (width), color (colorscheme) etc… Podéis modificar todos esos valores teniendo en cuenta lo siguiente:
href – Con la URL a compartir.
layout – Estilo del botón. Los valores que se le puede dar son: standard o button_count.
show_faces – Se muestra la foto de avatar de la persona a la que le gusta el artículo. Valores: true o false.
width – Anchura del iframe.
action – Texto que se muestra en el botón. Valores like o recommend.
font – Fuente que se utilizará.
colorscheme – Esquema de colores. Valores: light, dark o evil.
Os animo a que hagáis pruebas con los valores para que el botón quede realmente a vuestro gusto, eso sí, con la plantilla original bien guardada como ya os he dicho y os digo siempre.
Para cualquier duda ya sabéis, ¡preguntad sin vergüenza en los comentarios! Recuerda también leer Cómo integrar Twitter con Blogger y todos nuestros Tutoriales para Blogger!
[…] This post was mentioned on Twitter by senormunoz, Aleyda Solis, Angel Benito, Álvaro Paricio, Bloguismo and others. Bloguismo said: ¿Tenéis un blog en Blogger y queréis añadir el "Me gusta" de Facebook? Hoy os lo cuenta @alvaroprb : http://ow.ly/1DTiN […]
Hola Muchas gracias por el nuevo botón. la etiqueta width no la he modificado pero sí la etiqueta height, le he puesto 20 y ya me aparece bien.
Yo tengo puesto en el blog el widget de linkwithin. y el botón de me gusta me aparece por dejabo de éste. ¿Sería posible cambiarlo para que apareciera encima? Un saludo y otra vez gracias por la ayuda. Fernando.
no encuentro <div class=’post-footer-line post-footer-line-1′> lo he puesto detrás de <div class=’post-footer'′> y antes de
.
Y si me ha funcionado.
Gracias
Todo sería ir mirando en el archivo de la plantilla e ir moviendo el iframe del botón de Facebook. Si en la plantilla encuentras una línea que haga referencia a ese widget ponlo encima, si no como digo es ir probando.
Lo mejor es que lo hagas cuando no tengas mucho tráfico en el blog porque puede que de tanto mover en algún momento no se vea bien, y eso sí, con la plantilla original guardada siempre 🙂
Gracias Alvaro, habrá que probar como dices. Respecto al siguiente comentario de Antonio, me pasaba lo mismo. El problema es el carácter de los apóstrofes hay que poner el que está debajo del signo de interrogación(') (en mi teclado)
Saludos. Fernando.
¿Has expandido la plantilla de artilugios?
¿Y colocándolo donde dices se te instala bien el botón?
Si aun así no sale hay que tener en cuenta una cosa, en Blogger al poder meter casi cualquier tema se modifica la plantilla muchísimo. No todos los temas son iguales por desgracia.
Ya me dices al final si te sale o no 🙂
¿Has expandido la plantilla de artilugios?
¿Y colocándolo donde dices se te instala bien el botón?
Si aun así no sale hay que tener en cuenta una cosa, en Blogger al poder meter casi cualquier tema se modifica la plantilla muchísimo. No todos los temas son iguales por desgracia.
Ya me dices al final si te sale o no 🙂
Pues no para blogger, ya que ya no uso esa plataforma, pero el artículo me ha servido para motivarme y buscar cómo añadir el botón de “me gusta” a tufisio.net. Mientras más facilidades se den para que la gente comparta lo que escribes, mejor.
Gracias y un saludo 🙂
Gran post sobre un pequeño tip, Álvaro. Esta funcionalidad ha caído en gracia a la gente, es indudable. Facebook se anota un gran tanto en la botonería social de los blogs.
Saludos.
Gracias por el pos, como siempre muy instructivos; pero, ¿podríais ser tan paciente con este neófito?; es que, primero no comprendo qué dirección iría en href=, o si no se pondría nada… no sé…; y segundo, la fila que mencionáis aparece así:
Por lo que no sé si ponerlo debajo de esta fila o hacer un corte antes de <span. Saludos…
yo intente pegar el codigo en otra parte del blog pero no me funciona, mi blog esta en wordpress pero no me funciona. k hago???
Saludos amigo, felicitaciones por tus constantes aportes. Genial trabajo. Ese recuadro “actividad reciente” mi buen amigo, a cual plugin de Facebook se corresponde, ¿como lo consigo?
¡Muchas Gracias!!!!
Alvaro no puedo!! hago todo pero cuando coloco “vista previa” no aparece el boton.
En que me estoy equivocando?
Otra pregunta:
Para guardar la plantilla voy a “descargar plantilla completa”? y depues para restablecerle voy a “restablecer plantillas de artilugios a los valores predeterminados”?
Perdon por mi ignorancia!!!! y muchas gracias por la paciencia!!!
Saludos!!
Esta muy bien su consejo, pero cuando entro en facebook para poner ese boton, facebook me cobra por click 🙁 este boton es gratis o no?
Es gratis 🙂
hola, quería saber si lo puedo poner en mi blog personal, que está hecho en html y en un servidor contratado, es decir, he diseñado mi propio blog.
GRacias
¡Hola! La información me ha parecido muy útil, pero no me funciona en mi blog. Quizás sea porque tengo la plantilla bastante modificada y con muchos elementos añadidos. Hago tal cual describes, pero no puedo lograrlo. ¿Podrías ayudarme?
Muchas gracias por tu atención.
Un saludo
Hola!!!!!. Muy bueno!!!. Gracias y un saludo enorme!!. Estaría bueno saber a quíen “le gusta” nuestros post no? Ja!
Un gran saludo desde Buenos Aires!
Flavio.
Te cuento que he probado de poner el código en diferentes posiciones luego de la línea que mostrás en el post. No sé si debo agregar algún dato porque en la vista previa no aparece nada.
Gracias
gracias me funciono pero solo sale cuando se ve la entrada individualmente y no cuando están todas juntas!! de todas formas gracias muy buen aporte!!
quisiera suscribirme a tu blog pero la verdad donde colocó mi correo para hacerlo no encuetro =S gracias!
Hola, como hacer que aparezca le botón al ver el blog completo?
http://vjvich.blogspot.com/
ya que solo me lo muestra al entrar a cada una de las entradas, pero no al ver varias entradas por página
Añadir el botón de “Me gusta” de Facebook en Blogger http://t.co/TFK2sm8b vía @bloguismo_es
Añadir el botón de “Me gusta” de Facebook en Blogger http://t.co/L2Ibw42O vía @bloguismo_es
Añadir el botón de “Me gusta” de Facebook en Blogger http://t.co/kUiB6Fib vía @bloguismo_es
Añadir el botón de “Me gusta” de Facebook en Blogger http://t.co/SysvSQUr vía @bloguismo_es
Añadir el botón de “Me gusta” de Facebook en Blogger http://t.co/48bKKszi vía @bloguismo_es
Añadir el botón de “Me gusta” de Facebook en Blogger http://t.co/3oezTqJn vía @bloguismo_es
Añadir el botón de “Me gusta” de Facebook en Blogger http://t.co/prZoUp4T vía @bloguismo_es
Añadir el botón de “Me gusta” de Facebook en Blogger http://t.co/kUiB6Fib vía @bloguismo_es
Añadir el botón de “Me gusta” de Facebook en Blogger http://t.co/3oezTqJn vía @bloguismo_es
Añadir el botón de “Me gusta” de Facebook en Blogger http://t.co/TFK2sm8b vía @bloguismo_es