Cómo añadir tarjetas X (Twitter) a tu página web (guía paso a paso)

Si estás trabajando para hacer crecer tu negocio, tu blog o tu presencia en Internet, probablemente utilices las redes sociales, y es muy probable que X (Twitter) forme parte de ellas.

Como especialista en marketing digital, sé que conseguir que tu contenido destaque en plataformas como X (Twitter) es un objetivo constante.

Cuando compartes un enlace a tu página web en X (Twitter), quieres que destaque y capte la atención de la gente. Ahí es donde entran en juego las «X Cards» (Twitter Cards). Estas transforman los enlaces habituales de tus publicaciones en X en vistas previas enriquecidas, a menudo con imágenes, títulos y descripciones.

Si quieres que los enlaces a tu página web en X (Twitter) sean más eficaces y visualmente atractivos, estás en el lugar adecuado.

En esta guía paso a paso, te mostraré exactamente cómo añadir tarjetas de X (Twitter) a tu página web. Te explicaré el sencillo proceso que he seguido para configurar las tarjetas de X (Twitter) en WordPress, para que puedas sacar el máximo partido a cada enlace web que compartas en X (Twitter).

En este artículo

¿Por qué utilizar las tarjetas X (Twitter) para tu página web?

Si quieres llegar a mucha gente nueva para tu marca, X (Twitter) puede ser un lugar fantástico.

Al fin y al cabo, según nuestro estudio sobre las estadísticas del marketing en redes sociales, X (Twitter) cuenta con más de 330 millones de usuarios, por lo que es una plataforma de redes sociales enorme con muchísimos clientes potenciales.

Pero dar los primeros pasos en X (Twitter) puede resultar complicado, sobre todo si tu marca aún no cuenta con muchos seguidores en las redes sociales.

Una forma sencilla y eficaz de hacerlo es añadir tarjetas de X (Twitter) a tu página web. De este modo, los visitantes de tu página web podrán ver fácilmente tus publicaciones en X y seguirte.

Aquí tienes algunas formas más de empezar a utilizar las X (Twitter) Cards en tu página web:

• Al incluir publicaciones relevantes de X, podrás captar la atención de los usuarios y mantenerlos interesados en tu página web.
• Puedes compartir X publicaciones con las últimas noticias y comunicados sobre tu marca e informar fácilmente a tus visitantes.
• Mostrar tu cronología de X (Twitter) también indica a los demás que publicas activamente en X (Twitter), lo que significa que es probable que se pongan en contacto contigo a través de esa red social. Además, esto te ayuda a conseguir más comparticiones.
• Si quieres aumentar tus ventas, puedes utilizar las tarjetas de X (Twitter) para incluir reseñas de tus productos y convencer a más gente de que compre.

Y eso es solo el principio. Las tarjetas X (Twitter) pueden ser una forma fantástica de iniciarse en el marketing en redes sociales, captar la atención de tus seguidores y hacer crecer tu negocio.

Veamos cuál es la forma más sencilla de empezar a mostrar contenido de X (Twitter) en tu página web.

Cómo añadir tarjetas X (Twitter) a tu página web (de forma sencilla)

Si quieres mostrar las «X Cards» (de Twitter) a los visitantes de tu página web, la mejor forma de hacerlo es utilizando un plugin de WordPress.

De esta forma, puedes insertar todo el contenido de X (Twitter) que quieras, sin necesidad alguna de programar.

Y el mejor complemento para mostrar X publicaciones en tu página web es X (Twitter) Feed Pro.

Con este complemento, podrás añadir tarjetas X (Twitter) a tu página web con facilidad y empezar a interactuar con tus visitantes en un abrir y cerrar de ojos.

X (Twitter) Feed Pro es el mejor plugin de X (Twitter) Feed para WordPress. Está diseñado para facilitar la visualización de tu atractivo contenido de X (Twitter) y mantener el interés de los visitantes de tu sitio web en tu presencia en las redes sociales, complementando tus esfuerzos por mejorar tu estrategia en X (Twitter), como el uso de las X (Twitter) Cards.

Solo necesitas unos pocos clics para crear, personalizar e incrustar un feed de tarjetas de X (Twitter) en tu página web.

Al igual que configurar las tarjetas de X (Twitter) es muy sencillo, empezar a utilizar X (Twitter) Feed Pro es rápido y fácil. En ninguno de los dos casos se necesita saber programar.

