Cómo usar Gutenberg en WordPress: Guía completa para principiantes

Desde la versión WordPress 5.0, el editor clásico ha sido reemplazado por Gutenberg como editor predeterminado. Entonces, si estás usando WordPress, necesitas usar el nuevo Gutenberg o volver al editor clásico para crear una nueva página o publicación. 

Pero ¿por qué retroceder cuando el nuevo es más completo? Gutenberg, también conocido como "Editor de bloques", introduce un nuevo enfoque basado en bloques para la creación de contenido con más flexibilidad y facilidad.

Por lo tanto, debes tener un conocimiento básico o avanzado del editor de bloques de Gutenberg. Y este blog te pondrá las cosas fáciles.

A lo largo de esta guía, aprenderá los conceptos básicos de cómo usar Gutenberg en WordPress, así como algunos trucos avanzados como bloques y patrones reutilizables.

¿Qué es el editor de bloques de WordPress Gutenberg?

En una frase, Gutenberg es el editor comparativamente nuevo de WordPress que utiliza bloques para crear páginas web y publicaciones. El editor de bloques se introdujo teniendo en cuenta la simplicidad y la flexibilidad. En Gutenberg, cada contenido es un bloque individual. 

Por lo tanto, puedes diseñar una página web o publicar con una combinación de diferentes tipos de contenido, incluidos texto, imágenes, videos, tablas y más. Este editor le ayuda a reorganizar, diseñar y personalizar cada bloque de forma independiente, brindándole el máximo control sobre la apariencia de su sitio web.

Comprender bloques y patrones

Para saber cómo funciona el editor de bloques Gutenberg, debes familiarizarte con un par de términos nuevos. Los bloques de WordPress y los patrones de bloques son los dos términos que usaremos con más frecuencia al describir Gutenberg. Así que primero entendámoslos.

Bloques: 

Los bloques en Gutenberg son los elementos unitarios que se utilizan para crear contenido. Cada bloque representa un elemento separado o una parte de contenido. Por ejemplo, usando el bloque de párrafo, puede agregar contenido de texto, el bloque de imágenes le permite agregar imágenes a su contenido. 

De manera similar, el editor de bloques de WordPress tiene bloques como encabezados, galerías, listas, citas, medios integrados (como videos o tweets) y más.

Más allá de los bloques predeterminados, muchos complementos se agregan a la lista de bloques para el editor Gutenberg.

Patrones:

Por otro lado, los patrones son un conjunto de bloques que se agrupan para formar un trazado o diseño. Estos patrones ayudan a los usuarios a agregar rápidamente diseños complejos o combinaciones de bloques de uso común con un solo clic. En última instancia, ahorra tiempo y esfuerzo para crear páginas web.

Los patrones pueden variar desde diseños simples como una sección de CTA con encabezado, texto y botones hasta diseños más complejos como una sección de héroe del sitio web, carruseles de testimonios, secciones de miembros del equipo, tablas de precios y más.

¿Cómo utilizar Gutenberg en WordPress?

Usar Gutenberg es simple y fácil. Elija un bloque, agregue contenido, personalícelo y ¡su página web estará lista! Sin embargo, hay más. Descubramos en detalle cómo usar Gutenberg en WordPress.

¿Cómo funciona el editor de bloques Gutenberg en WordPress?

Si está utilizando WordPress 5.0 o una versión superior, lo que es más probable, Gutenberg ya es su editor predeterminado. Por lo que no es necesario instalar ni activar el editor de bloques. Simplemente abra una nueva página o publicación y podrá crear sus diseños en WordPress.

Paso 1: Cómo agregar un bloque en Gutenberg

Agregar un bloque en Gutenberg, el editor de bloques predeterminado de WordPress, es un proceso simple. Introduzca primero el título de la página. 

Ahora para agregar un bloque, 

• Abra un campo para agregar un bloque: Haga clic en el icono “+” en el editor o presione / en su teclado. Esto abrirá el insertador de bloques.
• Explora y selecciona un bloque: Puede buscar un bloque escribiendo su nombre o desplazarse por los bloques disponibles. Elija uno y haga clic en el bloque que desea agregar.

Puede explorar estos bloques para crear contenido diverso y atractivo para su sitio de WordPress. Una vez agregado el bloque, ahora puede agregar contenido al bloque que ha seleccionado.

Paso 2: agrega contenido al bloque

Gutenberg ofrece una amplia gama de bloques para diversos tipos de contenido. Como se dijo anteriormente, esto incluye párrafos, títulos, imágenes, videos, botones, tablas y muchos más. Puede agregar diversos tipos de contenido a su página web utilizando estos bloques.

Por ejemplo, si desea crear una galería de imágenes, 1. seleccione el bloque de la galería, 2. Cargue o elija imágenes de la biblioteca multimedia y se agregará una galería a la página.

De manera similar, si desea agregar un encabezado, simplemente seleccione el bloque de encabezado y agregue un texto de encabezado.

Paso 3: personaliza los estilos de bloque

Lo más sorprendente del editor de bloques de WordPress es que puedes personalizar cada bloque de manera diferente. Por ejemplo, dos bloques de párrafos pueden tener diferentes colores de texto y tipografía.

Entonces, cuando agregas un bloque, el panel lateral derecho mostrará las opciones personalizables. Asimismo, para un bloque de párrafo, puede personalizar el texto y el color de fondo, elegir el tamaño del texto y la tipografía, como la familia de fuentes, la altura de la línea, el espaciado entre letras, etc.

Guardar y reutilizar bloques en Gutenberg

Bloques reutilizables, ahora denominados "Patrones sincronizados" es una de las funciones fáciles de usar introducidas en Gutenberg. El editor de bloques de WordPress te permite guardar un bloque o un grupo de bloques con sus estilos personalizados y reutilizarlo más tarde en otras páginas o publicaciones. Esto ahorra tiempo y esfuerzo en gran medida.

Para hacer que un bloque de Gutenberg sea reutilizable, 

1. Seleccione un bloque o grupo.
2. Haga clic en el icono de tres puntos ( ⋮ ).
3. Busque "Crear patrón/bloque reutilizable".
4. Ingresa un nombre.
5. Habilite la opción "Sincronizado" para que sea reutilizable.
6. Finalmente, haga clic en el botón Crear.

Finalmente, tu bloque se convertirá en bloques reutilizables. Ahora para usar los bloques reutilizables,

1. Abra el editor de WordPress para una publicación o página donde desee agregar el bloque reutilizable.
2. Haga clic en el icono “+” para agregar un nuevo bloque.
3. En la pestaña "Reutilizable", verás los bloques reutilizables que has creado. Haga clic en el que desea insertar.

En general, los bloques reutilizables pueden ser una característica que le permitirá ahorrar tiempo, especialmente si tiene ciertos elementos o diseños que utiliza con frecuencia en su sitio web.

Envolver

En conclusión, la introducción del editor de bloques Gutenberg ha supuesto un cambio enorme en la usabilidad de WordPress. Esto ha hecho que la creación de páginas web y publicaciones sea más fácil y flexible.

Entonces, saber Cómo usar Gutenberg en WordPress es un requisito fundamental para cualquiera que use el CMS de WordPress en general. Al comprender el editor basado en bloques y su multitud de funciones, ahora posee las herramientas para crear diseños visualmente atractivos, contenido rico en multimedia y sitios web fáciles de usar.