WordPress 6.9 está a la vuelta de la esquina, y estamos impacientes por utilizar algunas de las muchas y fantásticas nuevas funcionalidades que incluirá la última versión del CMS más popular del mundo.

A simple vista, las principales mejoras de WordPress 6.9 incluyen lo siguiente:

  • Nuevos bloques del núcleo (Accordion, Math y otros) para ofrecer mayor flexibilidad en la creación de contenido.
  • Importantes mejoras en el editor, que hacen que la experiencia de creación sea aún más fluida e intuitiva.
  • Nuevas API para desarrolladores, como la API Abilities, actualizaciones de la API Interactivity y la API Block Bindings, junto con otras mejoras adicionales previstas para la versión 6.9.
  • Mejoras en los flujos de trabajo y la colaboración con Notas, la opción de visibilidad de bloques y la ampliación de la Paleta de comandos.

Estas actualizaciones garantizan una mejor experiencia para todos: los usuarios de WordPress disfrutarán de herramientas de edición y colaboración más potentes, mientras que los desarrolladores se beneficiarán de capacidades de integración más avanzadas gracias a un conjunto mejorado de APIs.

Hay mucho que tratar, así que vamos a explorar las nuevas funcionalidades de WordPress 6.9 que más nos han entusiasmado:

Nuevos bloques del núcleo

Tras este problema de GitHub, WordPress 6.9 introduce seis nuevos bloques, lo que amplía las capacidades creativas del editor de bloques y elimina la necesidad de que los usuarios instalen plugins adicionales. Estos nuevos bloques incluyen Accordion (Acordeón), Term Query (Consulta de Términos), Time to Read (Tiempo de Lectura), Math (Matemáticas), Comment Count (Contador de Comentarios) y Comment Link (Enlace de Comentario).

Durante años, los colaboradores han debatido si los nuevos bloques deberían integrarse en el núcleo o permanecer en el ámbito de los plugins. WordPress 6.9 toma una decisión práctica al respecto. En palabras de Mathias Ventura,

Creo que no tener estos bloques en la biblioteca del núcleo limita gravemente la expresividad de la que pueden depender los creadores de temas (y los usuarios) para construir grandes diseños y puede fracturar la experiencia general, obligando a la gente a optar por bibliotecas de bloques más equipadas en su lugar o a desistir por completo si planean lanzar algo a gran escala.

Ahora, echemos un vistazo más de cerca a cada uno de los nuevos bloques incorporados al núcleo con WordPress 6.9.

Acordeón

El tan esperado bloque Accordion (Acordeón) por fin llega al núcleo. No es un bloque único, sino una estructura de bloques anidados que puedes explorar fácilmente desde el Inspector de bloques.

La estructura de bloques Accordion.
La estructura de bloques Accordion en el editor de entradas.

Cada bloque Acordeón consta de los siguientes bloques internos:

  • Acordeón: contenedor para los elementos anidados de tipo Acordeón.
  • Elemento de Acordeón: Es el elemento directamente anidado y consta de un encabezado y un panel.
  • Encabezado de Acordeón: Un encabezado sobre el que se puede hacer clic y que abre y cierra un panel.
  • Panel de Acordeón: Este panel contiene el contenido del elemento Acordeón y puede incluir cualquier tipo de bloque.
Un bloque Accordion en el editor de código.
Un bloque Accordion en el editor de código.

El bloque tiene un estilo minimalista, pero la excelente guía de Justin Tadlock, «Styling accordions in WordPress 6.9» (Diseño de acordeones en WordPress 6.9), proporciona los conocimientos esenciales para personalizar la apariencia de tus acordeones.

Consulta los PRs #64119, #71222 y #71388 para obtener todos los detalles sobre el nuevo bloque Accordion.

Consulta de Términos

WordPress 6.9 introduce un nuevo bloque Consulta de Términos. Similar al bloque Consulta, muestra términos en lugar de entradas. Este nuevo bloque es en realidad una Plantilla de Términos que contiene un bloque Fila con un Nombre de Término y un Recuento de Términos.

Estructura del bloque Consulta de Términos
Estructura del bloque Consulta de Términos

El bloque Consulta de términos incluye varias opciones de configuración. Puedes establecer la taxonomía, ordenar los elementos de la lista, especificar los elementos seleccionados y elegir mostrar u ocultar términos vacíos o anidados. También puedes establecer el número de términos a mostrar.