Además, tienes un montón de opciones en cuanto al tipo de contenido de X (Twitter) que quieras mostrar.

Puedes mostrar publicaciones de X en los muros de los usuarios, incrustar los hashtags de X (Twitter) que elijas, mostrar resultados de búsqueda de X (Twitter) y mucho más.

¿Lo mejor de todo? Tus tarjetas de X (Twitter) se adaptarán automáticamente al diseño de tu página web gracias al plugin. De este modo, el contenido de X (Twitter) encajará a la perfección con tu imagen de marca.

Una cosa que me gusta mucho de X (Twitter) Feed Pro es su herramienta de personalización visual del feed.

Te permite personalizar fácilmente el aspecto de tu feed de X (Twitter) y el contenido que muestra, lo que te da control sobre la integración de X (Twitter) en tu página web, del mismo modo que controlas el aspecto de tus enlaces con las tarjetas de X (Twitter).

En unos pocos clics, puedes configurar el diseño, la combinación de colores, el diseño de los botones, el estilo de la cabecera y mucho más.

Además, este plugin cuenta con un equipo de expertos en WordPress que siempre están dispuestos a ayudarte.

Como puedes ver, X (Twitter) Feed Pro es, sin duda, el mejor complemento para ayudarte a integrar contenido de X (Twitter) en tu página web.

De hecho, algunas de las marcas más importantes del mundo utilizan Smash Balloon para integrar contenidos de redes sociales en sus sitios web.

¿Estás listo para añadir tarjetas de X (Twitter) a tu página web? Consigue aquí tu copia de X (Twitter) Feed Pro.

Dicho esto, veamos cómo puedes utilizar el plugin para añadir tarjetas X (Twitter) a tu página web.

Paso 1: Descarga el complemento X (Twitter) Feed Pro

Para empezar, hazte con tu copia del plugin X (Twitter) Feed Pro y descárgala en tu ordenador.

Después de eso, sólo tiene que instalar y activar el plugin en su sitio web.

Si quieres un poco de ayuda con eso, echa un vistazo a este tutorial sobre cómo instalar un plugin de WordPress paso a paso.

Una vez que haya instalado y activado el plugin, puede continuar con el paso 2 a continuación.

Paso 2: Crear un nuevo feed de X (Twitter)

Ahora que tu plugin ya está listo, puedes utilizarlo para crear un nuevo feed de X (Twitter) en tu página web.

Con ese feed, puedes mostrar un montón de tarjetas de X (Twitter) a la vez.

Desde tu panel de control, ve al menú «X (Twitter) Feed» » «Todos los feeds» para empezar.

Ahora cree un nuevo feed haciendo clic en el botón Añadir nuevo .

A continuación, puedes elegir el tipo de contenido de X (Twitter) que quieres mostrar en tus tarjetas. Estas son las opciones entre las que puedes elegir:

• Cronología de usuario: Incrusta una cronología de X (Twitter) en tu página web
• Hashtag: Mostrar X publicaciones con el hashtag seleccionado
• Cronología de la página de inicio : Mostrar las X publicaciones de tu página de inicio
• Búsqueda: Elige un término de búsqueda e incluye X publicaciones que contengan ese término
• Menciones: Mostrar X publicaciones en las que se haya etiquetado tu perfil
• Listas: Incrusta listas de X (Twitter) en tu página web

Seleccione la opción que prefiera de esta lista y pulse el botón Siguiente .

Para este ejemplo, utilizaremos un tipo de feed de línea de tiempo de usuario.

Como puedes ver, con este complemento puedes crear un feed de X (Twitter) con solo unos clics,

En el paso 3, puedes conectar este feed a X (Twitter) para que se puedan mostrar las tarjetas de X (Twitter) en tu página web.

Paso 3: Conecta tu cuenta X (Twitter)

Para insertar tarjetas de X (Twitter), puedes vincular este nuevo feed a tu cuenta de X (Twitter).

Para ello, haz clic en el botón Conectar para empezar.

A continuación, el complemento abrirá X (Twitter) para que puedas completar la conexión de tu cuenta. Para ello, basta con que le concedas acceso de solo lectura al complemento.

