Cómo Insertar un Feed de Twitter en HTML (Guía Paso a Paso 2026)

Si deseas insertar un feed de Twitter en HTML, el método oficial es simple: copia el código, pégalo en tu página HTML y listo. Pero esto es solo la mitad de la historia.

La mayoría de sitios web necesitan un widget de Twitter responsivo y en vivo que sea de marca, de carga rápida y controlado. Por lo tanto, necesitamos hacer algo mejor que simplemente copiar el fragmento.

Aquí te muestro el método HTML exacto para insertar un feed de Twitter, explico las limitaciones del mundo real y luego te guío a través de una forma más escalable hacerlo usando EmbedSocial.

Primero, comenzaremos con el enfoque nativo.

La forma oficial de insertar un feed de Twitter en HTML

Twitter (X) proporciona una herramienta web llamada Twitter Publish que genera código de inserción para publicaciones, perfiles, hashtags y líneas de tiempo. Este es el proceso:

1. Ve a publish.twitter.com
2. Pega la URL de tu perfil de Twitter
3. Elige “Línea de tiempo incrustada”
4. Copia el fragmento HTML generado

1. Ve al sitio web de Twitter Publish

Abre https://publish.twitter.com en tu navegador. Esta es la herramienta oficial de Twitter para generar código de inserción, sin necesidad de claves API ni configuración de desarrollador:

2. Pega la URL de tu perfil de Twitter

Copia tu URL pública de Twitter (p. ej., https://twitter.com/tuusuario) y pégala en el campo de entrada. Asegúrate de que la cuenta sea pública, de lo contrario el feed no se generará:

3. Elige “Línea de tiempo incrustada”

Selecciona “Línea de tiempo incrustada” para crear una línea de tiempo de Twitter en vivo y que se actualice automáticamente. Esta opción garantiza que las nuevas publicaciones aparezcan automáticamente en tu sitio web:

4. Copia el fragmento HTML generado

Haz clic en “Copiar código” y pega el código HTML proporcionado en la sección de tu página donde desees que se muestre el feed. El script incluido representará la línea de tiempo automáticamente:

El código se verá similar a esto:

<a class="twitter-timeline" href="https://twitter.com/tuusuario">
Tweets by tuusuario
</a>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

Nota: Solo puedes insertar contenido público de Twitter mediante el método anterior. Por lo tanto, las publicaciones de cuentas protegidas no son compatibles con este método.

Insertar un tweet individual vs una línea de tiempo de Twitter completa

Hay una gran diferencia entre insertar un tweet y insertar un feed en vivo.

Si insertas un solo tweet, estás agregando una referencia estática. Funciona bien en publicaciones de blog, casos de estudio o anuncios de productos donde el contexto es importante.

Por otro lado, si insertas una línea de tiempo completa de Twitter, estás creando una sección dinámica de tu sitio web que se actualiza automáticamente a medida que publiques.

Para la mayoría de empresas, una línea de tiempo completa es más poderosa porque mantiene la página fresca sin actualizaciones manuales. Pero también introduce más consideraciones de diseño y rendimiento.

Cómo insertar un feed de Twitter en un sitio web usando HTML sin procesar

El código de inserción principal no cambia entre plataformas. Lo que cambia es cómo tu CMS maneja los scripts. En un sitio HTML estático, simplemente pegas el código en tu archivo de página:

• En WordPress, utilizas un bloque HTML personalizado.
• En Webflow, añades un elemento Embed.
• En Shopify, lo colocas dentro de una sección personalizada o archivo de tema.

Donde la gente suele atascarse, algo que he visto repetidamente en foros de desarrolladores, es la eliminación de scripts. Algunos constructores eliminan automáticamente las etiquetas