Configuración del bloque Consulta de Términos
Configuración del bloque Consulta de Términos

La Plantilla de Términos tiene dos modos de visualización: Lista y Cuadrícula. La vista de Cuadrícula te permite personalizar la posición de los elementos de la cuadrícula y el número de columnas.

Consulta de términos en vista de cuadrícula
El bloque Consulta de términos tiene dos modos: Lista y Cuadrícula

También puedes cambiar las etiquetas de los elementos del bloque. Por ejemplo, puedes utilizar un elemento h2 para el bloque Nombre del Término. También puedes insertar bloques entre los elementos del bloque Consulta de términos. La imagen siguiente muestra un bloque Separador entre filas.

Personalización del bloque de Consulta de Términos
Personalizar el bloque Consulta de Términos

Para obtener más información sobre el bloque Consulta de Términos, consulta PR #70720 y Issue #49094.

Tiempo de Lectura

Como su nombre indica, el bloque Tiempo de Lectura muestra el tiempo de lectura de la entrada o página actual. El bloque tiene dos modos, Tiempo de lectura y Recuento de palabras, y una opción para mostrar el tiempo de lectura como un intervalo o un valor específico.

El bloque Tiempo de Lectura
El bloque Tiempo de Lectura
El bloque Tiempo de Lectura en modo Recuento de Palabras
El bloque Tiempo de Lectura en modo Recuento de Palabras

Matemáticas

El bloque Matemáticas te permite insertar fórmulas matemáticas en tu contenido. Sólo tienes que escribir tus fórmulas en sintaxis LaTeX, y se convertirán en los símbolos matemáticos correspondientes.

Vista previa del bloque de matemáticas.
El bloque Matemáticas te permite insertar fórmulas matemáticas en entradas y páginas.

También es posible insertar fórmulas inline.

Añadir fórmulas matemáticas inline en WordPress 6.9
Añadir fórmulas matemáticas inline en WordPress 6.9

Enlace a comentarios y recuento de comentarios

Los bloques Enlace a comentarios y Recuento de comentarios ya no están marcados como experimentales. Ambos bloques están ahora disponibles para su uso en el Editor del Sitios y en el Editor de Entradas.

Mejoras en los bloques existentes

WordPress 6.9 introduce actualizaciones menores y mayores en multitud de bloques, mejorando su funcionalidad y/o usabilidad.

Se ha solucionado un problema de relleno de fondo en el bloque Encabezado

Se ha solucionado un problema de especificidad CSS con el relleno de fondo del bloque Encabezado en WordPress 6.9. Antes de esta versión, los estilos de relleno aplicados al bloque Encabezado afectaban a otros bloques que utilizaban encabezados, como el bloque Acordeón.

Gracias al uso de la pseudoclase :where(), el selector CSS para los encabezados que utilizan fondos se ha hecho más específico, tal y como se describe en las notas de desarrollo.

h1, h2, h3, h4, h5, h6 {
	&:where(.wp-block-heading).has-background {
		padding: ...;
	}
}

Si un tema utiliza la clase .has-background con elementos de encabezado que no son bloques de encabezado, estos elementos ya no reciben el relleno de fondo predeterminado.

Elemento HTML seleccionable para los bloques Botón y Separador

Para mejorar la accesibilidad, ahora puedes seleccionar los elementos HTML de los bloques Botón y Separador.

Para el bloque Botón, puedes elegir entre <a> y <button> en la configuración avanzada del bloque.

Configuración avanzada del bloque Botón
Configuración avanzada del bloque Botón

Para el bloque Separador, puedes elegir entre <hr> y <div>.

Bloque Separador Ajustes avanzados
Bloque Separador Ajustes avanzados

Selector tagName para el bloque Contenido de la entrada

Con WordPress 6.9, puedes seleccionar el envoltorio semántico adecuado para el bloque Contenido de la entrada. Puedes elegir entre <main>, <section> o <article>.

Opción de elemento HTML para el bloque Contenido de la entrada
Opción de elemento HTML para el bloque Contenido de la entrada

Iconos de enlace personalizados para Enlaces Sociales

Un nuevo filtro block_core_social_link_get_services permite ahora a los desarrolladores añadir iconos de enlaces personalizados al bloque Enlaces sociales utilizando variaciones de bloque. Esta incorporación ofrece más opciones para personalizar el bloque Enlaces sociales y elimina la necesidad de que el núcleo gestione una larga lista de servicios.

