Guía completa del editor Gutenberg de WordPress

Si es usuario de WordPress, seguramente ha tenido contacto con „Gutenberg“. Como herramienta de edición predeterminada que reemplazó al editor clásico desde WordPress 5.0, Gutenberg no es solo una actualización de interfaz, sino que representa un cambio fundamental de WordPress hacia un método de creación de contenido moderno y modular. Este artículo lo llevará a conocer a fondo Gutenberg, desde su filosofía de diseño hasta sus funciones principales, ayudándole a dominar realmente este potente editor.

1. ¿Qué es Gutenberg y por qué se llama así?

Gutenberg es el editor de bloques de WordPress. El „bloque“ es su concepto más central. A diferencia del editor clásico, que trata todo el contenido del artículo como una gran área de texto, Gutenberg considera cada elemento de la página —como párrafos, títulos, imágenes, videos, botones, etc.— como un „bloque“ independiente que se puede arrastrar y configurar libremente.

Su nombre conmemora al inventor de la imprenta de tipos móviles en Occidente,Johannes Gutenberg. Este nombre tiene un profundo significado: así como la imprenta de tipos móviles de Gutenberg revolucionó la difusión de información mediante caracteres modulares móviles, el editor Gutenberg revoluciona la creación de contenido web mediante „bloques de contenido“ que se pueden combinar libremente.

2. Revolución central: de „un gran bloque de texto“ a „construcción con bloques“

Para entender las ventajas de Gutenberg, la mejor manera es compararlo con el editor clásico.

  • Editor clásico (TinyMCE):​ Es como una versión simplificada de Word. Debe ingresar contenido en un área de edición grande y configurar el formato mediante los botones de la barra de herramientas. Para insertar multimedia o diseños complejos, generalmente debe depender del botón „Agregar medio“ o escribir códigos cortos, lo que hace que el flujo de trabajo sea relativamente fragmentado.
  • Editor Gutenberg (editor de bloques):Es más como construir un modelo con bloques de Lego. No necesitas cambiar de interfaz; simplemente „agrega bloques“ para construir la página paso a paso. Cada bloque tiene su propia barra de herramientas y opciones de configuración, lo que hace que la experiencia de edición sea más enfocada e intuitiva.

Un ejemplo sencillo:

Imagina insertar una imagen alineada a la derecha en un artículo, con texto descriptivo a su lado.

  • En el editor clásico: primero debes subir la imagen, configurar la alineación y luego ajustar manualmente el ajuste del texto, un proceso tedioso.
  • En Gutenberg: solo necesitas agregar un bloque de „Imagen“, subir la imagen y configurar la alineación. Luego, agrega un bloque de „Párrafo“ junto a él para ingresar el texto. Cada bloque es independiente y no interfiere con los demás.

3. Funciones principales y experiencia de uso de Gutenberg

  1. Biblioteca de bloques enriquecida:Gutenberg incluye una amplia variedad de bloques que cubren la mayoría de las necesidades de contenido:
    • Bloques de contenido comunes:Párrafo, Título, Lista, Imagen, Galería, Cita, Código, Tabla, etc.
    • Bloques de diseño:Separador, Botón, Columnas, Medios y texto, etc., que te ayudan a crear diseños más variados.
    • Bloques dinámicos:Lista de entradas recientes, Archivos, Categorías, etc., que pueden mostrar contenido del sitio de forma dinámica.
    • Bloques de inserción:Inserta fácilmente contenido de terceros como videos de YouTube, tweets de Twitter, música de Spotify, etc.
  2. Operación de arrastrar y soltar intuitiva:Puedes reorganizar fácilmente el orden de los bloques arrastrándolos y soltándolos, reestructurando la página de forma intuitiva.
  3. Panel de configuración detallado del bloque:Al seleccionar un bloque, aparece un panel de configuración a la derecha. Aquí se ofrecen más opciones que en la barra de herramientas, como configurar el color del texto, el color de fondo, el tamaño de la fuente, la URL del enlace, clases CSS, etc., logrando un efecto de edición „lo que ves es lo que obtienes“.
  4. Patrones de bloques y plantillas reutilizables:Esta es una de las grandes ventajas de Gutenberg. Si diseñas cuidadosamente un bloque de llamada a la acción que incluya título, botón e imagen, puedesguardarlo como bloque reutilizable. Luego, en cualquier artículo o página, puedes insertar este módulo prefabricado con un solo clic, lo que mejora enormemente la eficiencia del trabajo. Además, la comunidad y los desarrolladores de temas ofrecen una gran cantidad de „patrones de bloques“ que se pueden aplicar directamente.
  5. Base de la edición de sitio completo:Gutenberg no solo es un editor de entradas, sino también la base de la futura „edición de sitio completo“ de WordPress. En temas modernos que admiten la edición de sitio completo (como Twenty Twenty-Three), puedes usar Gutenberg directamente para editar todas las partes del sitio, como elencabezado, pie de página, barra lateral, construyendo realmente todo el sitio con bloques.

4. Ventajas y controversias de Gutenberg

Ventajas:

  • Reducir el costo de aprendizaje:Para los principiantes, el concepto de bloques es más fácil de entender y usar que los shortcodes y el código HTML.
  • Diseño más flexible:Puedes crear páginas con un aspecto visual impresionante sin depender de complejos plugins de creación de páginas.
  • Integración profunda con WordPress:Como funcionalidad principal oficial, ofrece la mejor compatibilidad y rendimiento, y representa la dirección futura de la plataforma.
  • Flujo de trabajo simplificado:Interfaz de edición unificada, sin necesidad de cambiar entre el editor de entradas y el creador de páginas.

Controversia pasada y estado actual:

En sus inicios, Gutenberg causó incomodidad y críticas entre muchos usuarios veteranos debido a su lógica operativa muy diferente al editor clásico. Sin embargo, tras años de actualizaciones iterativas, Gutenberg ha madurado en estabilidad, funcionalidad y facilidad de uso. Para aquellos que aún no se adaptan, pueden instalar el plugin oficial„Plugin Editor Clásico“ para volver a la interfaz antigua.

V. Recomendaciones para los usuarios

  • Usuarios novatos:Aprendan y usen Gutenberg directamente. Es el futuro de WordPress, y empezar con él es la mejor opción.
  • Usuarios veteranos:Si aún no lo han probado, les recomiendo dedicar tiempo a redescubrirlo. Dejen de lado los prejuicios y descubrirán su enorme potencial en el diseño de contenido y la eficiencia de edición. Si es realmente necesario, el plugin del editor clásico es su plan de respaldo.

Conclusión

El editor Gutenberg es un paso clave de WordPress hacia una plataforma de gestión de contenidos más abierta y potente. Simplifica lo complejo, haciendo que el proceso de construcción de contenido web sea tan intuitivo y divertido como jugar con bloques. Aunque el camino del cambio conlleva dificultades, abrazar Gutenberg es abrazar un futuro más inteligente y visual para WordPress. ¡Ahora, abre tu panel de WordPress y comienza a explorar las infinitas posibilidades de los bloques!