Editor Gutenberg de WordPress (+Video)

---

Este post es una actualización del artículo originalmente publicado en agosto de 2019.

En 2018 se cumplieron 550 años de la muerte de Johannes Gutenberg, de quien se ha tomado el nombre para el nuevo editor de WordPress.

Ese mismo año, WordPress lanzó en versión beta su nuevo editor: Gutenberg. En medio de críticas y protestas, los responsables de WordPress decían que esta nueva herramienta vendría a cambiar la forma de crear contenido en el famoso Gestor de Contenidos.

Un año después, la predicción se cumplió.

La aproximación ha sido radicalmente distinta: ahora se utilizan “bloques” individuales editables y trasladables para dar una mayor control en la creación y gestión de contenido enriquecido.

¿Qué son los page builders?

Los page builders o constructores de páginas son aplicaciones (plugins) que se añaden a una plantilla de WordPress y que permiten construir la estructura, maquetación y estilo de un sitio web.

Algunos de los más importantes son Elementor, Divi Builder y Beaver.

Con la llegada del sistema de bloques del nuevo editor, surge la pregunta de si ahora estamos ante una herramienta que podrá hacernos prescindir de la instalación de page builders. Clic para tuitear

Pero vamos por partes.

Una mirada inicial a Gutenberg

En diciembre de 2018 con el lanzamiento de la versión 5.0 de WordPress, Gutenberg se convirtió en el editor por defecto.

Cuando hablábamos de “contenido enriquecido” hablamos de contenido que va más allá del “texto plano”. Es decir, hablamos de medios (imágenes, videos, sonidos), texto enriquecido (texto con formatos), elementos de diseño…

Con una interfaz sencilla, limpia y fácil de trabajar (user friendly), Gutenberg parece estar superando las críticas iniciales.

Después de todo, luego de una década con el editor clásico, mucha gente se resistía –y se resiste aún-  al cambio.

El propósito de WordPress con su nuevo editor va mucho más allá de las funciones de un simple editor (muy al estilo de Microsoft Word con el anterior editor).

Ellos buscan que Gutenberg sea, eventualmente, una herramienta para construir totalmente un sitio web, incluyendo la maquetación o layout de páginas principales y landing pages.

¿Pero qué son los bloques?

Podemos concebir los bloques de Gutenberg como “unidades de contenido” con las que podemos editar, trasladar, cambiar más o menos a nuestra conveniencia el diseño de los posts o páginas de un sitio web.

Aunque esos traslados aún son limitados. Los bloques sólo se pueden mover hacia arriba y hacia abajo, no a los lados.

Sin embargo, esto nos permite realizar diseños muchos más complejos de lo que permitía el editor anterior.

Gutenberg permite escoger entre una variedad de bloques para añadir al diseño del post o página:

• Texto
• Títulos y subtítulos
• Videos
• Audio
• Citas
• Imágenes
• Fondos (imágenes y colores)
• Imágenes de portada
• Widgets
• Tablas
• Columnas. Excelentes para el diseño del layout. Incluso se pueden crear múltiples columnas cada una con un bloque diferente.
• Medios y textos (dos columnas, una con texto y otra con un medio como una imagen o video)
• Espaciador
• Separador
• Botones
• Y más…

Para quienes sepan código, podrán añadir sus bloques HTML personalizados y guardarlos para “reusarlos”.

Cada bloque es una entidad independiente, lo que permite personalizarlos al máximo e individualmente.

¿Gutenberg es un constructor de páginas como Elementor?

Aunque WordPress ha dicho que una de sus metas con Gutenberg es que el usuario, si lo desea, puede prescindor de page builders, en su forma actual, el nuevo editor no es aún un sustituto adecuado.

En su estado actual, Gutenberg tiene dos carencias que no le permiten clasificar como un page builder a pleno derecho: Clic para tuitear

• Carencia de flexibilidad en columnas. Si bien es cierto que se puede, vía código, transformar el bloque de columnas en columnas flexibles (que se adapten a la forma que queramos), no es el caso si no usas conocimiento HTML y CSS.

• Muy limitado en cuanto al ”drag and drop” (agarra y suelta) de los bloques. La funcionalidad más altamente valorada de losconstructores

Dicho esto, Gutenberg sí puede hacernos prescindir de constructores de páginas como Elementor (que pueden ralentizar la carga de un sitio web) o plantillas premium (que pueden ser caras) para la mayoría de los diseños más “standard”.

Como dato curioso, nuestro sitio web Presencia Digital ha sido realizado, en su estilo minimalista, prescindiendo del uso de constructores de páginas o funcionalidades incluidas en la plantilla. Sólo se usaron las posibilidades de Gutenberg (y algo de código).

Sin embargo, para construir más complejas landing pages, por ejemplo y si no sabes de código, vas a apreciar la mayor flexibilidad de page builders dedicados como Elementor o Divi Builder.

Resistencia al cambio

A pesar de las ventajas evidentes que presenta Gutenberg por encima del anterior editor, a la fecha de hoy, marzo de 2021, el plugin del editor clásico de WordPress se ha convertido en uno de los más descargados del repositorio.

Con más de 5 millones de instalaciones activas, el editor clásico ha demostrado que una enorme cantidad de personas sigue prefiriéndolo sobre Gutenberg.

Entre las quejas más frecuentes al nuevo editor está la usabilidad y en «complicar más las cosas» con respecto al editor clásico.

El problema radica, en nuestra opinión, que con la mayor cantidad de opciones d Gutenberg, los usuarios que sólo quieren un editor «para escribir», estilo Word, pueden sentir que la curva de aprendizaje para dominarlo le resta usabilidad.

Este tipo de quejas vienen principalmente de aquellos quienes tienen una plantilla instalada y que no se preocupan por el diseño o estructura. Es decir: compras la plantilla con sus diseño preestablecido, la instalas y activas y listo. Sólo necesitas publicar contenido.

Sin embargo, para quienes apuestan por construir sus propias webs, el editor de Gutenberg hace un magnífico trabajo en cuanto a la maquetación y gestión de cada sección de la web. Todo esto sin sobrecargar y ralentizar velocidad de carga con pesados «page builders«.

Gutenberg en vivo

Hemos querido aquí hacer una demostración de una sencilla maquetación usando el sistema de bloques de Gutenberg.

En este video de 22 minutos verás en vivo cómo maquetar una página de inicio o una landing page sencillas usando sólo las posibilidades de Gutenberg.

Luego de leer este post y ver el video, no dejes de leer nuestro artículo sobre los Bloques de Génesis para WordPress y cómo pueden ayudarte a construir tu web.