Puedes encontrar los detalles técnicos y el código para registrar una variación de Enlaces Sociales en el PR #70261. La siguiente imagen muestra el resultado en el editor de entradas.

Un icono de enlace personalizado en WordPress 6.9
Un icono de enlace personalizado en WordPress 6.9

Ordenar por orden de menú en el bloque Query Loop

Además del título y la fecha de la entrada, ahora puedes ordenar por orden de menú los tipos de entrada que admiten atributos de página en el bloque Query Loop. Para probar esta nueva funcionalidad, crea varias páginas y utiliza Edición rápida para editar cada una de ellas.

Cambia el orden de los menús en la pantalla Páginas.
Cambia el orden de los menús en la pantalla Páginas.

También puedes cambiar el orden de los elementos del menú editando cada página individualmente. En la barra lateral Página de la izquierda, haz clic en el botón Acciones (los tres puntos de la esquina superior derecha). A continuación, selecciona Orden. Aparecerá una ventana emergente con un campo numérico para establecer el orden del menú.

Selecciona el orden del menú en el menú Acciones.
Selecciona el orden del menú en el menú Acciones.
Cambiar el orden del menú
Cambiar el orden del menú

Después de establecer el orden de las páginas, crea una nueva página y añade un bloque de Query Loop. Selecciona Páginas como tipo de entrada y ordénalas por Orden de menús.

El valor menu_order está disponible para todos los tipos de entrada de la base de datos; sin embargo, necesitas registrar la compatibilidad con la funcionalidad page-attributes para que este ajuste esté disponible para tus tipos de entrada personalizados.

Para más información sobre esta funcionalidad, consulta el PR #68781.

Actualizaciones del bloque de Navegación

El Bloque de Navegación ha sufrido varias actualizaciones. Aquí tienes una lista rápida de las principales:

Se ha añadido un nuevo botón Crear página a la interfaz de usuario de enlaces del bloque Enlace de navegación. Esta actualización incluye la opción de publicar la página inmediatamente.

Crear página desde la Interfaz de Enlace del bloque Enlace de Navegación
Crear página desde la Interfaz de Enlace del bloque Enlace de Navegación
Opción Publicar inmediatamente
Opción Publicar inmediatamente

Esta funcionalidad también está disponible en el bloque Botón, aunque esté incluido en el Menú de Navegación.

Comando Crear página en la UI de Enlace del bloque Botón
Comando Crear página en la UI de Enlace del bloque Botón

Gracias a la API de Enlaces de Bloques, el atributo URL del bloque Enlace de Navegación se actualiza dinámicamente cuando cambia la URL original, siempre que el enlace sea a una entidad, como una Página o una Entrada.

URL del enlace sincronizado
URL del enlace sincronizado

Una nueva opción alternable en la barra lateral de configuración del bloque Enlace de Navegación permite ahora que los usuarios configuren los enlaces de navegación para que se abran en una nueva pestaña. Anteriormente, la opción Abrir en una nueva pestaña solo estaba disponible en el enlace de tipo modal del menú contextual. Con esta novedad, la opción es más fácil de localizar, ya que se encuentra junto al resto de ajustes de la barra lateral.

Opción Abrir en nueva pestaña en la interfaz de usuario del enlace del bloque Enlace de Navegación
Opción Abrir en nueva pestaña en la interfaz de usuario del enlace del bloque Enlace de Navegación

Ahora puedes establecer un fondo transparente para el bloque Menú de navegación desde la interfaz del editor. Antes de WordPress 6.9, tenías que utilizar código CSS personalizado para conseguir este efecto.

Variaciones de los bloques Título Elástico y Párrafo Elástico

Los bloques Título Elástico y Párrafo Elástico son dos nuevas variaciones que estiran automáticamente el texto para que se ajuste a todo el ancho del contenedor.

Puedes insertar las dos variaciones de dos formas distintas: directamente desde el Insertador de bloques o desde el menú desplegable de la barra de herramientas de los bloques Título y Párrafo.

Variaciones de los bloques Título Elástico y Párrafo Elástico
Variaciones de los bloques Título Elástico y Párrafo Elástico
Transformar en Párrafo Elástico
Transformar en Párrafo Elástico

