Implementando las etiquetas meta para Twitter

Las etiquetas meta para Twitter Card te permitirán controlar que contenido sera mostrado con los Tweets que enlacen contengan un enlace a tu sitio. Con un poco de suerte también atraerás más trafico, e incluso algún nuevo follower.

Para añadirlas tendrás que colocarlas entre las etiquetas <head> </head> dentro del código html.

Twitter te permite hasta cinco tipos de tarjetas o Twitter Cards: Summary, Product, Photo, Player y Gallery. Diseños acordes según la necesidad que tengamos.

En mi caso utilizaré el resumen o summary, ya que es la pensada para contenido basado en texto. Algunas de las etiquetas META serán comunes para todas las Twitter Card y otras solo para alguno de los diseños mencionados antes. Todas las etiquetas Meta empezaran con el prefijo twitter:.

  • twitter:card Establecera el tipo de diseño para nuestra Twitter Card (summary|video|photo|product|gallery).
  • twitter:url La URL que usara nuestra tarjeta.
  • twitter:site El usuario twitter del sitio web o del autor.
  • twitter:title En titulo que sera mostrado en la Twitter Card.
  • twitter:description La descripción que aparecera en la tarjeta.
  • twitter:creator El usuario twitter del creador del contenido.
  • twitter:image Una imagen representativa del contenido.

En mi caso quedarían de la siguiente forma.

<meta name="twitter:card" content="summary">
<meta name="twitter:url" content="http://www.cansants.com">
<meta name="twitter:domain" content="">
<meta name="twitter:site" content="@cansants">
<meta name="twitter:creator" content="@cansants">
<meta name="twitter:title" content="cansants.com Con el barrio a cuestas.">
<meta name="twitter:description" content="Con el barrio a cuestas.">
<meta name="twitter:image" content="https://cansants.com/img/twitter_cansants.jpg">

Puedes encontrar más información sobre las Twitter Card, ver la previa o incluso validarlas.