Buscar este blog

Tutorial: Colocar botón de twittear en blogger

22/11/16

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.

Botón Twittear de Twitter con contador
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?

Tutorial: Cómo poner el botón Seguir de Twitter en tu Blog

21/11/16

Si tienes un blog, debes conocer  que es muy importante estar también en las redes sociales para compartir los enlaces de las entradas que publicas en tu blog, y Twitter es una de las grandes sociales.
En esta entrada te diré como añadir el botón de seguir de Twitter. Hay que tener en cuenta que, al igual que la mayoría de redes sociales, Twitter ofrece un conjunto de "gadgets/widgets" para que podamos incluirlos en nuestro blog.


El que veremos en esta ocasión es el de que sigan nuestra cuenta, el que Twitter llama Follow Button. Mediante este botón, los usuarios podrán seguirte de forma sencilla desde tu blog.


Twitter - Follow @twitter


Paso 1: Creáte una cuenta de Twitter


Si ya tienes abierta una cuenta en Twitter, recuerda que tendrás un nombre de usuario del tipo @usuario, memorízalo y ve al paso 2. 



Si no tienes cuenta en Twitter, accede a www.twitter.com y selecciona la opción "Regístrate en Twitter", el proceso de registro es muy intuitivo y en unos minutos tendrás tu nueva cuenta de Twitter creada.

Paso 2: Elige el botón que más te guste
Twitter ofrece la posibilidad de personalizar el botón follow, mediante parámetros data que podemos añadir directamente en el código. Si no quieres complicaciones, elige el más que te guste de los que te muestro a continuación, con sus códigos tres opciones
Botón seguir de Twitter estándar
<a href="https://twitter.com/fagrafics" class="twitter-follow-button" data-show-count="false" data-lang="es">Seguir a @fagrafics</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script> 

Botón seguir  de Twitter con contador

<a href="https://twitter.com/fagrafics" class="twitter-follow-button" data-show-count="true" data-lang="es">Seguir a @fagrafics</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

 Botón seguir de Twitter grande

<a href="https://twitter.com/fagrafics" class="twitter-follow-button" data-show-count="false" data-lang="es" data-size="large">Seguir a @fagrafics</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

Paso 3: Coloca el botón seguir en tu blog


  1. En Blogger, elegimos la opción Diseño y desde aquí elegimos la opción Añadir un gadget
  2. Seleccionamos el gadget "HTML/Javascript"
  3. En contenido copia el código que hayas elegido del "Paso 1" y luego sustituye el nombre de la cuenta de Twitter por la tuya
  4. Guarda el gadget
  5. Mueve el gadget que acabas de añadir en la posición que desees
  6. Visualiza el blog

[descargar gratis] Plantilla para blogger ~ Navidad

18/11/16

Buenos días corazones

Al fin es viernes y seguimos en Dreaming Graphics regalándote cosas navideñas.

En este post os regalamos esta plantilla para blogger gratis.

Además de la plantilla os hemos incluido
- Cabecera editable
- Fuente usada para la cabecera
- Gadget "sobre mi"
- Gadget de las redes sociales (sólo tienes que colocar los enlaces a tus redes)

Además hemos añadido el poder comentar cada entrada vía facebook, para que la gente que no tenga gmail pueda comentaros igual.

Ver el blog en funcionamiento
Descargar


¿Nos regalas un tweet?


OFERTA PARA ESCRITORES

OFERTA PARA ESCRITORES
60 euros (Negociable tanto el precio como el pack)
Más información susana.dreamingraphics@gmail.com
Web/blog: www.dreamingraphics.es

CONTENIDO OFERTA
Diseño de portada, contraportada y lomo
Maquetación del libro
Diseño (y creación del blog en blogger, si hiciese falta)
Diseño de marcapaginas (incluye 100 impresos en papel de 300 gramos)
Diseño de tarjetas
Agenda 2017 a juego en papel

¿Nos regalas un tweet?