Soporte de imagen de póster para el bloque Portada

Gracias al nuevo componente poster-image, el bloque Portada admite ahora imágenes de póster. Esto es especialmente útil para vídeos de gran tamaño y para usuarios con conexiones lentas, ya que mejora la experiencia del usuario.

Ahora que hemos explorado las principales novedades y mejoras de los bloques del núcleo, veamos cómo WordPress 6.9 facilita la colaboración en equipo en la creación de contenidos, adaptándose a las responsabilidades individuales. Esta versión introduce dos potentes funcionalidades que mejorarán significativamente la colaboración y los flujos de trabajo dentro del editor: Notas y Visibilidad.

Bloques de comentarios con Notas en WordPress 6.9

Ahora puedes añadir notas a los bloques en el editor de entradas. Esta funcionalidad permite la colaboración asíncrona entre los miembros del equipo, permitiéndote hacer un seguimiento de las actividades y agilizar los flujos de trabajo editoriales.

Dado que se trata de una funcionalidad específica del editor de entradas, los usuarios deben tener la capacidad edit_posts de esa entrada para añadir notas. Esto significa que:

  • Los usuarios conectados con el rol de Administrador o Editor pueden ver todas las notas de todas las entradas.
  • Los Autores y Colaboradores pueden ver y editar las notas que han creado.
  • Los suscriptores no pueden ver las notas.

Para añadir una nueva nota, haz clic en el botón Añadir Nota de la barra de herramientas del bloque.

Aparece un nuevo elemento Añadir nota en el menú Opciones de la barra de herramientas del bloque.
Aparece un nuevo elemento Añadir nota en el menú Opciones de la barra de herramientas del bloque.

Esto muestra una nueva barra lateral de Notas y un panel de notas para añadir tu nota.

Añadir una nota a un bloque en WordPress 6.9
Añadir una nota a un bloque en WordPress 6.9

Puedes activar/desactivar la barra lateral de Notas haciendo clic en el botón Todas las notas que aparece después de añadir tu primera nota.

Control de todas las notas en la barra de herramientas de configuración del editor.
Control de todas las notas en la barra de herramientas de configuración del editor.

Las notas se pueden resolver, modificar o eliminar.

Editar nota en WordPress 6.9
Editar nota en WordPress 6.9

Las notas están activadas por defecto para entradas y páginas, pero también puedes activarlas para tus tipos de entrada personalizados gracias al nuevo soporte notes. Aquí tienes un ejemplo sencillo de cómo añadir soporte de Notas para un tipo de entrada personalizado:

register_post_type( 'book', array(
	'label' => 'Books',
	'public' => true,
	'show_in_rest' => true,
	'supports' => array(
		'title',
		'editor' => array( 'notes' => true ),
		'author',
		'excerpt',
	),
) );

Añadir soporte para notas al registrar un tipo de entrada personalizado es bastante sencillo. Sin embargo, añadir soporte para notas a un tipo de entrada existente es un poco más complicado. Afortunadamente, los desarrolladores del núcleo ya están trabajando para agilizar el proceso, y podemos esperar actualizaciones de esta funcionalidad en futuras versiones de WordPress.

Técnicamente, las notas son comentarios y se almacenan en la tabla wp_comments con el campo comment_type establecido en note. Para acceder a las notas mediante programación desde un plugin, utiliza la función get_comments() como se indica a continuación:

$args = array(
	'post_id' => $post_id,
	'type'    => 'note',
);
$notes = get_comments( $args );

Ten en cuenta que cuando intentes recuperar notas de un plugin, debes especificar el tipo note porque los comentarios de tipo nota se excluyen por defecto de los resultados de la consulta.

Cuando un usuario añade una nota a un bloque, el autor de la entrada recibe un correo electrónico de notificación. Estos correos electrónicos están activados por defecto, pero pueden desactivarse desde el panel de control de WordPress accediendo a Configuración > Discusión > Enviarme un correo electrónico siempre que y desmarcando la nueva opción Cualquiera publica una nota.

Configuración de las notificaciones por correo electrónico en WordPress 6.9
Configuración de las notificaciones por correo electrónico en WordPress 6.9

Los desarrolladores pueden controlar estas notificaciones mediante programación utilizando el filtro notify_post_author.

Ten en cuenta que esta es la versión inicial de la funcionalidad de notas. El equipo de desarrollo ya está trabajando en la siguiente iteración para WordPress 7.0.

