Esta web utiliza 'cookies' propias y de terceros para ofrecerte una mejor experiencia y servicio

Ok Más información

Mis Libros

Suscríbete para descargar gratuitamente el libro

Introduce tus datos y dale a enviar, se abrirá un mensaje informativo sobre tu suscripción en una página nueva, al volver a esta página tendrás el enlace a tu libro esperándote.

Acepto el Aviso Legal

¿Quieres recibir mis artículos para mejorar tu negocio?

Qué son las Twitter Cards y Cómo Crearlas para tu Web o Blog

Publicado el 24 de mayo de 2013 por Juan Merodio


Las Twitter Cards o tarjetas de twitter son un formato enriquecido para los tweets, que permite a modo vista previa mostrar información multimedia del mismo con título, resumen, autor e imagen, lo que lo hace más atractivo a la vista del usuario.

Existen varios formatos de Twitter Cards según las necesidades, hoy en día hay seis disponibles: resumen, producto, foto, resumen con imagen grande, reproductor y app:

Las Twitter Cards no sólo hacen más atractivo el tweet, sino que favorecen el branding de la marca que lanza el tweet ya que le da mayor visibilidad, y es visible tanto en formato escritorio como en formato móvil:

Cómo crear las Twitter Cards para tu web o blog

  • – Para crear las Twitter Cards debemos insertar unas etiquetas en el código de la web que puedes obtener directamente haciendo click en “Try it them” y seleccionando el formato de Twitter Card que quieres usar, pero esta opción sólo debe ser hecha por alguien que sepa de código HTML:
  • – La otra opción más sencilla si dispones de una web o blog hecha con WordPress es utilizar un plugin que cree e inserte automáticamente las etiquetas, y concretamente te recomiendo JM Twitter Cards, un plugin que realiza esta tarea. Tan sólo tienes que descargarlo e instalarlo en tu WordPress:
  • – Con el plugin ya instalado, es hora de volver a la página de Twitter para validarlo y que Twitter nos lo autorice, para ello entramos en https://dev.twitter.com/docs/cards/validation/validator y en la pestaña “Validate & Apply” debes introducir una url de tu web o blog y haciendo click en “Go” te dirá si es correcta para validar.
    De serlo verás una pantalla similar a la siguiente donde a la derecha te muestra una vista previa y debes clickar en “Request Approval”:
  • – El proceso de aprobación puede llevar unas semanas aunque en otras ocasiones tarda mucho menos:
  • – En cuanto esté aprobado recibirás un email confirmándote la activación:

Con esto ya tendrías configuradas tus Twitter Cards para que tus contenidos sean visibles en formato enriquecido.

¿Usabas ya esta funcionalidad de Twitter?¿Te parece interesante?

Esta entrada fue publicada en Redes Sociales y etiquetada como por

Curso OnlineIncrementa las ventas usando el marketing digital

Curso Online
Sólo estos días 40% de descuento
  • 10 horas de contenidos en vídeo
  • +1000 páginas con lecturas
  • Regalo de micro-auditoría digital

