miércoles, 9 de febrero de 2011

Poner botón "Me Gusta" en tu blog

Hola! Os dejo un tutorial sobre cómo colocar el botón de "Me gusta" de Facebook en vuestros blogs de blogger :) Es muy sencillito, sólo tenéis que seguir los pasos del vídeo.


**Os dejo aquí abajo un enlace de descarga con los códigos html que necesitáis:




  • Primero vamos a Diseño > Edición de HTMLExpandimos los artilugios > y con la ayuda de (Ctrl + F) buscamos la siguiente línea de código:
<div class='post-footer-line post-footer-line-1'>



  • Justo después pegamos el siguiente código:
<b:if cond='data:blog.pageType == &quot;item&quot;'>

<iframe expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&amp;layout=button_count&amp;show_faces=true&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light"' scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:100px; height:px"></iframe>

</b:if>




  • Guardamos los cambios y listo, ahora haceemos click en el título de una entrada de nuestro blog y veremos al final que nos aparece el pequeño botón de Facebook "Me gusta".

*Parámetros a tomar en cuenta:
  • href – Con la URL a compartir.
  • layout – Estilo del botón. Valores: standard o button_count.
  • show_faces – Muestra o no el avatar de quienes del gusta la anotación. Valores: true o false.
  • width – Ancho del iframe.
  • action – Texto del botón. Valores like o recommend.
  • font – Fuente a utilizar.
  • colorscheme – Esquema de colores. Valores: light, dark o evil.
Los valores se pueden cambiar en el código de arriba o directamente puedes utilizar la página oficial de desarrolladores de facebook, cuyo link os dejo justo aquí abajo! 





*PÁGINA DE FACEBOOK para obtener vuestro propio código: Facebook Developers (Desarrolladores de Facebook)



PD: Os dejo por aquí los enlaces de los canales que recomendé ^^

Canal de Youtube de IF0N

Esta entrada es:

26 comentarios:

Hola, he intentado poner el botón de "me gusta" y me dice:

No se ha podido analizar su plantilla, porque no está bien formada. Asegúrese de que todos los elementos XML se han cerrado correctamente.

No sé si tiene algo que ver con los espacios y las comillas, yo creo que he seguido todos los pasos igual que en el tutorial, muy útil por cierto, bueno a ver si tú me puedes ayudar, gracias y un saludo, me gusta mucho tu blog ^^

amparo, pues sin verlo delante no sé decirte cuál es el fallo exactamente... Bueno está claro que el fallo ya te lo dice (la plantilla está mal formada)respecto a los elementos XML o sea, que parece que algún código de tu plantilla está mal... Es una de blogger o es echa por ti o por alguien? Tienes que fijarte en cuál es el posible código que esté mal y corregirlo y luego deberías de poder poner el código del botón "Me gusta" sin problemas. Esto del html es un rollo porque un punto, coma o comilla que esté mal puesta te lo deshace todo D Fíjate bien en eso...

gracias por el tuto!

besotes!

no me sale el primer codigo.

Jamal: Aunque no te salga en la entrada sale en el vídeo xD En caso de apuro lo pausabas y lo escribías a mano, que es un código pequeño. Lo escribo aquí (pero le falta al principio el "<" y al final también el ">") es que entero no me deja pegarlo, no se puede poner html en los comentarios! Corrígelo.

div class="'post-footer-line"

Espero que te sirva. Saludos!

Me ocurre lo mismo que a Amparo... mi plantilla es de las nuevas, el modelo simple, tendrá algo que ver? es que lo he intentado mil veces y nada.. cabe la posibilidad que este mal copiado??
Un beso y muchas gracias por tu blog!!

buenisimo tuto..pro no m funca...;( creo q m pasa como a varios mas.. me sale este mensaje >> No se ha podido analizar su plantilla, porque no está bien formada. Asegúrese de que todos los elementos XML se han cerrado correctamente.
Mensaje de error de XML: The reference to entity "layout" must end with the ';' delimiter.//
cress que sea un problema de compatibilidad con la plantilla..?¡ espero tu ayuda..;)

