Ronda de difusión de FSE n.º 2: creación de una página de inicio personalizada con el editor del sitio de Gutenberg

Anne McCarthy anunció la segunda ronda de pruebas para el programa de divulgación Full Site Editing (FSE). La convocatoria para la prueba pide que los usuarios creen una página de inicio desde el editor del sitio del complemento de Gutenberg. La retroalimentación está abierta hasta el 5 de marzo.

La primera ronda de pruebas comenzó en diciembre de 2020 y finalizó el mes pasado. Los probadores pudieron identificar varios puntos débiles con el modo de edición de plantillas desde el editor de bloques. El programa creó elementos accionables que los desarrolladores de Gutenberg podrían trabajar para mejorar.

Esta segunda ronda es similar. Sin embargo, las pruebas cubren un área mucho más grande y compleja. Los usuarios dejarán el conocido editor de bloques y pasarán al editor de sitios, que aún está a meses de ser un producto viable.

McCarthy enumeró un proceso de 22 pasos para crear una página de inicio. Si bien lo seguí en su mayor parte, me aburrí antes de terminar. Esta es una de las razones por las que hago un mal sujeto de prueba. Me gusta explorar y ver lo que es posible por mi cuenta. Si tengo una idea, quiero intentar su ejecución. Principalmente me ceñí al guión general, incluso si estaba un poco fuera de lugar.

Eventualmente, creé una página de inicio personalizada para un restaurante llamado The Grilled Cheese. Definitivamente abriría este restaurante en el mundo real si alguna vez dejara la comunidad de WordPress.

Es razonablemente simple. En total, me llevó alrededor de dos horas jugar con varios conceptos antes de llegar a esta etapa. Construir algo con lo que sería feliz habría tomado algunas horas más.

En general, me sentí limitado a la hora de diseñar mi página de inicio ideal. Cada paso fue una batalla cuesta arriba contra las herramientas. Podría haber construido esto en menos de la mitad del tiempo con HTML y CSS. Podría hacer lo mismo y más con otros complementos modernos de creación de páginas para WordPress.

Antes de sumergirme en los resultados de mi prueba, tengo una honestidad brutal. TT1 Blocks, que es el tema utilizado para las pruebas de FSE Outreach, no está a la altura. El tema no maneja de manera confiable la multitud de posibilidades que el editor del sitio pone en manos de los usuarios finales. Toda esta experiencia podría ser más fluida con un mejor tema. Sin embargo, las opciones son limitadas y no estoy seguro de si hay un mejor tema basado en bloques para trabajar en este momento.

Hubo tantas inconsistencias entre el editor del sitio y el front-end que no tiene mucho sentido enumerarlas todas. El espacio estaba muy mal. En general, lo veo como un problema temático. Pasé gran parte de mi tiempo en el modo de prueba y error, haciendo un ajuste en el editor y refrescando para ver el resultado inicial. Enjuagar. Repetir.

Identificación de puntos de dolor

Si bien esta publicación es crítica con el editor del sitio, no significa que la experiencia haya sido del todo mala. Ver la mejora cada semana me da la esperanza de que WordPress tendrá un editor de sitios que rivalice con cualquier cosa en el mercado. Finalmente. Sin embargo, mi objetivo aquí es proporcionar comentarios reales que el equipo pueda usar.

Aparte de los problemas generales de espaciado mencionados anteriormente, identifiqué varios obstáculos al crear una página de inicio personalizada.

Anchos máximos

Al diseñar una página de sitio completo a través del editor del sitio, un problema se destacó más que la mayoría. WordPress carece de un sistema completo de "ancho máximo". Como usuario, me quedaban pocas opciones para configurar el ancho del área de contenido de mi página de inicio. Actualmente, los autores de temas pueden establecer contenido personalizado, ancho y ancho completo. Sin embargo, este sistema es terriblemente limitante. No hay mucho que los autores de temas puedan hacer con esto, y este problema limita directamente lo que los usuarios pueden hacer en los editores de bloques y sitios.

Anteriormente escribí sobre la necesidad de un marco de diseño, uno que los autores de temas puedan personalizar. Tailwind CSS tiene un sistema de ancho máximo que ofrece mucha flexibilidad. WordPress necesita comenzar a tomar prestadas ideas de estos marcos de diseño modernos.

Añadir icono de bloque

Lograr que apareciera el ícono "Agregar bloque" al pasar el mouse entre elementos en el área de contenido predeterminada fue difícil. Tuve que colocar mi mouse en una posición perfecta para que apareciera. Fue un ejercicio de frustración donde incluso el más mínimo movimiento hizo que el icono desapareciera una vez más.

Cambiar al modo Barra de herramientas superior hizo esto mucho más fácil. Supongo que la barra de herramientas de bloque predeterminada lo ocultaba hasta cierto punto. El problema de cambiar a este modo es que mi opción de barra de herramientas no se guardó. Cada vez que regresaba al editor del sitio, tenía que habilitarlo una vez más.

Bloque de consulta

El aspecto más frustrante de incluir publicaciones en una página de inicio personalizada fue establecer un límite. Quería poner el número en tres. Sin embargo, el bloque Query no tiene opción para hacer esto. Eventualmente, creé un límite falso usando el filtro de categoría, eligiendo uno que solo tenía un par de publicaciones.

Actualización: es posible establecer un límite como lo indica Nick en los comentarios. Hay un ícono de "configuración" en la barra de herramientas para configurar el número de publicaciones por página, un desplazamiento y el número máximo de páginas. No estoy seguro de por qué estas configuraciones de consulta en particular están separadas de las demás en la barra lateral. Tiene más sentido que estén agrupados.

Otro aspecto confuso del bloque Consulta es el filtro de palabras clave. Que yo sepa, WordPress nunca ha usado la terminología de “palabra clave”. Fuera de los complementos de SEO, no parece haber ningún contexto para lo que hace este filtro. Supongo que funciona como una palabra clave de búsqueda.

Estilos globales para todos los bloques

Al cambiar al panel Estilos globales, noté que faltaban algunos bloques al aplicar estilos en el nivel de bloque. En particular, quería ajustar los estilos para el bloque Últimos comentarios.

Supongo que en la lista solo aparecen bloques con tipografía, colores y otras opciones relacionadas con el diseño. Es probable que esto confunda a los usuarios finales cuando el editor del sitio llegue a WordPress. Todos los bloques deben tener opciones de estilo que los usuarios puedan personalizar.

Sin columnas de ancho completo

Para el contenido de mi página de inicio, intenté crear un bloque de columnas de ancho completo. Sin embargo, las dos columnas individuales tenían un tamaño limitado a pesar de ocupar el 66,67 % y el 33,33 %, respectivamente.

Esto parece que es un problema de tema. También diría que este es uno de esos momentos en los que habría ayudado tener un control más directo sobre el ancho máximo. Realmente quería algo que estuviera entre los anchos completo y ancho del tema.

Imágenes destacadas

No hay forma de establecer el tamaño de la salida de la imagen mediante el bloque Imagen destacada de la publicación. La única forma de obtener un tamaño uniforme en este momento es recortar previamente las imágenes antes de subirlas a WordPress.

No hay ninguna razón por la que esto no deba ser esencialmente una variación del bloque Imagen. Lo único que necesitan las imágenes destacadas que es diferente es la opción de vincular a la publicación.