Además, en WordPress 6.9, las notas sólo están disponibles a nivel de bloque. Las notas inline se implementarán en futuras iteraciones.

Consulta las notas para desarrolladores y la iteración Block Commenting para WordPress 6.9 para obtener un análisis más detallado de las nuevas funcionalidades de Notas con varios ejemplos de código.

Control de la visibilidad de los bloques

WordPress 6.9 introduce una nueva API de bloques y una nueva interfaz para controlar la visibilidad de los bloques en el frontend y en el editor.

Esta funcionalidad es útil para ocultar bloques que aún no están listos para mostrarse, y complementa a la perfección la nueva funcionalidad Notas. Ahora, los equipos pueden colaborar en la creación de páginas y finalizar las secciones sólo cuando estén completas y aprobadas.

Para probar la nueva funcionalidad, crea una nueva entrada o página y añade uno o varios bloques o patrones. A continuación, oculta el bloque o patrón en el menú desplegable Configuración de bloques o en la Vista de lista, y comprueba el efecto tanto en el editor como en el frontend.

Ocultar bloques en WordPress 6.9
Ocultar bloques en WordPress 6.9
El nuevo control de visibilidad de bloques
El nuevo control de visibilidad de bloques

Paleta de comandos ampliada al panel de administración

La paleta de comandos está ahora disponible tanto en el editor del sitio como en el panel de control de WordPress (Ctrl+K o Comando+K) para facilitar y agilizar la navegación. Escribe en la paleta para buscar, navegar por el panel de control o realizar acciones directamente. Por ejemplo, si escribes «añadir» aparecerá un menú de acciones como Añadir publicación, Añadir archivo multimedia, Añadir usuario, etc.

La paleta de comandos en la pantalla Mensajes
La paleta de comandos en la pantalla Mensajes

Se han realizado varias propuestas para ampliar y mejorar la paleta de comandos, y en el futuro se añadirán nuevos comandos. Sigue la conversación en el tema Descripción general de la paleta de comandos para mantenerte al día.

Novedades para desarrolladores

Ahora, pasemos a la parte de WordPress 6.9 que más interesará a los desarrolladores. Un nuevo conjunto de APIs permite ahora a los desarrolladores hacer que sus plugins sean accesibles para los sistemas de IA. ¡Pero eso no es todo! WordPress 6.9 también aporta muchas mejoras a las APIs existentes, incluyendo la API de interactividad, los enlaces de bloques y la API de DataViews.

Vamos a explorar las nuevas funcionalidades en detalle.

API de Capacidades (Abilities API)

WordPress 6.9 introduce la API de Capacidades, una nueva interfaz funcional que proporciona un registro estandarizado, permitiendo a plugins, temas y al núcleo de WordPress exponer sus capacidades en formatos legibles tanto por humanos como por máquinas.

Este registro centralizado es donde toda la funcionalidad puede registrarse formalmente para su descubrimiento, validación y ejecución de forma coherente a través de PHP, API REST y soluciones de IA.

La nueva API de Capacidades beneficia directamente a los usuarios de WordPress al permitir que servicios externos — como asistentes de IA, aplicaciones externas y funcionalidades de interfaz de usuario como la Paleta de comandos — comprendan y ejecuten acciones de WordPress (por ejemplo, publicar o editar) de forma estandarizada.

¿Qué ventajas tiene esto para los desarrolladores?

La primera ventaja es la claridad: Una capacidad es una función registrada con una descripción, una entrada y una salida.

El segundo aspecto esencial de la nueva API es la normalización. La API garantiza que los comandos se formulen y comprendan de forma coherente, independientemente del entorno. Puede ser el panel de WordPress, el editor de bloques, una aplicación externa que acceda a través de la API REST o un asistente de IA.

Otro aspecto clave es la automatización del flujo de trabajo. Con la API de Capacidades, puedes crear secuencias de operaciones que permitan a los desarrolladores construir flujos de trabajo automatizados complejos.

Los desarrolladores pueden utilizar la API de Capacidades para diversos fines, como ampliar la funcionalidad de la Paleta de Comandos, crear flujos de trabajo automatizados, etc.

Una vez registradas, las habilidades son accesibles para los sistemas de IA, como ChatGPT y Gemini:

