1. http://jonia-consulting.blogspot.com
www.joniaconsulting.com
Apuntes de Internet Marketing
Como añadir el botón
“me gusta”
en cada post de
Blogger

2. http://jonia-consulting.blogspot.com
www.joniaconsulting.com
Apuntes de Internet Marketing
Facebook agregó nuevos "plugins sociales" que se pueden
incorporar en cualquier sitio web, entre otras cosas, un botón de
"Me gusta" a cualquier anotación. Este botón esta presente en
todas las anotaciones publicadas en Facebook y ahora,
disponible para sitios externos.
¿Ventajas? La primera es conocer que contenidos le agradan
más a tus lectores y la segunda, que al pulsar en el botón, el
lector la esta compartiendo inmediatamente en su perfil de
Facebook y sin usar recursos propios.
Funcionamiento botón ME GUSTA
El botón es más bien un iframe con los siguientes parámetros:
• 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.

3. http://jonia-consulting.blogspot.com
www.joniaconsulting.com
Apuntes de Internet Marketing
• colorscheme – Esquema de colores. Valores: light,
dark o evil.
Estos valores se pueden cambiar directo en el código o usar el
formulario de personalización de Facebook, el resultado es el
mismo.
Por ejemplo para el blog de Jonia Consulting, el iframe sería:
<iframe src="http://www.facebook.com/plugins/like.php?href=http
%3A%2F%2Fjonia-

4. http://jonia-consulting.blogspot.com
www.joniaconsulting.com
Apuntes de Internet Marketing
consulting.blogspot.com&amp;layout=standard&amp;show_fa
ces=true&amp;width=450&amp;action=like&amp;colorscheme=li
ght&amp;height=80" scrolling="no" frameborder="0"
style="border:none; overflow:hidden; width:450px; height:80px;"
allowTransparency="true"></iframe>
El resultado sería éste.
Ó éste otro código:
<iframe src="http://www.facebook.com/plugins/like.php?href=http
%3A%2F%2Fjonia-
consulting.blogspot.com&amp;layout=button_count&amp;s
how_faces=true&amp;width=450&amp;action=like&amp;co
lorscheme=light&amp;height=21" scrolling="no"
frameborder="0" style="border:none; overflow:hidden;
width:450px; height:21px;"
allowTransparency="true"></iframe>

5. http://jonia-consulting.blogspot.com
www.joniaconsulting.com
Apuntes de Internet Marketing
Agregar botón "me gusta" a Blogger
1. Ir al código de la plantilla y expandir artilugios.
Home → Diseño → Edición de HTML → Expandir plantillas de
artilugios
2. Elegir el lugar a agregar el código. El lugar tradicional para
hacerlo en el post-footer, es decir, al pie de cada entrada,
entonces, se busca el código:
<div class='post-footer-line post-footer-line-1'>
Y abajo se agrega el siguiente código para tu blog, sustituyendo
lo destacado en rojo por el código generado al introducir tu URL
del blog en el formulario de personalización de FACEBOOK.
<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>
El resultado es un botón como el siguiente:

6. http://jonia-consulting.blogspot.com
www.joniaconsulting.com
Apuntes de Internet Marketing
Nota: Puede usarse post-footer-line-1 o cualquier otra en el
footer. El código a agregar puede modificarse con los
parámetros que se listaron en la parte de funcionamiento
Referencias:
http://blogandweb.com/wordpress/agregar-boton-me-gusta-blogger-wordpress/
http://www.bloguismo.com/tutoriales-para-blogger/anadir-el-boton-de-me-gusta-de-
facebook-en-blogger/

7. http://jonia-consulting.blogspot.com
www.joniaconsulting.com
Apuntes de Internet Marketing
Nota: Puede usarse post-footer-line-1 o cualquier otra en el
footer. El código a agregar puede modificarse con los
parámetros que se listaron en la parte de funcionamiento
Referencias:
http://blogandweb.com/wordpress/agregar-boton-me-gusta-blogger-wordpress/
http://www.bloguismo.com/tutoriales-para-blogger/anadir-el-boton-de-me-gusta-de-
facebook-en-blogger/