El editor Gutenberg y sus bloques

Como ya te prometí en el anterior artículo “Gutenberg: Estado del Arte” donde analizamos el editor desde un punto de vista más teórico, ha llegado el momento de seguir avanzando y probarlo para ver cómo se desenvuelve realmente.

Para ello he creado un conjunto de vídeos donde te mostraré el uso de los distintos bloques.

Ten en cuenta que Gutenberg todavía está en fase de desarrollo y es posible que alguna de las cosas que te mostraré acaben siendo distintas, ya que por ejemplo su interfaz ha ido evolucionando en cuestión de semanas.

Asimismo, estaré utilizando una instalación de WordPress local, cosa que tú  también deberías hacer si decides testear Gutenberg. Y para esta ocasión he utilizado la herramienta gratuita Local que te permite crear instalaciones locales de una forma bestialmente simple.

¡Empezamos!

Instalando los plugins Gutenberg y Editor Clásico

Empezamos por el principio: instalando el plugin Gutenberg y el plugin Editor Clásico. Éste último te dará el margen de tiempo que necesitas para asegurarte de que el tema y los plugins actuales de tu sitio web son compatible con Gutenbergs.

Bloques comunes

Vamos ya a analizar el funcionamiento de los distintos bloques y empezaremos con los bloques comunes, que son: Párrafo, Subtítulo, Encabezado, Imagen, Imagen de portada (cover image), Galería, Lista y Cita.

Donde el subtítulo y la cover image son una novedad incorporada en Gutenberg.

Bloques de formato

Continuamos con los bloques de formato, que son: Código, Clásico, HTML personalizado, Texto preformateado, Citas “pullquote”, Tablas y Versos.

Además te mostraré qué pasa con todas esas entradas que creaste previamente a la llegada de Gutenberg 🙂

Bloques de elementos de diseño

Vamos ahora con un conjunto de bloques bastante interesantes que son los elementos de diseño. Estos parecen estar todavía en una fase experimental, pero vale la pena echarles un ojo para hacernos una idea de lo que se avecina.

Estos bloques son: Botones, Columnas de texto, Separador, Opción de leer más y Columnas de diseño

Bloques para incrustar contenido

Hasta este momento si pegábamos un enlace, de por ejemplo un vídeo de Youtube, en el editor clásico, éste se incrustaba automáticamente sin necesidad de hacer nada más. Pero al parecer no todos los usuarios conocían esta funcionalidad y por eso se decidió crear bloques que faciliten dicha tarea.

Gracias a Gutenberg ahora es mucho más sencillo saber las distintas opciones que WordPress ofrece a la hora de incrustar contenido de terceros.

Bloques compartidos

Otra de las novedades de Gutenberg es que podemos crear bloques reusables. Por ejemplo imagínate que creas una cita con un testimonio de un cliente que quieres usar en varias entradas o páginas. Ahora gracias a los bloques compartidos podrás hacerlo. Aprende cómo en el siguiente vídeo:

Bloques de widgets

Como ya vimos en este artículo, uno de los objetivos de Gutenberg es acabar unificando los distintos elementos que giran entorno a WordPress, como los widgets y los shortcodes. Por esa razón supongo que de momento han creado una categoría de bloques llamada “widgets” que nos permite:

• Listar las categorías de nuestro blog.
• Mostrar un listado con las últimas entradas del blog.
• Insertar un shortcode.

Este artículo no termina aquí y seguirá creciendo con los futuros bloques y novedades que se incluyan en Gutenberg.