67 Comentarios para Qué son las Twitter Cards y Cómo Crearlas para tu Web o Blog

  1. Hola Juan,

    Probé otro plugin llamado Twitter Cards Meta, no funcionó, y además en los foros de desarrolladores del Twitter las respuestas son escuetas, por no decir inexistentes.

    Voy a probar con este plugin que recomiendas, que, por lo que veo a tí sí que te funciona.

    Un saludo y gracias por compartirlo.

    Albert Valero

  2. ¿Alguien de por aquí las ha probado ya? ¿Qué niveles de engagement tienen, aumentan los clicks?

    Sobre el papel parece una buena solución para las marcas o productos muy concretos.

    Entiendo que se trata de un servicio gratuito ¿no?

    Le daré un repaso, parece interesante. Gracias Juan!

  3. Hola Juan, me quedaron algunas dudas sobre este tema. Yo no sé usar códigos HTML ni blog en wordpress. En ese caso ¿qué debo hacer? Porque vi que las 2 vías que mencionas son esas. Buenos, cualquier cosa si ves que tengo una tercera opción me avisas porfa. Sino intentaré pedirle a un amigo que maneja HTML para que me eche una mano 😉 ¡Gracias de antemano!
    Saludos y feliz viernes 🙂 🙂

  4. Yo lo estoy intentando probar, pero aunque tengo cambiados los datos del plugin por los míos (mi cuenta de twitter, mi blog, mi foto, etc….) al intentar validarlo en twitter me aparecen los datos que aparecían por defecto (del creador del plugin)
    ¿alguna idea?

  5. Albert, a mi el otro tampoco me funciono, pero este sí, pruebalo porque es sencillo y fácil de instalar

  6. Luis, es gratuito el recurso, respecto a engagement todavía no tengo datos, pero en cuanto los consiga los comparto

  7. @powerjoha en ese caso lo mejor es que recurras a un amigo que use HTML, lo hará en un momento y será más sencillo

  8. Miguel Angel, que extraño, es como si no los hubiese cogido bien, prueba a desistalar y volver a instalar el plugin y meter los datos

  9. Muy interesante y con buen resultado, existe algún plugin para Blogger??. Gracias

  10. Óscar, para blogger hay alguna cosa pero quizá algo más liosa, te dejo el enalce al foto de Twitter donde se habla de ello: https://dev.twitter.com/discussions/9657

  11. Hola, Juan;

    ¿Y para blogger, cómo lo llevas? 😉 Espero impaciente…

  12. Muy bueno, creo que es una idea fantastica para utilizar con refuerzo visual, a mi me gusta mucho. Pinterest lanzo ayer algo parecido, los rich pins, los habeis visto. Juan, post ya!!

  13. Tengo dos blogs, en uno de ellos me aceptaron las twitter cards pero en el otro no. Voy a intentarlo de nuevo pero esta vez con el plugin para wordpress.
    Gracias Juan.

  14. Pepe , si he visto lo de Pinterest y ando probando, en breve comento

  15. Hola Juan! Una pregunta: ¿se pueden implementar en wordpress.com ? Ímagino que sólo te referirás a wordpress.org, no?

  16. Yo ya las he implementado en algunos de mis clientes, como por ejemplo en los tweets de @anre_decoracion. Creo q aumentarán algo el engagement y como recurso visual y complementario a la sencillez del tweet está muy bien.

    Como otras muchas veces la información clara y muy útil.
    Gracias y un saludo.

  17. Mª Luisa, en la verisón gratuita no te permite subir el plugin

  18. Estupendo, en apenas 20 minutos lo he activado. Y por cierto, Twitter me ha enviado el e-mail de confirmación inmediatamente.

    Gracias Juan, eres un crack explicando las cosas. Tenía este tema aparcado desde hace semanas porque no me aclaraba con otras fuentes, y tú lo has explicado perfectamente en este post.

  19. Pablo, me alegra saber que te ha sido útil 🙂

  20. Muchas gracias Juan. He instalado en mi web-blog twitter cards.
    ¡Suerte!

  21. He instalado el plugin, lo han autorizado, pero a partir de ahí, no noto ningún cambio ni en twitter, ni tampoco veo nada en el email (código html) o algo para instalar. O me he perdido de algo o creo que no he entendido la idea de la Twitter Card.

  22. Enrique, ahora lo que sucederá es que tus tweets serán visibles con la parte expandida que comentaba, lo que mejorará la visibilidad de los mismos

  23. Muchas gracias Juan por la aclaración :).

  24. Una pregunta. ¿Este plugin es icompatible con Shareholic? Una vez instalado, verificado y recibido e-mail de Twitter, no se aprecia ningún cambio al compartir el contenido del blog vía shareholic. ¡Gracias!

  25. Pablo, con Shareholic no te se decir pero si debería, estoy todavía haciendo pruebas sobre este tema

  26. Muy interesante el post Juan….me pongo a ello y te comento.

    Gracias por compartir siempre temas interesantes y prácticos!!!

    Un saludo.

  27. Hola Juan…

    Una pregunta, si tengo mi website en Joomla, podré instalar las Twitter Cards????

    Gracias por la ayuda,

    Saludos.

    Andres Moreno R

  28. andres, si se puede, pero debes hablar con algún programador para que las inserte o usar algún plugin que hay como este http://www.emren.net/projects/twitter-cards-plugin-for-joomla-2-5.html

  29. Hola Juan,

    En primer lugar darte la enhorabuena por los buenos artículos que haces. He probado las Twitter Cards en mi WordPress a través del plugin que nos has recomendado, pero me surge algunas dudas. Pueden que sera muy burro y sean muy básicas, pero no termino de entender algunas cosas:

    – El código que se genera son metas para el head. ¿Y para el body, para que se muestre la tarjeta? ¿Tiene que existir previamente un tweet embeb en la web para que estas metas lo enriquezcan?

    – El código que se genera es para una sola tarjeta, pero el plugin de WordPress posee una configuración propia. ¿Está es general al margen de las características propias de cada tarjeta?

    – ¿Estas tarjetas no se pueden usar en Twitter como tweets enriquecidos?

    Espero no resultar muy burro con estas preguntas, pero me gustaría entender bien el uso de estas tarjetas.

    Muchas gracias

  30. Hola Juan,

    Tras una mañana intensa, ya he captado la idea de las tarjetas de Twitter. Lo que no consigo es que se muestren las tarjetas en Twitter cuando publico el enlace, pese a que veo con la opción Inspeccionar elemento de Google Chrome que las metas están activadas. ¿Puede ser por el plugin de SEO de Yoast?

  31. Salvador, genial, si te fijas en tu timeline cuando están implementadas permite expandir el tweet y ver más info, si entras en mi twitter http://www.twitter.com/juanmerodio y en algún tweet que publiqué enlace a mi post poner “ver resumen” si le das podrás verlo, si no se te muestran y está correctamente implementado comprueba que twitter te ha enviado la confirmación, sino tienes que esperar hasta que lo haga

  32. Hola a todos,
    tengo una duda de concepto y estoy hecho un lio. A ver si me lo podeis explicar.
    He instalado el pluguin JM twitter Cards y le he introducido los datos que pide en los diferentes cajetines ( General, SEO, Options photo, etc ).
    Twitter ya respondió a la solicitud de validación.
    Cuando en https://dev.twitter.com/docs/cards/validation/validator hago la validación de la card lo hace casi correcto ( la imagen no aparece ) .
    Las dudas son : donde se publicarà ? ( en mi blog?, en mi cuenta de twitter ? )
    Voy perdido !!
    Un abrazo y gracias .
    Xavier

  33. Excelente post, pero tengo una duda. Quiero hacer esto para uno de mis clientes y, parecerá tonto, pero ¿en los campos: twitter:title y twitter:description debo colocar la descripción de la página web o debo cambiarlo con cada noticia que aparezca?
    Como dije, parecerá tonot, pero en verdad no sé qué hacer en ese caso.
    Gracias por la ayuda.

  34. @curiosa, no hay pregunta tonta 😉 realmente esos campos deben ser dinámicos, es decir, ponerlo de tal forma que se actualicen de manera automática con cada noticia que aparezca

  35. Xavier, la tweet enriquecido se publica en twitter.com en tu timeline, los tweets que enlacen a tu web tendrán la opción ver resumen y al clickar verás que se amplía la info

  36. Oh, creo que no me va a decir. No manejo la págona web directamente y son muchas noticias al día. Gracias por responder.
    Un abrazo.

  37. Muchas gracias por compartir el plugin de las Twitter Cards ya que me funciono a la primera

  38. Vaya no conocía esta nueva función de twitter, lo bueno es que explicas muy bien los pasos a seguir, ya instale el plugin y pedí que me dieran de alta.
    Gracias Juan y nos seguimos leyendo.

  39. Excelente post!!!. Esperando la aprobación!!!! 😀

  40. Juan, excelente artículo, estaba buscando cómo se usaban, sin embargo tengo una duda.

    No uso WordPress, uso joomla, sabes si por cada nuevo artículo debo pegar el código de la tweet Card o cuando se active, se activa para todas las URLs de mi web.?

  41. Jorge, lo puedes programar para que se active para todas las url´s, pero para ello es mejor que un desarrollador web te lo prepare para ello

  42. Genial el artículo… pasé media mañana calentándome la cabeza leyendo otros artículos al respecto pero hasta llegar a tu paso a paso no lo he conseguido, ahora si que tengo mi Twitter card en @MaquinistaX Hurra!!!… nuevamente gracias…

  43. Muy interesante!! Estoy empezando con mi blog y toda ayuda es buena para ir aprendiendo. Estoy esperando que me confirme twiter, espero conseguir mi twiter card en @marthadomo. muchas gracias!!

  44. Excelente post, pero tengo una duda. Quiero hacer esto para uno de mis clientes y, parecerá tonto, pero ¿en los campos: twitter:

  45. En los campos twitter deben ir la etiquetas, pero para hacer esto lo mejor es que hables con un desarrollador

  46. Buenas noches, Juan:
    una duda, en caso de que utilices la 2ª opción (con el plugin JM Twitter cards),¿ una vez que sea activado por primera vez, la puedes utilizar cuantas veces quieras para tuitear desde ese blog, o debes volver a repetir la operación con cada post que quieras tuitear?
    Un saludo y muchas gracias

  47. Juan, ya se quedaría configurado de manera automática con cada post, lo que sucede es que a veces al principio necesita algún ajuste el plugin

  48. Hola, he conseguido crear una Twitter Card, la de sumario, pero he visto que hay otra que incluye foto y ahora no sé cómo cambiarla. ¿Es posible?, ¿Me podrías ayudar?

    Muchas gracias y felicidades por el blog

  49. Juan, esa es la card multimedia, pero dependerá del plugin, yo lo monté con los desarrolladores y no sabría decirte esa parte

  50. Las Twitter Cards solo se usan si haces publicidad en Twitter o cualquier usuario de Twitter que tenga un blog o website puede hacerlo? Gracias!

  51. Isabel, puedes hacerlo en el blog para cuando lo compartas en Twitter que se vean los tweets con más información

  52. ¿Habrá un plugin para instalarlo en otro tipo de blogs que no sea wordpress? o sólo es viable en wordpress… Saludos

  53. Ivan, plugin que yo sepa no pero se puede configurar directamente por programación en cualquier blog

  54. Muchas gracias por la entrada muy clarita y facil de seguir. Ahora, yo ya he validado mi card, pero, como hago para publicar algo y que se vea en ese formato? compartiendo desde el blog? Desde twitter?
    Gracias de antemano

  55. Hola Juan, gracias por tu post. Tengo una duda. Uso wordpress y tengo el plugin instalado, deseo saber si es posible ver las twitter cards directamente en el timeline sin necesidad de abrir el tweet y de que manera puedo configurar para que se visualice así. Por el momento mis tweets en el timetime se ven poco atractivos solamente con el link, pero al abrir es una maravilla. Gracias por su ayuda

  56. Denisse, si lo que hace es mostrarlo expandido en el timeline, de todas formas esto lleva un tema técnico de configuración, siempre es bueno que un programador te lo revise y configure

  57. Hola Juan, una pregunta: Hoy me puse a estudiar Analitycs de Twitter y estuve mirando las Cards, pero no entiendo una cosa, yo jamás las he usado y el informe me dice que yo he utilizado Cards tipo Summary cuando he viralizado dos posts de mi blog, y esto no es cierto, lo único que he hecho es escribir unos tweets con enlaces a esos posts y en dos de ellos si que use Click to Tweet, pero las Cards como tal no. ¿Sabes a qué se debe?

  58. Laura Elena, puede ser que tengas las cards automatizadas en los posts del blog para que se publiquen así, hay muchos tipos de cards

  59. Hola,
    quería decir que os falta por poner la card de galería.

    Un saludo

  60. Hola, me gustaría saber para realizar una twitter card hay que invertir en twitter?

    Gracias

  61. Muchas gracias por este post!!!

    Ya tengo configurado el pluging que nos recomiendas, aunque también pensaba que la imágen se vería directamente sin tener que abrir el tweet.

    Un saludo fotográfico Juan.

  62. Hola Juan, antes de nada felicitarte por tu web, y la idea del audio me ha encantado! me gustaría que se pusiera de moda es mucho más cómodo que estar leyendo.
    Pero bueno mi duda es, esto funciona sólo cuando tienes el blog de WordPress de pago o bueno es que instala uno mismo en su hosting? o para la versión simple también lo hay?

    Gracias un saludo!

  63. Juan, un saludo desde México y una felicitación por tu blog.
    Sé que WordPress es la plataforma por excelencia para crear blogs y compartir contenido, pero tal vez entre tus lectores pueda interesarles implementar en blogs de Joomla, la función de Twitter Cards.
    Justamente, buscando un plugin de Joomla que cumpliera esa función, me topé con que no había una solución rápida y simple, sólo una opción de pago, por lo que trabajé en crear un plugin gratuito para dicha tarea.
    Si me permites la comparto para quien le pueda ser de utilidad: https://www.fernandomartinez.mx/recursos/twitter-summary-card-for-joomla-articles-plugin
    Saludos cordiales.

  64. Hola Juan

    En primer lugar enhorabuena por tu web!!!

    Estoy intentando compartir post de wordpress con una imagen “abierta” en mi cuenta de twitter ,he seguido este artículo, instalado el plugin y veo que a fecha de hoy han cambiado algunas pantallas como la de card validator y no consigo seguirlas.

    Sabes de algún articulo mas actualizado

  65. Yo las active recientemente y perfecto pero de un dia para otro dejaron de aparecer, alquien se encontro con una situacion similar? estoy utilizando plugin by yoast

  66. Hola, tengo un ecommerce hecho con wobizz y no sé cómo hacer las twitter cards. Me puedes ayudar? Gracias!

Deja un comentario