La API gestiona el registro y los permisos, mientras que los Adaptadores de protocolo los traducen a formatos que los sistemas de IA externos entienden. Esto establece una sólida conexión entre la funcionalidad de WordPress y los asistentes de IA, con la API de origen como fuente definitiva de la lógica expuesta.

Una capacidad es «una unidad autónoma de funcionalidad con entradas, salidas, permisos y lógica de ejecución definidos»

La API proporciona un conjunto de funciones que te permiten gestionar todos los aspectos de las Capacidades y Categorías de Capacidades. También ofrece nuevos endpoints de la API REST, acciones y hooks de filtro.

Para registrar una nueva capacidad, la API proporciona la nueva acción wp_abilities_api_init y la función wp_register_ability. Esta es la firma de la función:

wp_register_ability( string $name, array $args ): ?WP_Ability

wp_register_ability acepta los siguientes parámetros:

  • $name (cadena) es un identificador único para la habilidad
  • $args (array) es un array de argumentos

La función devuelve una instancia de WP_Ability si el registro se ha realizado correctamente y null en caso de fallo.

Aquí tienes un ejemplo de cómo registrar una Capacidad, extraído de la documentación:

add_action( 'wp_abilities_api_init', 'my_plugin_register_site_info_ability' );
function my_plugin_register_site_info_ability() {
	wp_register_ability( 'my-plugin/get-site-info', array(
		'label' => __( 'Get Site Information', 'my-plugin' ),
		'description' => __( 'Retrieves basic information about the WordPress site including name, description, and URL.', 'my-plugin' ),
		'category' => 'data-retrieval',
		'output_schema' => array(
			'type' => 'object',
			'properties' => array(
				'name' => array(
					'type' => 'string',
					'description' => 'Site name'
				),
				'description' => array(
					'type' => 'string',
					'description' => 'Site tagline'
				),
				'url' => array(
					'type' => 'string',
					'format' => 'uri',
					'description' => 'Site URL'
				)
			)
		),
		'execute_callback' => function() {
			return array(
				'name' => get_bloginfo( 'name' ),
				'description' => get_bloginfo( 'description' ),
				'url' => home_url()
			);
		},
		'permission_callback' => '__return_true',
		'meta' => array(
			'annotations' => array(
				'readonly' => true,
				'destructive' => false
			),
		),
	));
}

Esto es lo que hace este código

  • wp_abilities_api_init es la acción a la que hay que hacer hook cuando se registra una nueva capacidad, asegurando que la API de capacidades esté completamente inicializada antes de intentar registrar la nueva capacidad.
  • wp_register_ability es la función que registra una nueva capacidad. El primer argumento es el identificador único de la capacidad (my-plugin/get-site-info); el segundo argumento es un array de ajustes.
  • label es una etiqueta legible por humanos que se utilizará en la interfaz de usuario (por ejemplo, en la paleta de comandos).
  • description es la descripción de la capacidad
  • category es la categoría de la capacidad
  • output_schema es un array que define los datos devueltos por la capacidad.
  • execute_callback es una función de llamada de retorno que se ejecuta cuando se invoca la capacidad.
  • permission_callback es una función que se ejecuta para verificar si el usuario o agente tiene permiso para ejecutar la capacidad.
  • meta es un array de metadatos opcionales.

Los desarrolladores encontrarán más detalles con muchos ejemplos de código en los siguientes recursos:

Mejoras en la API de Enlaces de Bloques (Block Bindings)

WordPress 6.9 introduce varias mejoras en la API de Enlaces de Bloques.

En primer lugar, se ha ampliado la compatibilidad con la API de enlaces de bloques para incluir otros bloques.

  • El bloque Datos acepta ahora cualquier fecha, independientemente de la fecha de publicación o actualización de la entrada. Esto ha sido posible añadiendo la nueva fuente de datos core/post-data. Puedes probarlo tú mismo añadiendo un bloque Fecha a una entrada y asignándole una fecha personalizada. A continuación, añade otro bloque Fecha y selecciona la variación Fecha de publicación. A continuación, cambia la fecha de publicación, guarda la entrada y comprueba las diferencias. Para más detalles técnicos, consulta el PR #70585.
  • WordPress 6.9 también añade compatibilidad con el atributo «caption» del bloque Imagen en las anulaciones de patrón.

