Todo sobre el nuevo editor de bloques de WordPress

Probablemente hayas oído hablar de que WordPress ha implementado un nuevo editor de bloques en su versión 5.0.

Si has actualizado tu sitio a la nueva versión, el nuevo editor de bloques de WordPress se te habrá activado por defecto. En la actualidad, si no te gusta la nueva experiencia de edición o te cuesta hacerte a ella, puedes instalar un plugin que reactive el editor clásico.

Aunque te aconsejo que te vayas acostumbrando al nuevo editor de bloques ya que, a la larga va a ser la única forma de crear contenido en WordPress y, créeme, lo vamos a agradecer.

En este artículo te voy a dar una visión general de lo que hay detrás del nuevo editor de bloques de WordPress y una revisión en profundidad sobre el estado actual de los bloques y lo que la nueva experiencia de edición significa para tu blog.

¿Qué supone el editor de bloques de WordPress con respecto al editor clásico?

Va a cambiar la forma en que escribimos entradas de blog y construimos páginas en WordPress. Es una pequeña revolución en el universo de WordPress.

El cambio más grande que se produce dentro del nuevo editor es el poder personalizar las páginas de tu web de forma muy sencilla, a base de bloques que se van añadiendo sin necesidad de tener conocimientos de código.

Si has utilizado otro CMS como Medium o squarespace o un maquetador visual de páginas como Elementor, Divi, Visual Composer, etc., probablemente hayas trabajado ya con bloques, pero si te gusta la experiencia WYSIWYG tradicional del editor clásico de WordPress, esto será nuevo para ti.

El objetivo final es que la creación de contenidos para los usuarios sea una experiencia más sencilla que en la actualidad, a través de una interfaz más intuitiva.

El editor de bloques a a cambiar la forma de construir las páginas webs en WordPress, ya que es uno de los mayores cambios y novedades que ha lanzado recientemente el CMS.

El editor actual en WordPress se divide en la zona de edición de texto en el centro y un montón de metacajas arriba, abajo y a la derecha. Estas cajas son para guardar datos como el título de la publicación, categorías u otra información que se guarda en los campos personalizados.

Con el nuevo editor esta estructura se romperá un poco. Una vez que empieces a escribir en el editor, en el lado izquierdo, tu texto será envuelto en un bloque de párrafo.

Hay muchos otros tipos de bloques, que explico abajo abajo en detalle, como bloques de imagen, espaciadores y botones.

Las características de estos bloques se pueden ajustar en la columna derecha de Gutenberg. Ahí es también donde se encuentra toda la funcionalidad tradicional del antiguo editor, como categorías, etiquetas, imágen destacada y el estado de la publicación.

Puedes cambiar entre las funciones generales del documento y los ajustes de bloque que se mostrarán una vez que hayas seleccionado un bloque (pulsando sobre el mismo en la zona de edición).

Interfaz del editor de bloques de WordPress

Antes de ver qué son los bloques del nuevo editor de WordPress, veamos un rápido resumen de los elementos de su interfaz principal.

1. Permite añadir nuevos bloques.
2. Botón de deshacer/rehacer
3. Te da acceso a la configuración del documento, donde podrás ver elementos como las categorías, las etiquetas, la IMAGEN DESTACADA... Es similar a la barra lateral que incluye WordPress ahora mismo.
4. Cuando tienes un bloque individual seleccionado, esto te da acceso a los ajustes específicos de ese bloque.
5. Te permite acceder a una vista previa de tu página o publicarla/actualizarla.
6. Título de la página o entrada.
7. Contenido del bloque seleccionado.
8. Metaboxes de plugins y opciones.

¿Qué son los bloques en el nuevo editor?

Ahora básicamente todo es un bloque. Eso es lo que hace que la creación de contenido tan interesante y, espero, más fácil a los nuevos usuarios. Por otro lado, es un nuevo concepto de edición que aprender y entender.

Reconocerás la mayoría de los bloques por sus iconos, ya que son muy similares al editor de WordPress clásico. Pero hay algunos elementos nuevos, hasta ahora sólo disponibles en los maquetadores visuales o page builders, como botones, separadores o columnas.