De esta forma, tu cuenta de X (Twitter) estará totalmente segura, ya que el complemento solo puede ver la información de X (Twitter) y no podrá realizar ningún cambio en absoluto.

Para vincular tu cuenta de X (Twitter), haz clic aquí en «Autorizar aplicación ».

Ahora que ya has conectado tu cuenta de X (Twitter), es el momento de añadir la fuente.

La fuente puede ser el perfil de X (Twitter), un hashtag, una lista, un término de búsqueda o contenido personalizado de X (Twitter) que quieras mostrar en tu página web.

Aquí hemos añadido el perfil de @starbucks en X (Twitter) como fuente. De este modo, se mostrarán las tarjetas de X (Twitter) del perfil de ese usuario.

Tras introducir la fuente en la ventana emergente, pulse el botón Siguiente .

Con esto, ya puedes pasar al paso 4 y personalizar el aspecto de tus X (Twitter) Cards en tu página web.

Paso 4: Personaliza tu feed de X (Twitter)

Para empezar, puedes optar por importar un diseño ya creado para tus tarjetas X (Twitter). Estas son las seis opciones entre las que puedes elegir:

• Por defecto
• Tarjetas de albañilería
• Carrusel simple
• Tarjetas sencillas
• Carrusel de escaparates
• Última publicación de X
• Widget

Después de seleccionar la plantilla, haga clic en Siguiente para continuar.

Una vez hecho esto, X (Twitter) Feed Pro te redirigirá al editor de feeds en directo. Desde aquí, podrás modificar el diseño, los colores, el diseño de los botones, la ventana emergente, el diseño del encabezado y mucho más para tus tarjetas de X (Twitter).

A la derecha encontrarás una vista previa en directo que muestra cómo se verán las X (Twitter) Cards en tu página web.

Para empezar a personalizar tu página web, puedes modificar el diseño de las tarjetas X (Twitter) que aparecen en ella.

Para ello, haga clic en la opción Feed Layout.

A continuación, puedes elegir entre tres diseños para tus tarjetas X (Twitter): «Lista», «Masonry» y «Carrusel».

Veámoslos a continuación:

Con el diseño de lista, puedes mostrar tus X (Twitter) Cards en una sola columna, igual que en la página web oficial de X (Twitter).

De esta forma, cada tarjeta X (Twitter) se ve claramente en tu página web.

A continuación, tienes el diseño en mosaico , que permite mostrar las «X Cards» (de Twitter) en varias columnas.

Es una forma estupenda de mostrar un montón de tarjetas de X (Twitter) a la vez.

También puedes elegir el diseño de carrusel e integrar una presentación de diapositivas de tarjetas X (Twitter) en tu página web.

Este diseño puede ayudarle a hacer que su sitio web sea aún más interactivo.

Una vez que hayas seleccionado el diseño de tu feed de X (Twitter), haz clic en el botón «Guardar» situado en la parte superior.

A continuación, puedes seguir configurando el diseño de tu feed de X (Twitter) haciendo clic en el botón «Personalizar» situado en la parte superior.

Ahora puedes utilizar el editor de feeds en directo para cambiar los colores de tu feed de X (Twitter).

Haga clic en la opción Combinación de colores de la izquierda para empezar.

Para cambiar los colores, sólo tienes que elegir entre 4 esquemas de color diferentes aquí:

• Heredar del tema: Copiar los colores de su tema de WordPress
• Claro: Un fondo claro con un color de fuente oscuro
• Oscuro: fondo oscuro sobre un color de fuente claro
• Personalizados: Elige manualmente todos los colores

Una vez seleccionada la combinación de colores, haz clic en el botón Guardar.

A continuación, puede utilizar el resto de opciones de personalización y cambiar la cabecera, el diseño de los botones, el tamaño de la fuente y mucho más con sólo unos clics.

Por último, haz clic en el botón «Guardar» para confirmar el nuevo diseño de tu feed de X (Twitter).

A continuación, puedes pasar al último paso y empezar a integrar tus tarjetas X (Twitter) en tu página web.

Paso 5: Incorpora tus tarjetas X (Twitter) en tu página web

Ahora que ya has personalizado el aspecto de las tarjetas X (Twitter), es el momento de incrustarlas en tu página web de WordPress

Puede hacerlo de 2 maneras con este plugin:

