Cómo incrustar tuits en WordPress con Gutenberg

Publicada en WordPress.

Twitter es la red social con más tirón del momento (con perdón de Instagram). Todo el mundo tiene Twitter, lo vemos en los rótulos de televisión, dónde cada vez más nos ponen el usuario de Twitter de la gente además del nombre (y a veces incluso sin el nombre).

Cuando estamos escribiendo contenidos para nuestra página web en WordPress, hay veces en las que nos gustaría poder incrustar tuits dentro del contenido. Seguro que has visto muchas páginas que incluyen tuits entre los párrafos de sus artículos.

Esto es especialmente útil cuando quieres referenciar una conversación que ha sucedido en Twitter de forma fácil. Así si el visitante quiere puede hacer clic y navegar directamente al tuit y seguir allí el hilo. La cuestión aquí es ponerle la vida fácil a tus visitantes.

Hoy vamos a ver cómo podemos incluir tuits en nuestros contenidos cuando utilizamos el editor de bloques de WordPress.

Incrustar tuits con Gutenberg paso a paso

Lo primero que necesitamos para incrustar tuits en nuestros contenidos es seleccionar el tuit en cuestión que vamos a incrustar. Lo sé, más obvio imposible ☺️

Vamos a Twitter y una vez que hayamos encontrado el tuit elegido para incrustar hacemos clic en su fecha, tal y como puedes ver indicado en la siguiente captura de pantalla:

Para ver los detalles de un tuit sólo tienes que hacer clic en su fecha dentro de Twitter.
Para ver los detalles de un tuit sólo tienes que hacer clic en su fecha dentro de Twitter.

Esto nos lleva a ver el tuit en concreto dentro de la interfaz de Twitter. Lo importante aquí es quedarnos con la URL del tuit, ya que es lo que vamos a necesitar en los siguientes pasos.

Copia la URL directamente de la barra de direcciones de tu navegador y listo:

El enlace a un tweet lo tienes en la barra de direcciones del navegador.
El enlace a un tweet lo tienes en la barra de direcciones del navegador.

Ya podemos volver a WordPress, a la pantalla de edición de nuestra entrada o página. Ahora lo que tenemos que hacer es añadir un nuevo bloque de tipo Twitter. Para lograrlo, escribe una barra / y si empiezas a escribir la palabra twitter, verás que te aparece la opción de añadir este tipo de bloque:

El editor de bloques de WordPress permite añadir un bloque de tipo Twitter para incrustar tuits.
El editor de bloques de WordPress permite añadir un bloque de tipo Twitter para incrustar tuits.

Hay otras formas de añadir un bloque de Twitter al editor, utilizando la interfaz del propio editor. Tenemos los botones de añadir bloque, que están indicados con un círculo que incluye un símbolo de + en el interior. Tú eliges la manera en la que te sientas más cómodo, pero que sepas que escribir la barra / en un nuevo bloque párrafo es la más rápida.

Una vez añadido el bloque de Twitter dentro del contenido veremos lo siguiente:

El bloque de Twitter te permite incluir un tuit pegando su URL.
El bloque de Twitter te permite incluir un tuit pegando su URL.

El bloque de Twitter es bastante simple. Sólo tiene un campo de texto y un botón, además de la explicación de cómo debemos usarlo.

Lo que tenemos que hacer ahora es pegar justo en el campo de texto que hay en el bloque de Twitter la URL que habíamos copiado antes. De esta forma, el bloque será capaz de incrustar el tuit que queremos.

Pega la URL de un tuit en el bloque de Twitter del editor de bloques para incrustarlo.
Pega la URL de un tuit en el bloque de Twitter del editor de bloques para incrustarlo.

Hacemos clic en el botón de incrustar y automáticamente el editor de bloques nos muestra una previsualización del tuit que hemos incrustado en los contenidos. Así de sencillo.

El bloque de Twitter muestra la previsualización del tuit que hemos incrustado en el editor.
El bloque de Twitter muestra la previsualización del tuit que hemos incrustado en el editor.

El resultado final de incrustar un tuit en el editor de bloques de WordPress es el que ves a continuación:

Así queda un tuit al incrustarlo en WordPress dentro de los contenidos.

Ten en cuenta que depende del tema que utilices en tu WordPress, podrás darle cierto estilo al tuit incrustado. Además, el bloque de Twitter incluye una opción para que el tuit incrustado se adapte al tamaño del navegador automáticamente. Esta opción está activada por defecto, y no deberías cambiarla si no sabes lo que estás haciendo.

Por otro lado, si eres de los que quiere hacer las cosas más rápido, hay un atajo para ti. Una vez has copiado la URL del tuit que quieres incrustar, tan solo has de pegar esta URL directamente en el editor de bloques de WordPress.

Esto convertirá automáticamente el bloque de párrafo donde hayas pegado la URL del tuit en un bloque de Twitter con el tuit incrustado, tal y como puedes ver a continuación:

Si pegas la URL de un tuit en el propio editor de bloques dentro de un bloque de párrafo, este se convertirá en un bloque de Twitter con el tuit incrustado.

Es muy fácil incrustar contenidos externos en el editor de bloques de WordPress. Twitter es sólo un ejemplo, pero hay un montón de posibilidades para incrustar. Te animo a que eches un ojo a los tipos de bloques que el editor de bloques proporciona para así conocer todo el potencial que tienes disponible.

Imagen destacada de Benjamin Balázs en Unsplash.

FlojaNo está malBienMuy bien¡Impecable! (Ninguna valoración todavía)
Cargando…

Deja un comentario

No publicaremos tu correo electrónico. Los campos obligatorios están marcados con: •

He leído y acepto la Política de privacidad de Nelio Software

Al marcar la casilla de aceptación estás dando tu legítimo consentimiento para que tu información personal se almacene en SiteGround y sea usada por Nelio Software con el propósito único de publicar aquí este comentario. Contáctanos para corregir, limitar, eliminar o acceder a tu información.