Tutorial Blogger: Botón oficial de Twitter en los posts de mi blog (Blogspot)

Es re-bonito el botón de Twitter, qué no? Blogger ya trae su propio botoncito para compartir por Twitter, pero la ventaja de este es que puedes saber cuántas personas le picaron al botón, y en general se ve más pro. Vamos a aprender a usarlo para un blog de blogger, es muy sencillo y no tienes que saber mucho, solo seguir estas instrucciones:

  • En el panel de administración de tu blog, ve a Diseño / Edición de HTML

01

  • Activa la opción "Expandir plantillas de artilugios” (sí suena horrible “artilugios” como traducción de “widgets”, pero yo no traduje esta cosa xD)

02

  • Busca (CTRL+F) este texto:

</head>

  • Exactamente antes de eso, pega este código:

<script src='http://platform.twitter.com/widgets.js' type='text/javascript'/>

  • Ahora busca (CTRL+F) este texto:

<data:post.body/>

  • Ya que tengas ubicado eso debes tomar una decisión: ¿Quieres poner el botón arriba del post o abajo?
  • Si lo quieres en la parte de arriba, pega este código justo antes del rollo de <data:post.body/> que acabamos de encontrar. Si lo quieres abajo, pégalo después:
<!-- boton twitter --> <div><a class='twitter-share-button' data-count='vertical' expr:data-text='data:post.title' expr:data-url='data:post.url' expr:data-counturl='data:post.url' href='http://twitter.com/share'>Tweet</a></div>
  • Hemos terminado :D

 

Si todo salió bien, dale Guardar Plantilla y tendrás un bonito botón de “Tweet” (como el que ves en este post).

03

Hay varias cosas que puedes cambiar y opciones para aprovechar, por ejemplo si quieres que sea una caja con números grandes cámbiale el atributo de data-count a vertical:

04

Si quieres configurar tu botón con más detalle, te recomiendo leer la documentación del mismo acá: Twitter Button, realmente es muy sencillo integrarlo a tu blog sobretodo si ya cuentas con nociones de HTML y CSS.

Prueba dándole Tweet a este post, para que veas que sí funciona y no te dije mentiras! xD

Espero que te haya sido de utilidad. Si no me da flojera pronto haré el mismo tutorial para el “Like” de Facebook (es un poco más de rollo pero no es para nada complicado).

2 comentarios:

El Autor dijo...

Gracias a la clase de internet entendí perfecto el tutorial, te quedó bien chido

GrumpyDad08 dijo...

Compañero, tengo el botón, me twitea el contenido, el título del post aparece en el contenido del post, se diria que todo va ok pero el data count no va ni para atras ... y por supuesto he añadido la expresion de data-counturl = .... desesperado ando.

Publicar un comentario