• Incrustar tarjetas X (Twitter) en una página de WordPress
• Incrustar tarjetas X (Twitter) en la barra lateral o el pie de página de WordPress

Veamos ambos métodos a continuación.

Incrustar tarjetas X (Twitter) en una página de WordPress

Con el editor de transmisiones en directo, puedes incrustar fácilmente tus tarjetas de X (Twitter) con solo unos clics, sin necesidad de saber programar.

Para empezar, haz clic en el botón Incrustar de la parte superior.

Una vez que lo hayas hecho, aparecerá una ventana emergente en la que podrás elegir la ubicación de tus tarjetas X (Twitter).

Haga clic en Añadir a una página aquí para continuar.

A continuación, verás una lista de todas las páginas de WordPress de tu sitio web. Ahora puedes seleccionar la página en la que quieres insertar las tarjetas X (Twitter).

Una vez hecho esto, haga clic en Añadir para continuar.

X (Twitter) Feed Pro abrirá ahora esa página en el editor de WordPress. Aquí puedes añadir un nuevo bloque de contenido haciendo clic en el icono del signo más (+).

Escribe «X (Twitter) Feed» en la barra de búsqueda de la parte superior para encontrar el bloque de contenido adecuado aquí.

A continuación, haz clic en el bloque «X (Twitter) Feed» de entre las opciones que aparecen a continuación.

Por último, haz clic en el botón «Actualizar» y tus tarjetas X (Twitter) aparecerán en tu página web.

Para ver cómo queda, sólo tiene que abrir su sitio web y comprobarlo usted mismo.

Ahora veamos otra forma de añadir tarjetas de X (Twitter) a tu página web utilizando X (Twitter) Feed Pro.

Incrustar feeds de X (Twitter) en la barra lateral o el pie de página de WordPress

Con este método, puedes insertar tarjetas de X (Twitter) en la barra lateral o el pie de página de tu WordPress como un widget de X (Twitter).

También puedes utilizar el editor de vídeo en directo.

En primer lugar, accede al menú «X (Twitter) Feed » Todos los feeds» desde el panel de control de WordPress.

A continuación, verás una lista de todos los feeds de X (Twitter) de tu página web. Ahora haz clic en el feed de X (Twitter) que quieras incrustar.

Al hacerlo, se abrirá de nuevo el editor de retransmisiones en directo. Solo tienes que hacer clic en el botón «Incrustar» para empezar a incrustar tus tarjetas X (Twitter).

En la ventana emergente, haga clic en Añadir a un widget para continuar.

Esto te llevará a la página de widgets de WordPress para que puedas añadir tu widget de X (Twitter).

Desde aquí, puedes elegir entre la barra lateral y el pie de página para tus tarjetas X (Twitter).

¿Quieres mostrar tarjetas de X (Twitter) en la barra lateral de tu página web?

Basta con hacer clic en el panel Sidebar .

O bien, puedes optar por mostrar tarjetas X (Twitter) en el pie de página.

Para ello, haga clic en el panel Pie de página.

Ahora puedes añadir un nuevo widget haciendo clic en el icono más (+) de la parte inferior.

A continuación, selecciona el widget«X (Twitter) Feed» de entre las opciones.

Por último, puede hacer clic en Actualizar para guardar los cambios.

Y así, sin más, ya has añadido las tarjetas X (Twitter) a las zonas de tu página web preparadas para widgets. Puedes echar un vistazo abriendo tu página web.

En definitiva, X (Twitter) Feed Pro es el mejor complemento si quieres añadir contenido de X (Twitter) a tu página web con facilidad.

Ahora veamos cómo puedes incrustar tarjetas X (Twitter) sin utilizar un complemento.

Añadir manualmente tarjetas X (Twitter) a tu página web

También puedes añadir tarjetas X (Twitter) a tu página web de forma manual, sin necesidad de utilizar ningún complemento.

Por lo tanto, si eliges este método, puede llevarte mucho más tiempo. Al fin y al cabo, tendrás que generar manualmente el código de incrustación de X (Twitter) y añadirlo a tu página web.

Además, aquí no dispondrás de opciones de personalización, por lo que es posible que tus X (Twitter) Cards no se ajusten a tu imagen de marca.

Si quieres cambiar el aspecto de las tarjetas de X (Twitter), tendrás que modificar el código tú mismo o pagar a un desarrollador.