gente aca les dejo este enlace donde se explica paso por paso con imagenes como colocar el boton me gusta.
http://enteratedetodounpoco.blogspot.com/2011/04/como-poner-el-boton-me-gusta-en-tu-blog.html#more

como te he puesto por algún lao, el tuto estámuy bien, a mí al principio me ha pasao como a muchos de los q escriben aquí, que les decía ese mensaje del mensaje de error.
me ido a la pag. de facebook donde se genera tb el código y ahí me ha funcionao (no se xk, ya q he exo lo mismo que antes pero con ese código) lo que me pasa ahora es que en mi perfil de facebook al darle al "me gusta" no pone la entrada que me gusta, si no, el blog da = la entrada en la que haya picado el "me gusta" que aparece el blog
¿esto se puede modificar de alguna forma?
Saludos

A. G. Colomina pues habría que ver el código html porque el truco está ahí... Pero la verdad no sé que habría que añadirle o modificarle para que te slaga en enlace de la entrada y no del blog... Saludos!

Hola me he fijado en el video y los codigos HTML que pusiste para copiar y pegar no coinciden.
De todas formas muchas gracias por los tutoriales son estupendos

Hola, pues sigo vuestros tutoriales (casi todos) te tengo suscrito en youtube (egpch), y al igual que amparo me sale el mismo error, lo he intentado muchas veces ya de diferentes formas. tal parece que existe algún error ojala puedas corregirlo....

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!!

me encanta tu blog tiene cosas super interesantes lo malo que no puedo hacer nada pues los archivos esstaban en www.megaupload.com

hola disculpa me gustaria saber como le haces para poner el boton me gusta como lo tienes en esta pagina ala derecha , que cuando mueves la pantalla hacia arriba o asia abajo el boton camina como le hago ?

Genial!!! ha sido el único tutorial que me ha servido, muy bien explicado!!

hola, muy buen tutorial, felicidades, me ayudaron un monton en creear mi pagina, solo una pregunta, podrias decirme como hago para poner el boton me gusta que siga el recorrido de la pagina?, asi como lo tienes, es dcir, ME GUSTA sigue la pagina, como el de la imagen flotante, te agradeceria si me ayudas, chau

Hola tu tutorial es muy bueno pero no se porq no funciona con mi plantilla ya lointnt un millon de veces y si se llega a guardar los cambios, no me sale ningun mensaje ni nada pero cando veo el blog no hay nada porfa ayudam porq ya m recorri todos los tutoriales al rspcto y ninguno funciona... es mi plantilla o q??

Tu codigo no funciona cariño... A mi tampoco me sale.. Muy bien explicado pero el codigo esta mal¡¡¡...

HOLA LINDA.. BUEN TUTORIAL PERO NO APARECE EL BOTN, SEGUI TODOS TUS PASOS PERO NO ME FUNCIONA... GRACIAS..

Hola preciosa... tu codigo si funciona, pero depende de la plantilla y se visualiza cuando vemos entrada por entrada y no archivo de blog...

Mi querida Amiga este tutorial esta muy bueno....pero no se que pasa he seguido al pie de la letra lo que dices y no logro colocar el cuadro de me gusta en mi blogger...

si me funciono, muchas gracias!! te lo agradesco!! :D Si quieren pueden ver como me quedo en www.cocinandoconwendy.com y de paso me visitan... saludos! :)

he echo todo lo reconedado epro ha cambiado el blog pero pues igual encontre el enlace coloque mi propio like k sake como lo enseñas y pues ni asi amia na no sale a k se deve

muy bueno el tutorial , saludos

Genial el tutorial, pero en el nuevo diseño de blogger no aparece la casilla de expandir artilugios, ¿cómo lo hago? :(

Publicar un comentario en la entrada