Se ha mejorado la interfaz de usuario del editor para mostrar diferentes fuentes de enlaces de bloques. Los usuarios pueden cambiar entre las fuentes de datos y vincular o desvincular atributos con sólo unos clics (ver imagen de abajo).

WordPress 6.9 también introduce un par de cambios interesantes para los desarrolladores.

Se ha añadido un nuevo filtro block_bindings_supported_attributes_{$block_type} a la API para su uso en el lado del servidor. Este filtro te permite especificar qué atributos del bloque pueden conectarse a una fuente de datos personalizada.

En el lado del cliente, ahora puedes registrar fuentes personalizadas utilizando el método getFieldsList en la función de registro de fuentes.

Las notas de desarrollo proporcionan un valioso bloque de código que puedes copiar y pegar en la consola de tu navegador para ver la interfaz de usuario mejorada de los enlaces de bloque.

La siguiente imagen muestra el nuevo selector de fuente para un bloque Párrafo.

La interfaz de usuario de Block Bindings en WordPress 6.9
La interfaz de usuario de enlaces de bloque en WordPress 6.9

Mejoras en DataViews y DataForm

Las APIs DataViews y DataForm proporcionan una forma moderna y estandarizada de ver y gestionar datos estructurados, como listas de entradas, páginas o medios.

Las dos APIs tienen propósitos diferentes.

  • La API DataViews está diseñada para ver y navegar por los datos. Te permite crear vistas, incluyendo tablas, cuadrículas y listas. También puedes buscar, filtrar y ordenar datos con ella.
  • La API DataForm está diseñada para modificar los elementos de un conjunto de datos.
Sección Páginas en el diseño Lista del Editor de Sitios
Un ejemplo de DataViews: Visualización de páginas en formato Lista en el Editor de Sitios

Con WordPress 6.9, estas dos APIs reciben varias mejoras. A continuación encontrarás una lista de las principales novedades:

  • Las DataViews ganan nuevos campos, controles y operadores. Entre las diversas novedades, encontrarás nuevas definiciones de tipo de campo multimedia, booleano, de correo electrónico y de array, nuevos controles de edición checkbox y toggleGroup, nuevos operadores de filtro y mucho más.
  • El sistema de validación se ha revisado por completo. Todos los campos admiten ahora «la regla required y elements, así como la definición de validación personalizada mediante la función personalizada»
  • Además del tipo de campo datetime, las Vistas de datos admiten ahora el tipo de campo date. Esto te permite mostrar elementos basándote únicamente en la fecha. Esta novedad también permite filtrar por fecha utilizando el nuevo componente Calendar.
  • La nueva versión también añade los componentes DateCalendar y DateRangeCalendar.
  • Se ha mejorado aún más el diseño de la tabla. Ahora es posible seleccionar varios elementos utilizando Control/⌘ + clic.
  • La nueva propiedad groupByField te permite agrupar visualmente los datos en función de los valores de los campos, lo que facilita la organización de los datos. Esta funcionalidad está disponible tanto para diseños de cuadrícula como de tabla.
  • WordPress 6.9 también introduce mejoras de rendimiento en DataViews. Antes de la versión 6.9, el componente FeaturedImageView utilizado en DataViews cargaba las imágenes a tamaño completo. Esto significaba que los sitios con muchas imágenes de vista previa de gran tamaño tenían que cargar varios megabytes de imágenes. Sin embargo, a partir de la versión 6.9, el diseño de la cuadrícula utiliza imágenes adaptables, lo que mejora significativamente el rendimiento del backend para los sitios que utilizan un gran número de imágenes.

Otros cambios destacables en las DataViews son:

  • Se han introducido filtros bloqueados que permiten ver los efectos de los filtros sin modificarlos. Esto es útil para las vistas preconfiguradas.
  • Se ha implementado un nuevo control Editar para el campo date.
  • Ahora se puede personalizar el estado vacío de las DataViews, lo que permite personalizar el mensaje o proporcionar un nodo React para una mayor personalización.

Para obtener una lista completa de las novedades y cambios en las APIs de DataViews y DataForm, consulta las notas de desarrollo y los PR #70567 y #70578.

Mejoras en la API de Interactividad

Como su nombre indica, la API de Interactividad permite a los desarrolladores crear bloques interactivos que reaccionan en tiempo real a las interacciones del usuario. En resumen, se trata de una herramienta para construir experiencias de usuario ricas y hacer que los sitios sean atractivos, dinámicos y atrayentes.