Además, no contarás con un equipo de asistencia como el de X (Twitter) Feed Pro. Si al añadir el código de incrustación a tu página web se producen errores, no podrás pedir ayuda al equipo de asistencia.

Dicho esto, empecemos y veamos cómo puedes añadir manualmente tarjetas X (Twitter) a tu sitio web.

Paso 1: Visitar Twitter Publicar

Para empezar, abre publish.twitter.com en tu navegador para ir al sitio web de Twitter Publish.

Aquí puedes utilizar el generador de tarjetas de X (Twitter) para crear un código HTML de incrustación para contenido de X (Twitter).

Paso 2: Elija su tipo de incrustación

Si se desplaza hacia abajo, encontrará 3 opciones de incrustación diferentes:

• X (Twitter) incrustado: añade una sola tarjeta de X (Twitter) a tu sitio web
• Cronología integrada: Mostrar tarjetas X (Twitter) de una cronología concreta
• Botones de X (Twitter): Insertar botones de X (Twitter)

Para nuestro ejemplo, utilizaremos la opción de línea de tiempo incrustada.

Paso 3: Pega tu URL de X (Twitter)

A continuación, aparecerá una ventana emergente del generador de tarjetas de X (Twitter). Allí solo tienes que introducir la URL de la cronología de X (Twitter) que quieras incrustar.

Una vez que hayas pegado la URL de la cronología de X (Twitter) en la ventana emergente, haz clic en el botón «Vista previa» para continuar.

Paso 4: Copiar el código HTML

Por último, puedes ver el código HTML de tus tarjetas de X (Twitter). También puedes ver una vista previa de cómo se verán las tarjetas de X (Twitter) en tu página web.

Para continuar, haga clic en el botón Copiar código .

Por último, puedes utilizar este código para insertar las tarjetas X (Twitter) en el siguiente paso.

Paso 5: Añadir el código HTML a WordPress

Ahora puede pegar el código HTML incrustado en su página o entrada de WordPress.

Para utilizar una página de WordPress, haga clic en el menú Páginas " Añadir nueva desde su panel de control.

O puedes abrir el menú Entradas " Añadir nueva desde tu panel de control para utilizar la entrada de WordPress.

Para este ejemplo, utilizaremos una página de WordPress.

Ahora añade un bloque de contenido en la página o entrada haciendo clic en el icono más (+).

Por último, busca la barra de búsqueda en la parte superior y escribe "custom html" en ella.

A continuación, seleccione el bloque HTML personalizado de las opciones siguientes.

Ahora puedes pegar el código de incrustación de X (Twitter) que has copiado en el bloque HTML.

Al hacerlo, se insertarán las tarjetas X (Twitter) en tu página web.

Por último, haz clic en «Publicar» para guardar los cambios, y las tarjetas X (Twitter) estarán disponibles en línea.

Solo tienes que abrir tu página web para ver cómo se ven las X (Twitter) Cards.

Pero si solo quieres incrustar una única tarjeta X (Twitter), es un poco más fácil.

En primer lugar, copia la URL de tu cuenta de X (Twitter) y, a continuación, vuelve a tu sitio web de WordPress. Después, solo tienes que pegar la URL en tu entrada o página.

Al igual que antes, haz clic en «Publicar» para confirmar los cambios y tu nueva tarjeta X (Twitter) estará disponible en línea.

¡Y ahí lo tienes!

Como puedes ver, es muy fácil añadir tarjetas de X (Twitter) a tu página web utilizando un plugin de WordPress. Con X (Twitter) Feed Pro, puedes empezar a mostrar contenido de X (Twitter) con solo unos pocos clics, incluso si eres nuevo en WordPress.

Así podrá aumentar su número de seguidores en las redes sociales, atraer a los visitantes de su sitio web y aumentar sus ventas.

Si quieres empezar a sacar el máximo partido a X (Twitter) para tu marca, echa un vistazo a nuestra lista de las mejores formas de ganar dinero en X (Twitter).

¿Tienes una página web creada con Elementor? A continuación te explicamos cómo puedes integrar un feed de X (Twitter) en tu página de Elementor.

Si este tutorial te ha resultado útil, síguenos enFacebookyX (Twitter)para recibir más consejos útiles sobre marketing en redes sociales.