Tutorial: Colocar botón de twittear en blogger

Hola a todos

Vengo con otro tutorial sobre twitter.

Hay dos botones de Twitter que no pueden faltar en tu blog jamás,  el botón seguir y el de twittear una entrada.  Dos botones que se suele confundir mucho pero, primero os voy a explicar la diferencia entre ambos botones, y recordaros que el otro día os puse un post de como poner el botón de seguir en vuestros blogs, ver entrada. 
 
El botón seguir de Twitter suele aparecer en un lateral, y que a través de él, haciendo un click, pueden seguirte en twitter sin necesidad de buscarte.



Qué es el botón Twittear de Twitter

botón de seguir

El botón Twittear es el que se utiliza para compartir las entradas del Blog.

Un ejemplo del botón Twittear con contador en vertical

Blogger ofrece una botonera propia, donde incluye la mayoría de botones sociales, pero si os fijáis en la imágen de abajo, pasan bastante desapercibidos además de no poder configuarlos un poco a nuestro gusto.

Creo que la mejor opción es poner los nuestros propios, asi que, no me enrollo más y empecemos con el tutorial.

Para desactivar los botones que aparecen por defecto en Blogger, debes acceder a "Blogger > Diseño" y editar el gadget "Entradas del Blog", en la ventana emergente que te aparece busca la opción "Mostrar botones para compartir" y desmárcala.

Cómo poner el botón Twittear

1. Haz una copia de seguridad de tu plantilla
   Blogger > Plantilla > Crear/Restablecer copia de seguridad
2. Accede al código HTML de tu plantilla
   Blogger > Plantilla > Editar HTML
3. Copia este código

   <a class='twitter-share-button' data-count='vertical' data-lang='es' data-via='@fagrafics' expr:data-text='data:post.title' expr:data-url='data:post.canonicalUrl' href='http://twitter.com/share'>Twittear</a>

4. Pega el código en la zona donde quieras que aparezca el botón
1. Si quieres colocar el botón al final de las entradas
   Busca todas las apariciones de "post-footer-line post-footer-line-1" (mediante CTRL + F) y copia el código del punto 3 justo debajo de esa línea
2. Si vas a colocar el botón al principio de las entradas
   Busca todas las apariciones de "post-header-line" (CTRL + F) y copia el código del punto 3 justo debajo
5. Sustituye fagrafics por el nombre de tu cuenta de Twitter
6. Guarda la plantilla y visualiza el resultado

El código de ejemplo da por hecho que ya tenías el botón seguir  o algún otro gadget de Twitter. Si no te funciona, debes añadir este código justo debajo del código creado en el proceso anterior:
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>

¿Nos regalas un tweet?
Tweet to @FAGrafics