Introducida por primera vez en WordPress 6.5, la API de interactividad recibe importantes actualizaciones en esta versión. A continuación se muestran algunas de las novedades más interesantes.

Añadir IDs a las directivas de la API de Interactividad

Ahora puedes añadir IDs a las directivas de la API de Interactividad. Esta funcionalidad es útil porque te permite evitar la limitación de no poder utilizar varios atributos con el mismo nombre en el mismo elemento HTML.

Para asignar un ID a una directiva, añade un guión triple (---) seguido del ID, como en el siguiente ejemplo:

<div
	data-wp-watch---my-unique-id="callbacks.firstWatch"
	data-wp-watch---another-id="callbacks.secondWatch"
></div>

Carga de módulos de script y hojas de estilo

Este cambio permite una navegación del lado del cliente más completa y fluida. Ahora WordPress sustituye las hojas de estilo y carga los módulos de script «después» de la navegación del lado del cliente. Esto tiene implicaciones significativas.

  • El nuevo algoritmo reutiliza las hojas de estilo compartidas con páginas anteriores, carga las nuevas que no estaban presentes en esas páginas y desactiva las que no se utilizan. Esto minimiza las peticiones de red.
  • Los módulos de script también se gestionan de forma más eficiente gracias a las nuevas definiciones de importmap.
  • Por último, la precarga previa carga todas las hojas de estilo y módulos de script que aún no se han precargado.

Regiones de enrutamiento dentro de elementos interactivos

Otra novedad es la compatibilidad con las regiones de enrutador dentro de elementos interactivos. Anteriormente, la región de enrutador — el área de la página que se actualiza cuando el usuario hace clic en un enlace — tenía que ser un elemento interactivo raíz. Esto significaba que el contenido no se actualizaba si la región de enrutador se encontraba dentro de otro elemento interactivo. WordPress 6.9 cambia las cosas, ya que soporta la posibilidad de colocar regiones de enrutador dentro de elementos interactivos.

Nueva propiedad attachTo para las regiones enrutadoras

Las regiones de enrutamiento ahora aceptan una nueva propiedad attachTo que puede definirse dentro de data-wp-router-region directive. Gracias a esta nueva propiedad, la región de enrutamiento ahora puede renderizarse incluso cuando no está presente en la página inicial. El valor de attachTo debe ser un selector CSS que apunte al elemento padre donde se inyectará la región de enrutamiento. Aquí tienes un ejemplo de las notas de desarrollo:

<div
	data-wp-interactive="example"
	data-wp-router-region='{ "id": "example/region", "attachTo": "body" }'
>
	I'm in a new region!
</div>

Sincronización de getServerState y getServerContext

Se han mejorado las funciones getServerState() y getServerContext(). Ahora, cuando estas funciones rastrean un valor que no cambia durante la navegación por el lado del cliente, los valores se restablecen. Además, sólo se conservan las propiedades de la página actual, mientras que se eliminan las de páginas anteriores.

Para una visión más detallada de las mejoras de la API de Interactividad con ejemplos de código, consulta Mejoras en la navegación del cliente de la API de Interactividad en WordPress 6.9 y Cambios en la API de Interactividad en WordPress 6.9.

Para una visión completa de la API de Interactividad, consulta nuestra guía en profundidad.

Actualizaciones adicionales para desarrolladores

WordPress 6.9 introduce una serie de actualizaciones para desarrolladores. Aquí tienes una lista rápida de notas para desarrolladores:

De cara al futuro: de WordPress 6.9 a 7.0

WordPress 6.9 introduce mejoras significativas en el editor de bloques, las APIs y los flujos de trabajo colaborativos, actualizaciones que seguirán evolucionando en 7.0. A medida que la plataforma se vuelve más dinámica y está más profundamente conectada a las herramientas impulsadas por la IA, disponer de un alojamiento orientado al rendimiento es cada vez más importante. Si te estás preparando para la versión 6.9 o planificando lo que vendrá después, explora los planes de Kinsta para impulsar tus proyectos de WordPress con confianza.

Carlo Daniele Kinsta

Carlo es un diseñador y desarrollador de front-end freelance. Cuando escribe artículos y tutoriales, Carlo se ocupa principalmente de los estándares web, pero cuando juega con sitios web, su mejor compañero de trabajo es WordPress.