A finales del año 2020, en el State of the Word Matt Mullenweg nos presentó, como hace cada año, las novedades del editor de bloques que llegarían con las nuevas versiones de WordPress en este año 2021.
Matt nos avanzó que una de las metas de este año era cambiar la experiencia del usuario construyendo webs de WordPress: la idea era que acabáramos creando no sólo entradas y páginas, si no toda la web usando los bloques. Es decir, que también podamos crear menús de navegación, barras laterales con widgets, plantillas, etc., desde el mismo editor de bloques de WordPress. A esta idea la llamó Full Site Editing, FSE (en español, «Edición Completa del Sitio» o «Edición Total del Sitio») y era el objetivo principal de la Fase 2 de Gutenberg.
Full Site Editing no es más que un término colectivo para un conjunto de proyectos en desarrollo para alcanzar esta nueva experiencia. Josepha Haden anunció en abril de este mismo año que en la versión WordPress 5.8, cuyo lanzamiento estaba previsto para julio de 2021, se incluye una primera versión del Full Site Editing.
Full site editing is a collection of projects and together they represent a big change, arguably too much for a single release. The most important context to share is that it isn’t shipping as the full, default experience for users. One of the clearest pieces of feedback from the Phase One merge process was that there wasn’t enough time for our extenders (agencies, theme authors, plugin developers, site builders, etc.) to prepare for the upcoming changes.
With that in mind, this merge process won’t be an on/off switch. The focus now is not on a full and nuanced user experience, but more of an open public beta within WordPress 5.8.
Make WordPress Core By Josepha Haden
Josepha aclaró que WordPress 5.8 no incluye todos los proyectos que forman parte del FSE pero algunos de los que nos han llegado sí que suponen un cambio en cómo vamos a trabajar en WordPress. Ya os avancé algunas de las novedades que vendrían incluidas en WordPress 5.8, como es la posibilidad de editar imágenes y añadir filtros dúotono, las transformaciones de bloques y el tipo de bloque de menú de navegación. También comenté una pincelada sobre la opción de diseñar plantillas desde el propio editor de bloques.
En esta entrada veremos más funcionalidades de las que os avancé incluidas en el proyecto Full Site Editing que ya tenemos integradas en esta nueva versión WordPress 5.8. Ten en cuenta que hay otras funcionalidades de Full Site Editing que continuan desarrollándose y que si quieres irlas probando tienes la opción de instalarte la última versión que se está desarrollando siguiendo las instrucciones que se explican aquí.
Tabla de contenidos
Modo de edición de plantillas
Una de las primeras herramientas de Full Site Editing que nos llega con WordPress 5.8 es el editor de plantillas. El editor de plantillas es un modo especial disponible en el editor de entradas que permite crear, asignar y editar plantillas de bloques a entradas y páginas específicas.
Activa la edición de plantillas
No te desesperes si después de instalarte está versión no encuentras por ningún lado la opción de editar las plantillas. Para empezar, por defecto esta opción está desactivada para cualquier tema, pero los temas pueden optar por activarlo con la siguiente línea añadida a su archivo functions.php.
add_theme_support( 'block-templates' );
Así que eso es lo que he hecho en el tema Twenty Twenty-One para poder comentarte su funcionamento.
Crea y edita una plantilla
Lo primero que encontramos en la barra lateral derecha de edición de una entrada es la opción de crear una nueva plantilla.
Tras hacer clic en el enlace «Nuevo» te aparece una ventana emergente en el que debes indicar el nombre de la plantilla que vas a crear.
Tras darle al botón de «Crear»ya te encuentras en el editor de plantillas que es muy parecido al editor de bloques que ya conoces con algunas pequeñas diferencias.
Como puedes ver en la imagen, en la barra superior encontramos el nombre de la plantilla que estamos editando y el botón de actualizar la plantilla, ahora tiene un punto la izquierda para que en todo momento diferencies que no estás actualizando la página (o entrada) si no la plantilla. Además también tienes el enlace para volver a la página que estabas editando.
La edición de la plantilla es muy parecida a la edición de una página o entrada. Puedes añadir los bloques y patrones que quieras de la misma forma que has hecho siempre con el editor de bloques. Aunque ahora, como ya te comento más adelante, tenemos unos nuevos bloques de tema que nos pueden ser particularmente útiles en la edición de plantillas.
Una vez hayas hecho todos los cambios que creas necesarios, sólo tienes que guardarla y verás cómo te avisa de las páginas que se pueden ver afectadas con los cambios de la plantilla.
Y ya está, ya puedes asignarle a todas las páginas que quieras la nueva plantilla creada. Esta plantilla se habrá guardado en la base de datos como un Custom Post Type llamado wp_template. Además, en el futuro también tendrás la plantilla disponible para poderla exportar o importar a cualquier otro sitio web como se te antoje (de momento, esta funcionalidad sólo la tienes si tienes instalado el plugin de Gutenberg).
Nelio Popups
¡Un plugin fantástico! Es muy fácil crear ventanas emergentes con el editor que ya conoces y las opciones que ofrece están muy bien diseñadas.
Juan Hernando
Bloques de temas
La edición de plantillas, como ya te he comentado antes, nos ha venido con un nuevo conjunto de bloques de WordPress que son particularmente útiles en la creación de plantillas y temas. Son los siguientes:
- Logo del sitio
- Descripción corta del sitio
- Título del sitio
- Título de la entrada
- Contenido de la entrada
- Fecha de la entrada
- Extracto de la entrada
- Imagen destacada de la entrada
- Categorías de la entrada
- Etiquetas de la entrada
- Enlace de login/out
- Últimos comentarios
- Últimas entradas
- Lista de entradas / contenidos
Para cada uno de estos bloques, puedes modificar sus características como cualquier otro bloque.
Edición del bloque del título del sitio en WordPress. Edición del bloque del eslogan del sitio en WordPress.
Las características de cada uno de ellos son muy intuitivas y no creo que requieran una explicación adicional pero sí que me parece interesante entrar en el detalle de tres tipos de bloques un poco más complejos: Últimas entradas, Lista de entradas y Lista de contenidos. Estos tres tipos de bloques los puedes tanto añadir en una plantilla como en una entrada o página.
Bloque Últimas entradas
Si insertas el bloque de tipo últimas entradas, verás que tienes un montón de características que puedes definir para la visualización de las mismas.
Puedes seleccionar tres estilos distintos de visualización de las entradas, si quieres que se muestre la descripción o toda la entrada, el máximo número de palabras, el autor, la fecha de publicación y la imagen destacada (el tipo, tamaño, alineación y link a la entrada). Además puedes ordenarlas alfabéticamente o por antigüedad en orden creciente o decreciente, o filtrar las entradas que se muestran por una categoría. Finalmente, también puedes indicar el número de entradas que quieres que se muestren y en cuántas columnas.
Bloques Lista de contenidos y Lista de entradas
El bloque lista de contenidos te permite mostrar un listado de entradas, páginas o cualquier otro custom post type con estilos distintos y pudiendo aplicar filtros dependiendo del tipo de contenido que se muestra.
Como puedes ver en la imagen anterior, primero puedes seleccionar en la barra lateral izquierda, el estilo en el que queremos que se muestre el contenido. En caso de haber seleccionado el estilo estándar, puedes seleccionar la vista carrusel o cuadrícula. Y en el caso de carrusel puedes seleccionar entre distintas variaciones de visualización y escoger entre distintas combinaciones sobre si mostrar el título, la fecha, la descripción de la entrada y/o la imagen.
Una vez seleccionado se habrá creado un bloque de tipo plantilla de contenido que contendrá los distintos sub-bloques seleccionados. Y sea cual sea la variación que hayas elegido, puedes luego añadir y/o quitar los bloques de tema y hacer los cambios que quieras de cada uno de los bloques dentro del bloque de lista de contenidos, de forma que se ajusten a tus preferencias.
Además tienes un conjunto de propiedades del listado que también puedes parametrizar como són los colores del bloque, el tipo de contenido que quieres mostrar, el orden en el que se muestra el contenido y los filtros que puedes aplicar dependiendo del contenido que has seleccionado.
De esta forma, puedes añadir de forma rápida una sección de los contenidos que tienes en el blog o cursos, etc. en cualquier plantilla o página sin salir en ningún momento del editor de bloques.
Vista de lista
Otra funcionalidad de Full Site Editing que ya tenemos disponible en WordPress 5.8 es la vista de lista. En la barra superior del menú de edición de una página o entrada, ahora encontramos el icono de vista de lista a la derecha del icono con la «i». Al hacer clic se nos despliega una barra lateral con la estructura de los distintos bloques que forman el contenido que estamos editando. Y queda resaltado el bloque en el que nos encontramos.
Esta lista de vista te permite navegar de forma rápida por los distintos bloques del contenido. Posicionando el ratón en cualquier bloque de la lista, te llevará al contenido de ese bloque.
Una propiedad muy útil de esta vista de lista es que también se muestran los anclajes HTML que añadas al contenido.
Esta te facilita que en todo momento puedas revisar de forma fácil si te falta algún anclaje HTML y los estás llamando con el nombre correcto.
Resumiendo
WordPress 5.8 ha marcado un hito en el camino hacia el Full Site Editing. Juntamente con algunas de las funcionalidades que ya expliqué que nos llegaban, vemos que poco a poco nos vamos acercando al objetivo de ser capaces de desarrollar nuevas webs sin necesidad de escribir código.
Todavía encontramos que el funcionamiento de algunas funcionalidades a veces falla y necesita mejorarse pero esto es un proyecto de código abierto en el que la participación de todos hará posible que WordPress acabe siendo la plataforma favorita de webs.
¿Y tú, qué opinas? ¿Te has animado a instalar esta versión de WordPress? Nos encantará que compartas tu experiencia.
Foto destacada de Andrew Neel en Unsplash.
Deja una respuesta