Todo lo que tienes que saber de las Twitter cards y wordpress

Seguro que lo has visto mil veces en redes sociales y no sabes ni cómo se llaman y tampoco conoces cómo se generan: son los formatos enriquecidos de urls que permiten que, una vez tengas configurada tu web, cada vez que compartas o compartan uno de tus post aparezca automáticamente en redes sociales una especie de vista previa que incluye un titular, su resumen y una imagen.

Twitter card
Esto es un tuit enriquecido

En Twitter se llaman Cards,  Twitter Cards

No me voy a entretener explicándote que las hay de distintas clases porque lo normal es que quieras para tu web las que tiene todo el mundo… 

Si tienes conocimientos avanzados utiliza código. Solo tienes que incorporar  unas líneas en el <head> de tu web. Googlea. Hay 1000 páginas que están compartiendo este código y que explican como personalizarlo. Con ese código le dirás a las redes sociales que elementos y contenidos de tu post tienen que recoger cuando se compartan. 

En el repositorio de plugins de WordPress encontrarás alternativas como JM Twitter, Open Graph for Facebook, Google+ and Twitter Card Tags … para hacerlo sin esfuerzo. En esta mini entrada te voy a enseñar como hacerlo con Yoast SEO, que es un pluging que muy probablemente ya tienes instalado y que lo resuelve este asunto muy bien y sin complicaciones…

Busca en tu escritorio el botón de Y SEO y pulsa Social. En la pestaña de Twitter activa la opción de “meta datos de tarjeta de Twitter” y selecciona en el desplegable del tipo de tarjeta predeterminada a utilizar Resumen con imagen grande.  Guarda los cambios.

En esta sección de configuración puedes configurar también los formatos enriquecidos en Facebook que son metadatos Open Graph. También los lee Pinterest. Yoast te permite además dejar fija una imagen de tu web que Facebook utilizará siempre que el post compartido no tenga asignada ninguna. Esto es muy útil si como yo andas a mil cosas… Del mal, el menos. Facebook no se inventará que imagen incluir cuando se comparta uno de tus artículos… 

Y ya está. No tienes que configurar nada más…

Antes de lanzarte a publicar cada uno de tus post y después de redactar el Título SEO (si quieres cambiarlo) y la Meta Descripción (si no sabes de qué estoy hablando invierte ahora mismo media hora de tu tiempo en conocer como funciona Yoast), visita la opción de Social y haz los cambios que consideres interesantes en los títulos, descripciones o imagen destacada en Twitter y Facebook. Si no haces cambios. utilizarán el título y la Metadescripción de tu post. 

Sobre las imágenes adecuadas que debes utilizar en tus Twitter cards…

Ya habrás visto (y sufrido) que cada red social recomienda un tamaño y formato de imagen distinto: a Instagram le gustan más las cuadradas. A Twitter y Facebook, rectangulares. La proporción en Twitter 2:1 tamaño mínimo 1024 x 512 píxeles y en Facebook 2:1 y pico… mínimo 1200 por 630 píxeles.

Yo te cuento como lo hago. Seguro que me puedes ayudar proponiéndome una manera distinta de resolverlo porque yo, por defectom preparo para cada uno de mis post una imagen de 900×472 px.

Si. Lo sé. Estas medidas son más pequeñas que las recomendadas… Ya te contaré el motivo tonto por el que lo hago así.

Y suelo emplear la imagen pensada para la Twitter card como imagen destacada del post siempre que el theme o la estética de la web lo permita. Y si no es posible,  la integro en el contenido. Y si no es conveniente, procuro acordarme de asignarla tal y como puedes hacer desde Yoast.

Ojo: Facebook y Twitter suelen recurrir, si no les dices nada, a la primera imagen que encuentran en tu contenido. La que aparece más arriba…

Y no tiene más. 

Si quieres confirmar que todo está bien puedes acercarte al “Validador” oficial de Twitter cards. Te lo dejo aquí enlazado. Si todo va bien te aparecerá algo así al incluir la url de tus post…

Twitter validator

PD. Esta post está editado íntegramente con Gutemberg y es mi primera vez…

Deja un comentario