Introducción
Las Twitter Cards nos pueden ayudar mucho a la hora de compartir un link ya que gracias a ellas podemos hacer mas vistoso el tweet que enviamos a ojos de las personas que lleguen a ver nuestro tweet e incrementa las posibilidades de que interactúen con nuestro tweet y le den clic a el link compartido y así enviarlo a nuestro blog o página.
Concepto Básico
Podemos resumir que las Twitter Cards son diferentes maneras en las que un tweet con link se presenta dentro de Twitter.
Tipos de Twitter Cards
Resumen. En donde encontraremos el Titulo, Descripcion, Vista en Miniatura y la Cuenta de atribución.
Resumen con Imagen Grande. Similar a la de Resumen pero con una Imagen más Grande.
App. Para detallar una app para movil con link a descarga.
Reproductor. Para adjuntar un video/audio/multimedia.
En este link puedes ver más a detalle cada tipo de Twitter Card.
El tipo de Twitter Card que vamos a instalar es el de Resumen con Imagen Grande.
 |
| Post Relacionado |
1.Tienes que accesar a blogger y elegir en blog en donde quieres instalar el código para las Twitter Cards.
2.Elegir "Plantilla" y despues "Editar HTML".
Buscamos la etiqueta </head> y justo antes de la etiqueta insertamos el siguiente código:
 |
| Dar clic para ver en grande |
No te preocupes que el código te lo dejo mas abajo para que puedas copiar y pegar.
¿Cómo Modifico El Código Para Utilizarlo A Mis Necesidades?
En la primera parte del código (en la imagen) se muestra la un comentario que especifica que a partir de ahí hacia abajo inician el código de las Twitter Cards (este pedazo de código es opcional ya que solamente es un comentario).
La siguiente linea especifica el tipo de Twitter Card que vamos a querer, en este caso el de Resumen con Imagen Grande (summary_large_image)
La tercera y cuarta linea se especifica la cuenta en Twitter del sitio al que pertenece el link y la cuenta de la persona que escribió el post que estamos compartiendo. Como yo no tengo una cuenta aparte para éste blog (uso mi propia cuenta) la cuenta a especificar del sitio (twitter:site) es la misma que la del creador (twitter:creator). Estas 2 últimas lineas las puedes cambiar con tu cuenta de Twitter.
En la segunda parte del código se usa una etiqueta de condición de blogger para saber si el link que se esta compartiendo es el Index (la pagina principal del blog) o si es algún post u otra página.
Si es el index, lo que hace es poner como Titulo (en Twitter), el texto "Las Crónicas Del César". Como descripción (en Twitter), pone "No soy un adepto escribiendo, pero lo haré......". Pone una imagen para compartir que es ésta. Y en URL, pone la principal del blog. De aquí lo que puedes cambiar es el Titulo, la Descripción y la Imagen. La URL de tu blog la pone automáticamente.
Pero si no es el Index (por ejemplo una publicación o página estatica) hace lo siguiente:
Pone como URL la del post que estamos compartiendo. En titulo pone la del post que estamos compartiendo. Y en imagen pone la primera imagen que publicamos en nuestro post. De aquí no te recomiendo cambiar nada porque pone automáticamente la URL, Titulo e Imagen de tu publicación.
 |
| Dale clic para ver en grande |
Si tiene, pone como descripción (en Twitter) la descripción que pusiste a la hora de escribir un post que esta situado en la parte derecha de tu editor para escribir post (ver imagen aqui).
Si no tiene, pone una descripción que tu hayas puesto, en este caso yo puse una descripción genérica: "Mira el post completo. Si te gusta.......", lo puedes cambiar por tu propia descripción genérica para tus publicaciones.
 |
| Dale clic para ver en grande |
https://cards-dev.twitter.com/validator
Pegamos nuestra dirección del blog en la caja para validar. En nuestra dirección hay que cambiar .mx por .com y volverlo a validar para que sin importar cual compartamos (con .mx o .com) nos aparezcan las Twitter Cards en la timeline.
Esta es la vista previa del link en Twitter:
Y de un link en Twitter:
Código para copiar y pegar.
Referencias:
https://dev.twitter.com/cards/overview
http://blogger-hints-and-tips.blogspot.mx/2013/09/how-to-set-up-twitters-view-summary.html
Si te gusto el post, dale +1, Tuitealo, Like y Compartelo en tus redes sociales, de verdad me ayuda mucho. No olvides comentar en la sección de abajo.
Si te gusto el post, dale +1, Tuitealo, Like y Compartelo en tus redes sociales, de verdad me ayuda mucho. No olvides comentar en la sección de abajo.