Otra novedad interesante es que se pueden agregar widgets directamente a las publicaciones.

Pero antes de que nos emocionemos demasiado con las nuevas características, veamos una descripción de los bloques más importantes del nuevo editor.

Bloques comunes

Una vez que comienzas a escribir, se crea automáticamente un nuevo bloque de párrafo.

Es el bloque estándar y ofrece funciones generales de edición como alineación de texto, negrita, cursiva, tamaño de texto y color, y enlaces.

Puedes encontrar todos los ajustes en la pestaña derecha, se mostrarán allí cuando el bloque está seleccionado.

Por supuesto, el nuevo editor también permite añadir imágenes con un bloque de imágenes y hay un bloque de encabezado para insertar títulos (H2, H3, H4).

Los bloques comunes se dividen en tres tipos:

• Bloques de texto
  • Párrafo
  • Encabezado
  • Lista
  • Cita
• Bloques de imagen
  • Imagen
  • Galería
  • Imagen de fondo
• Bloques multimedia
  • Audio
  • Vídeo
  • Archivo

Bloques de formatos

Dentro de este tipo de bloques encontramos el bloque de editor clásico, que nos va a permitir “simular” la forma de introducir contenido que conocemos hasta ahora, ya que replica el editor TinyMCE con todas sus funciones.

Dentro de los Bloques de formatos tenemos:

• Editor clásico
• Código
• HTML personalizado
• Texto preformateado
• Cita
• Tabla
• Verso

Bloques de elementos de diseño

Los bloques de elementos de diseño son los que nos permiten insertar distintos elementos especiales como columnas, botones, espacios, saltos de página y separadores.

Los Bloques de elementos de diseño incluyen:

• Botón
• Columnas
• Leer más
• Salto de página
• Espaciador
• Separador

Bloques de widgets

Éstos son bloques de tipo dinámico, entre los cuales se encuentran los shortcodes. Este bloque nos permitirá seguir usando los shortcodes dentro del nuevo editor, asegurando así la compatibilidad con las versiones anteriores del editor de WordPress.

Estos son los Bloques de widgets:

• Shortcode
• Archivo
• Categorías
• Últimas entradas
• Últimos comentarios

Bloques incrustados

Dentro de la sección de bloques incrustados tenemos una gran cantidad de bloques de servicios de terceros disponibles, como por ejemplo twitter, youtube, facebook, instagram, el propio WordPress y todos tienen un mismo cometido: mostrar de una forma fácil y sencilla ese contenido externo dentro de nuestra página web.

Bloques reutilizables

Cualquier tipo de bloque puede convertirse en un bloque reutilizable, bloques que vamos a poder reutilizar siempre que lo deseemos en cualquier entrada o página de nuestra web.

El gran potencial de los bloques compartidos es que, si se editan, cambian en todos los sitios donde los hayamos usado.

Los bloques reutilizables nos facilitarán mucho la vida a la hora de crear contenido, ya que se van a poder reutilizar muchos elementos comunes dentro de nuestra página web.

Si no me gusta el editor de bloques de WordPress ¿Tengo alternativas?

¿Probaste y no te gustó? ¿O ya sabes que quieres ceñirte a la "antigua" experiencia de edición con el tradicional editor de TinyMCE? No te preocupes, también hay un plugin para ti.

Se llama Classic editor y puedes instalarlo directamente desde el anuncio de tu escritorio si has actualizado a WordPress 4.9.8 o desde el repositorio de plugins de WordPress. Este plugin restaurará el editor original y evitará que tu blog se cambie al editor de bloques.

Así que todavía te queda un poco de tiempo para decidir si quieres usar Gutenberg en tu blog en el futuro.

En este vídeo del Webinar de SiteGround:  "Gutenberg a discreción: Los expertos hablan y responden tus dudas" puedes aprender más de en qué estado se encuentra el proyecto Gutenberg, de la mano de Jose Ramón Padrón, Fernando Puente, Fernando Tellado y Jose Ángel Vidania.