Introducción y disclaimer
En este episodio de WordPress Radio se quejaron de varios fallos de Gutenberg (o editor de bloques de WordPress) que me extrañaron bastante, porque muchas de ellas me parecía que no funcionaban como ellos describían, sino que funcionaban correctamente.
Y como ya sabéis, soy un defensor de Gutenberg desde sus inicios, y me apetecía comprobar cómo funcionaba realmente el editor en cada uno de estos errores de Gutenberg, así que me puse manos a la obra y lo he recopilado en este artículo.
Quiero dejar claro que lo que critico o analizo es lo que dijeron en el podcast, y no a sus autores. Aunque es cierto que me extrañó que su percepción fuera tan diferente a la mía (y errónea, como demuestra este post), quiero remarcar de nuevo que mi único objetivo es aclarar el funcionamiento del editor y no atacar a los creadores del episodio, que por cierto son auténticos expertos en sus campos, aunque aquí no acertaran demasiado ????
Por último, os informo de que para hacer las pruebas y sacar las capturas de pantalla, he utilizado las últimas versiones disponibles antes de la grabación del podcast, ya que entiendo que es lo que ellos habrían debido hacer para hacer un análisis riguroso (y su correspondiente crónica). En este caso la 5.5.3 de WordPress y la 9.4 de Gutenberg.
Es posible que ellos se basaran en versiones anteriores del software (e incluso que no usaran el plugin de Gutenberg como tal sino la versión integrada en el core), pero no creo que hubiera cambiado demasiado los resultados.
¡Vamos allá!
Acceder a la vista de código es muy complicado
Tengo que ir a Opciones, y meter el código para ver el código, borrar o modificar algo, y volver al editor, hay algo que no está bien planteado.
No entiendo muy bien a qué se refiere, imagino que tiene alguna necesidad especial de acceder al Editor de código y parece que tiene que hacer muchos clicks. Quizás sea porque no está a la vista como en el Editor clásico, pero está tan solo a 2 clicks de distancia:
- Menú de opciones
- Editor clásico
Además de que, por supuesto, cuenta con un atajo de teclado que yo uso muchísimo: ⇧⌥⌘M. Sí, es algo complicado, pero si te quieres ahorrar esos 2 clicks… Yo ya me he acostumbrado ????
Y también tenemos una opción que antes no teníamos, que es Editar como HTML un bloque individual, que también está a 2 clicks de distancia desde el menú del bloque.
El modo a pantalla completa no es usable
Odio el modo de pantalla completa. No estoy ubicado dentro de WordPress.
A mí me pasaba lo mismo, pero para escribir un post es mucho más cómodo no tener la barra lateral y que así no te «moleste». Pero al igual que en el caso anterior, tenemos a dos clicks de distancia la opción para desactivarlo. Y disponemos del correspondiente atajo de teclado, que es muy parecido al de antes ????
Además, cuando vuelvas al editor estará cómo lo dejaste. Así que si quieres usarlo siempre con la barra lateral, solo tendrás que modificarlo una vez.
Si tienes el modo a pantalla completo activo y quieres crear un contenido nuevo, tienes que hacer 3 o cuatro clicks para algo que normalmente con un click se podría hacer. Tienes que salir de ahí, irte al menú, tienes que dar 20.000 vueltas…
No, solo tienes que hacer 2 clicks (o usar el atajo de teclado) para desactivar el modo. Claro que son más pasos y quizás podría añadir alguna forma de crear un nuevo post desde ahí, pero de momento puedes simplemente dejar este modo desactivado y funcionará como antes.
Por cierto, comentaban que no le veían mucho sentido porque «lo que ves mientras editas no se parece a lo que finalmente se va a ver», pero según yo lo entiendo no es para eso, como he comentado antes, sino se llamaría «Live Mode» o algo así. Es simplemente para escribir a pantalla completa, y que el resto de la interfaz no interfiera.
Ver o previsualizar el contenido creado es muy difícil
En ocasiones no puedes ver la página que acabas de trabajar, porque te aparece abajo un tooltip, pero si no lo usas no tienes ningún sitio donde ver la página.
Además de ese tooltip negro (abajo a la izquierda en la imagen), tenemos el botón Ver Entrada en el panel de publicación que aparece, que sería lo equivalente a la forma tradicional con el aviso superior. Bien es cierto que si seguimos editando, este panel desaparece, pero seguimos teniendo las otras 2 formas que teníamos antes:
- Clicar en el Permalink, que ahora tiene su propio panel en la barra lateral (antes estaba justo debajo del título y siempre visible)
- Hacer click en la Vista Previa, que ahora requiere un click adicional
Quizás estas 2 últimas formas son un pelín más incómodas, pero creo que hay varias formas diferentes de ver el contenido sin problemas.
No se pueden seleccionar los bloques, especialmente cuando hay columnas
Tengo que ir cada vez arriba, donde hay esa especie de outline, ahí despliego, veo todos los bloques, y puedo seleccionar. Pero cuantas veces he intentado seleccionar un bloque de columnas (no la columna), y no hay tu tía.
Creo que en general, no es difícil seleccionar los bloques, aunque en el caso de las columnas, al haber tantos elementos muy juntos entiendo que sea algo más complicado. No obstante, una vez que tienes una columna seleccionada, seleccionar el bloque de columnas es muy fácil si te posas sobre el selector de la propia columna, y aparece por encima el selector del padre. Y aún más fácil clicando en el espacio entre 2 columnas (aunque hay que tener buena «puntería»).
Bien es cierto que otros constructores visuales, como en el caso de Elementor, muestran diferentes controles y colores para los diferentes elementos de estructura como Secciones, Filas, Columnas, etc. Por otro lado, algunos como Elementor tienen un «navegador» que facilita la tarea, que sería similar al Outline que tenemos en la parte superior del editor de bloques, opción que comentaban en el podcast y me parece totalmente válida.
No se puede seleccionar todo para borrar
A veces yo quiero borrar todo, no hay forma de seleccionar todos los bloques arrastrando. Solo se puede hacer con atajos de teclado si eres un mago de los shortcuts.
Hay varias formas de seleccionar todo el contenido:
- Usar el «modo Seleccionar» en la barra de herramientas, que justamente sirve para esto.
- Permite incluso usar el teclado para ello, y está en el plugin desde principios de 2018. Se hace así: seleccionar el primer bloque, ir hasta el final, y seleccionar el último bloque mientras pulsamos ⇧ (vamos, como se ha hecho toda la vida para seleccionar mucho texto o muchos elementos seguidos).
- O puedes usar el ratón seleccionando los bloques que quieras, con arrastrar y soltar, empezando fuera del espacio donde están los bloques (como cuando seleccionas varios archivos en el sistema operativo).
- Con el atajo de teclado ⌘A, que selecciona el bloque completo en el que estás, y volviendo al pulsarlo selecciona todos los bloques. O sea, dos
comando/control+Aseguidos y lo tienes.
Por supuesto la última opción es la mejor, ya que en menos de un segundo lo has hecho. Además, se hace con un atajo muy sencillo que por cierto, es el habitual para «seleccionar todo» en muchas aplicaciones (por no decir todas): Finder, Google Docs, Vista Previa…
Botón + ausente
Cuando no te aparece el botón de +, para añadir otro bloque. No hay manera de que te aparezca el que tú quieres.
Yo creo que funciona correctamente ????♂️
No hay estilos en el editor
No se ve cómo queda en el frontend, tienes que andar cambiando entre pestañas.
Este no es un problema del editor, sino de los desarrolladores de temas. Son ellos los que tienen que hacer que los mismos estilos que cargan en el frontend, carguen en el backend. Solo tenéis que probar los temas por defecto y veréis como el editor de bloques se previsualiza más o menos igual que como se va a ver en la parte pública.
De hecho ellos mismos lo explican, así que no sé por qué lo incluyen como uno de los errores de Gutenberg.
Y en cualquier caso, si esto no fuera así, simplemente estaría funcionando igual que el editor clásico, por lo que tampoco podríamos quejarnos, ¿no? ????
Los enlaces no se pueden personalizar
Los enlaces, antes me gustaba más cómo estaba porque tenías más opciones, no puedes poner ni un ‘rel’, ni un ‘target’…
Pues sí, tenemos disponible tanto el ‘target’ como el ‘rel’ para ‘sponsored’ y ‘nofollow’.
Resumen y conclusión
El editor de bloques o Gutenberg cada vez es más maduro, estable y funcional. Evidentemente no se puede comparar a un constructor visual establecido como Elementor pero ya no se puede decir que sea un experimento.
Lleva más de 100 versiones y hace casi 2 años y medio que se lanzó de forma estable dentro de WordPress, lo que invita a pensar que permite hacer muchas cosas (como así es en a realidad), al menos para crear landing pages y entradas enriquecidas. Bien es cierto que le falta todavía potencia para trabajar con contenido dinámico, pero es que durante años los page builders populares tampoco contaban con esta funcionalidad, y además Gutenberg se está poniendo las pilas con cosas como el Query Block o por supuesto Full Site Editing.
En definitiva, casi ninguna de las quejas del episodio eran ciertas, y simplemente hay que acostumbrarse a una forma nueva de trabajar (pero equivalente), o es fruto del desconocimiento de algunas funcionalidades del nuevo editor. Si necesitas ayuda estoy a tu disposición.
Para estar al día sobre temas de WordPress, como es el editor de bloques, suscríbete y escucha nuestro podcast Negocios y WordPress, y echa un ojo a mi canal de YouTube.
Se acerca WordPress 5.6 y algunas primeras funcionalidades técnicas, repasamos Gutenberg 9.4 y hablamos un poco del WP-SEO. Eso sí, siempre se maltrata los editores visuales, pero el editor de bloques tampoco se queda atrás con algunas funcionalidades.
Origen: 193. Rant a Gutenberg