{"id":46900,"date":"2022-01-19T14:34:01","date_gmt":"2022-01-19T13:34:01","guid":{"rendered":"https:\/\/kinsta.com\/es\/?p=46900&#038;preview=true&#038;preview_id=46900"},"modified":"2025-01-31T14:57:15","modified_gmt":"2025-01-31T13:57:15","slug":"wordpress-5-9","status":"publish","type":"post","link":"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/","title":{"rendered":"Novedades de WordPress 5.9 &#8211; Full Site Editing, Estilos Globales, Bloques, Patrones, APIs, Mejoras UI y Mucho M\u00e1s"},"content":{"rendered":"<p>\u00a1Ya est\u00e1 aqu\u00ed <a href=\"https:\/\/wordpress.org\/news\/2022\/01\/josephine\/\">WordPress 5.9 Josephine<\/a>! El lanzamiento de la primera versi\u00f3n de WordPress del a\u00f1o estaba previsto inicialmente para el 14 de diciembre de 2021. Debido a varios problemas abiertos y errores no resueltos, la <a href=\"https:\/\/make.wordpress.org\/core\/2021\/11\/22\/wordpress-5-9-revised-release-schedule\/\">versi\u00f3n final se hab\u00eda retrasado<\/a> y finalmente se ha lanzado el 25 de enero de 2022.<\/p>\n<p>Si te preguntas qu\u00e9 hay de nuevo en WordPress 5.9, la respuesta corta es la <strong>edici\u00f3n completa del sitio<\/strong> (FSE- Full Site Editing).<\/p>\n<p>Y, de hecho, muchas de las caracter\u00edsticas de la versi\u00f3n 5.9 s\u00f3lo est\u00e1n disponibles si utilizas un tema compatible con el Full Site Editing del sitio, como el nuevo tema por defecto, <a href=\"https:\/\/kinsta.com\/es\/blog\/temas-de-twenty-twenty-two\/\">Twenty Twenty-Two<\/a>.<\/p>\n<figure id=\"attachment_110731\" aria-describedby=\"caption-attachment-110731\" style=\"width: 2560px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-110731\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/tt2.jpg\" alt=\"Twenty Twenty-Two preview, showing the text \"Category: Birds\" and pictures of various types of birds.\" width=\"2560\" height=\"1752\"><figcaption id=\"caption-attachment-110731\" class=\"wp-caption-text\">Una vista previa de Twenty Twenty-Two, el nuevo tema por defecto de WordPress. (Fuente de la imagen: <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/06\/introducing-twenty-twenty-two\/\">WordPress.org<\/a>)<\/figcaption><\/figure>\n<p>Con WordPress 5.9, llegamos al coraz\u00f3n de la segunda fase de la <a href=\"https:\/\/wordpress.org\/about\/roadmap\/\">hoja de ruta de Gutenberg<\/a>: la <strong>fase de personalizaci\u00f3n<\/strong>, que se centra principalmente en el Full Site Editing, los patrones de bloques, el directorio de bloques y los temas basados en bloques.<\/p>\n<blockquote><p><em>Con la 5.9, que saldr\u00e1 el mes que viene, estamos -dir\u00eda- en el MVP, el Producto M\u00ednimo Viable de esta fase de personalizaci\u00f3n de Gutenberg.<\/em><\/p><\/blockquote>\n<p>Estas palabras de Matt Mullenweg en <a href=\"https:\/\/wordpress.tv\/2021\/12\/15\/matt-mullenweg-2021-state-of-the-word\/\">2021 State of the Word<\/a> resumen mejor las caracter\u00edsticas clave de la nueva versi\u00f3n de WordPress.<\/p>\n<figure id=\"attachment_113486\" aria-describedby=\"caption-attachment-113486\" style=\"width: 1940px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-113486\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/gutenberg-roadmap-2.jpg\" alt=\"The Gutenberg roadmap, showing four blocks for their four main goals for improvement: easier editing, customization, collaboration, and multilingual.\" width=\"1940\" height=\"1120\"><figcaption id=\"caption-attachment-113486\" class=\"wp-caption-text\">La hoja de ruta de Gutenberg. (Fuente de la imagen: <a href=\"https:\/\/wordpress.tv\/2021\/12\/15\/matt-mullenweg-2021-state-of-the-word\/\">Matt Mullenweg: 2021 State of the Word<\/a>)<\/figcaption><\/figure>\n<p>Dicho esto, \u00bfqu\u00e9 novedades presenta la primera versi\u00f3n de WordPress de 2022?<\/p>\n<p>\u00a1Averig\u00fc\u00e9moslo!<\/p>\n<div><\/div><kinsta-auto-toc heading=\"Table of Contents\" exclude=\"last\" list-style=\"arrow\" selector=\"h2\" count-number=\"-1\"><\/kinsta-auto-toc>\n<h2>Estilos globales: Una interfaz gr\u00e1fica para theme. <strong>json<\/strong><\/h2>\n<p>Con el <a href=\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-8\/#block-settings-and-styles-with-themejson\">lanzamiento de WordPress 5.8<\/a> en 2021, la manipulaci\u00f3n del archivo <strong><a href=\"https:\/\/developer.wordpress.org\/block-editor\/reference-guides\/theme-json-reference\/\">theme.json<\/a><\/strong> se convirti\u00f3 en la forma est\u00e1ndar de los desarrolladores de temas para personalizar la configuraci\u00f3n y los estilos del editor.<\/p>\n<p>WordPress 5.9 lleva las cosas al siguiente nivel al introducir una interfaz gr\u00e1fica que permite a los usuarios personalizar los <a href=\"https:\/\/kinsta.com\/es\/blog\/temas-de-twenty-twenty-two\/#twenty-twentytwo-at-its-core-a-quick-overview-of-themejson\">preajustes de estilo<\/a> para sus sitios web, ya sea de forma global o a nivel de bloque, sin escribir una sola l\u00ednea de c\u00f3digo.<\/p>\n<p>El mecanismo de Estilos Globales deber\u00eda alterar significativamente la forma en que est\u00e1s acostumbrado a personalizar la apariencia de tus sitios web, ya que <a href=\"https:\/\/make.wordpress.org\/design\/handbook\/focuses\/global-styles\/\">los Estilos Globales<\/a> afectan a varios aspectos del dise\u00f1o de los sitios de WordPress.<\/p>\n<p>En primer lugar, la interfaz de Estilos Globales sustituye al <a href=\"https:\/\/kinsta.com\/es\/blog\/como-personalizar-tema-wordpress\/#customizing-your-theme-via-the-customizer\">Personalizador<\/a> y es ahora la \u00fanica forma de personalizar la configuraci\u00f3n y los estilos con los temas en bloque. Asimismo, ya no ser\u00e1n necesarias las complejas p\u00e1ginas de administraci\u00f3n de opciones de temas. Esto proporciona una nueva forma est\u00e1ndar de configurar los ajustes y estilos del tema y, al mismo tiempo, deber\u00eda agilizar el flujo de trabajo de desarrollo del tema.<\/p>\n<p>Con los Estilos Globales, los usuarios de WordPress ganan m\u00e1s control sobre la presentaci\u00f3n de sus sitios web, tanto globalmente como por tipo de bloque, m\u00e1s all\u00e1 del contexto de las p\u00e1ginas o entradas individuales.<\/p>\n<p>Ahora hay una nueva barra lateral en el editor del sitio, en cuya parte superior encontrar\u00e1s un peque\u00f1o panel de vista previa y cuatro componentes en el siguiente orden:<\/p>\n<ul>\n<li><a href=\"#typography\">Tipograf\u00eda<\/a><\/li>\n<li><a href=\"#colors\">Colores<\/a><\/li>\n<li><a href=\"#layout\">Dise\u00f1o<\/a><\/li>\n<li><a href=\"#blocks\">Bloques<\/a><\/li>\n<\/ul>\n<p>Podemos esperar que se <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/34574\">a\u00f1adan nuevos componentes con el tiempo<\/a>.<\/p>\n<figure id=\"attachment_112441\" aria-describedby=\"caption-attachment-112441\" style=\"width: 1962px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112441\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/global-styles-sidebar.jpg\" alt=\"The Global Styles sidebar open on a WordPress page that's using the Twenty Twenty-Two theme, showing typography options such as \"Colors\" and \"Layout\".\" width=\"1962\" height=\"1290\"><figcaption id=\"caption-attachment-112441\" class=\"wp-caption-text\">La barra lateral de Estilos Globales con el <a href=\"https:\/\/wordpress.org\/themes\/blockbase\/\">tema Blockbase<\/a> de Automattic.<\/figcaption><\/figure>\n<p>Echemos un vistazo m\u00e1s de cerca a la nueva interfaz.<\/p>\n\n<h3>Vista previa de los estilos<\/h3>\n<p>El primer elemento de la barra lateral de Estilos Globales es un panel de vista previa. Este panel te permite comprobar el resultado de tus personalizaciones y es especialmente \u00fatil cuando tus cambios se aplican a elementos no visibles en el lienzo del editor del sitio.<\/p>\n<p>La siguiente imagen muestra tres combinaciones de estilos diferentes comparadas:<\/p>\n<figure id=\"attachment_112425\" aria-describedby=\"caption-attachment-112425\" style=\"width: 1826px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112425\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/global-styles-preview.jpg\" alt=\"Global Styles previews for three styles of different colors (green, yellow, and navy) shown side by side.\" width=\"1826\" height=\"1230\"><figcaption id=\"caption-attachment-112425\" class=\"wp-caption-text\">Vista previa de Estilos Globales comparada.<\/figcaption><\/figure>\n<h3>Tipograf\u00eda<\/h3>\n<p>El panel de Tipograf\u00eda es donde controlas la tipograf\u00eda de tu sitio web. Por supuesto, los controles disponibles en este panel dependen de la configuraci\u00f3n de tu <strong>theme.json<\/strong>.<\/p>\n<p>Por ejemplo, el tema <a href=\"https:\/\/wordpress.org\/themes\/tt1-blocks\/\">Twenty Twenty-One Blocks<\/a> (TT1 Blocks) declara las siguientes propiedades de tipograf\u00eda:<\/p>\n<pre><code class=\"language-json\">\"settings\": {\n\t\"typography\": {\n\t\t\"customLineHeight\": true,\n\t\t\"fontSizes\": [],\n\t\t\"fontFamilies\": []\n\t}\n}<\/code><\/pre>\n<p>La siguiente imagen muestra los ajustes de tipograf\u00eda resultantes en la barra lateral de Estilos Globales:<\/p>\n<figure id=\"attachment_112443\" aria-describedby=\"caption-attachment-112443\" style=\"width: 1790px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112443\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/tt1b-typography-settings.jpg\" alt=\"Typography settings in TT1 Blocks Global Styles, showing three side-by-side panels with various typography options such as font family, text size, and colors.\" width=\"1790\" height=\"1146\"><figcaption id=\"caption-attachment-112443\" class=\"wp-caption-text\">Configuraci\u00f3n de la tipograf\u00eda en los Estilos Globales de TT1 Blocks.<\/figcaption><\/figure>\n<p>Profundicemos un poco m\u00e1s y veamos c\u00f3mo el tema TT1 Blocks declara <code>fontFamilies<\/code>:<\/p>\n<pre><code class=\"language-json\">\"fontFamilies\": [\n\t{\n\t\t\"fontFamily\": \"-apple-system,BlinkMacSystemFont,\"Segoe UI\",Roboto,Oxygen-Sans,Ubuntu,Cantarell,\"Helvetica Neue\",sans-serif\",\n\t\t\"slug\": \"system-font\",\n\t\t\"name\": \"System Font\"\n\t},\n\t{\n\t\t\"fontFamily\": \"Helvetica Neue, Helvetica, Arial, sans-serif\",\n\t\t\"slug\": \"helvetica-arial\"\n\t},\n\t{\n\t\t\"fontFamily\": \"Geneva, Tahoma, Verdana, sans-serif\",\n\t\t\"slug\": \"geneva-verdana\"\n\t},\n\t{\n\t\t\"fontFamily\": \"Cambria, Georgia, serif\",\n\t\t\"slug\": \"cambria-georgia\"\n\t},\n\t{\n\t\t\"fontFamily\": \"Hoefler Text, Baskerville Old Face, Garamond, Times New Roman, serif\",\n\t\t\"slug\": \"hoefler-times-new-roman\"\n\t}\n]<\/code><\/pre>\n<p>Puedes comprobar estas familias tipogr\u00e1ficas en el panel de vista previa de Estilos Globales:<\/p>\n<figure id=\"attachment_112427\" aria-describedby=\"caption-attachment-112427\" style=\"width: 1682px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112427\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/tt1b-font-preview.jpg\" alt=\"Six different previews of the same text (\"Aa\") with different font families applied.\" width=\"1682\" height=\"804\"><figcaption id=\"caption-attachment-112427\" class=\"wp-caption-text\">Familias de fuentes disponibles en Twenty Twenty-One Blocks.<\/figcaption><\/figure>\n<h3>Colores<\/h3>\n<p>En la secci\u00f3n Colores, puedes ver y editar las paletas de colores y personalizar el color de varios elementos del sitio.<\/p>\n<figure id=\"attachment_112428\" aria-describedby=\"caption-attachment-112428\" style=\"width: 1522px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112428 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/colors-panel-in-tt1b.jpg\" alt=\"Panel de colores en los Bloques TT1, mostrando una paleta de cuatro colores diferentes (rojo, azul marino, plata y verde).\" width=\"1522\" height=\"1348\"><figcaption id=\"caption-attachment-112428\" class=\"wp-caption-text\">Paleta de colores en Twenty Twenty-One Blocks<\/figcaption><\/figure>\n<p>Al hacer clic en esos elementos, accedes a un nuevo panel en el que puedes elegir los colores de tres paletas de colores: Paleta del n\u00facleo, del tema y personalizada (lee m\u00e1s en <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/29568\">Colores por defecto, Colores del tema y Colores personalizados<\/a>).<\/p>\n<figure id=\"attachment_112445\" aria-describedby=\"caption-attachment-112445\" style=\"width: 1790px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112445 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/tt1b-color-settings.jpg\" alt=\"Configuraci\u00f3n de los colores de los bloques TT1, mostrando varios c\u00edrculos de color para tres opciones de paleta distintas: Tema, Predeterminado y Personalizado.\" width=\"1790\" height=\"1146\"><figcaption id=\"caption-attachment-112445\" class=\"wp-caption-text\">Ajustes de color en Twenty Twenty-One Blocks<\/figcaption><\/figure>\n<p>En este panel, podr\u00e1s establecer y modificar el color del elemento actual.<\/p>\n<figure id=\"attachment_112430\" aria-describedby=\"caption-attachment-112430\" style=\"width: 1522px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112430\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/color-picker-1.jpg\" alt=\"A color picker selecting a deep red color in the Global Styles panel.\" width=\"1522\" height=\"1286\"><figcaption id=\"caption-attachment-112430\" class=\"wp-caption-text\">Personalizar el color de los enlaces en Estilos Globales.<\/figcaption><\/figure>\n<h3>Dise\u00f1o<\/h3>\n<p>El \u00faltimo grupo de herramientas est\u00e1 destinado a la personalizaci\u00f3n del dise\u00f1o. En el contexto global, esto se limita al contenedor del sitio.<\/p>\n<figure id=\"attachment_112431\" aria-describedby=\"caption-attachment-112431\" style=\"width: 2404px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112431 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/global-padding-setting.jpg\" alt=\"La configuraci\u00f3n del relleno global en el panel de Estilos Globales, mostrando una alteraci\u00f3n del tama\u00f1o de los p\u00edxeles del relleno anterior.\" width=\"2404\" height=\"1350\"><figcaption id=\"caption-attachment-112431\" class=\"wp-caption-text\">Configuraci\u00f3n del dise\u00f1o en los bloques de Twenty Twenty-One.<\/figcaption><\/figure>\n<h3>Bloques<\/h3>\n<p>Con la implementaci\u00f3n del mecanismo de Estilos Globales, ahora tambi\u00e9n es posible cambiar la apariencia de bloques espec\u00edficos, como P\u00e1rrafo (tipograf\u00eda y colores), Botones (dise\u00f1o) y Columna (colores y dise\u00f1o).<\/p>\n<p>Ten en cuenta que <strong>los estilos de los bloques pueden personalizarse desde la interfaz de Estilos Globales s\u00f3lo si el bloque declara la compatibilidad con una funcionalidad espec\u00edfica<\/strong> en el archivo <strong>block.json<\/strong> correspondiente. Por ejemplo, el bloque <code>core\/post-title<\/code> admite actualmente los siguientes estilos:<\/p>\n<pre><code class=\"language-json\">\"supports\": {\n\t\"align\": [ \"wide\", \"full\" ],\n\t\"html\": false,\n\t\"color\": {\n\t\t\"gradients\": true,\n\t\t\"link\": true\n\t},\n\t\"spacing\": {\n\t\t\"margin\": true\n\t},\n\t\"typography\": {\n\t\t\"fontSize\": true,\n\t\t\"lineHeight\": true,\n\t\t\"__experimentalFontFamily\": true,\n\t\t\"__experimentalFontWeight\": true,\n\t\t\"__experimentalFontStyle\": true,\n\t\t\"__experimentalTextTransform\": true,\n\t\t\"__experimentalLetterSpacing\": true,\n\t\t\"__experimentalDefaultControls\": {\n\t\t\t\"fontSize\": true,\n\t\t\t\"fontAppearance\": true,\n\t\t\t\"textTransform\": true\n\t\t}\n\t}\n},<\/code><\/pre>\n<p>Como el bloque <code>core\/post-title<\/code> admite colores, espaciado y tipograf\u00eda, encontrar\u00e1s las entradas correspondientes en la configuraci\u00f3n de Estilos Globales del bloque T\u00edtulo de la publicaci\u00f3n.<\/p>\n<p>La siguiente imagen muestra la configuraci\u00f3n de la tipograf\u00eda, que puedes comparar f\u00e1cilmente con el c\u00f3digo anterior:<\/p>\n<figure id=\"attachment_112449\" aria-describedby=\"caption-attachment-112449\" style=\"width: 1790px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112449 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/post-tytle-typography-settings.jpg\" alt=\"Ajustes de la tipograf\u00eda del t\u00edtulo de la entrada en WordPress 5.9, mostrando una amplia variedad de opciones, incluyendo (entre muchas otras) el t\u00edtulo de la entrada (que est\u00e1 resaltado), el autor de la entrada, la tabla, el t\u00edtulo del sitio y la navegaci\u00f3n.\" width=\"1790\" height=\"1308\"><figcaption id=\"caption-attachment-112449\" class=\"wp-caption-text\">Personalizaci\u00f3n de la configuraci\u00f3n de la tipograf\u00eda del t\u00edtulo de la entrada<\/figcaption><\/figure>\n<p>Hay que tener en cuenta que WordPress 5.9 s\u00f3lo ofrece la primera implementaci\u00f3n de la interfaz de Estilos Globales. Como <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/34574\">se\u00f1ala Matias Ventura<\/a>, podemos esperar razonablemente un mayor desarrollo de la nueva funci\u00f3n de control de estilos:<\/p>\n<blockquote><p>En el futuro, habr\u00e1 flujos integrados en el sistema que te permitir\u00e1n pasar de los estilos locales a los globales, como por ejemplo, hacer personalizaciones en un bloque de botones y optar por aplicarlas globalmente a todos los botones de ese tipo.<\/p><\/blockquote>\n<p>As\u00ed que es posible que pronto veamos mejoras importantes. La imagen de abajo es s\u00f3lo un ejemplo de lo que podemos esperar:<\/p>\n<figure id=\"attachment_112432\" aria-describedby=\"caption-attachment-112432\" style=\"width: 1586px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112432 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/link-state-color.jpg\" alt=\"Una maqueta de un posible panel futuro para cambiar los colores del estado de los enlaces, incluyendo las opciones de Reposo, Pasado, Enfocado y Seleccionado.\" width=\"1586\" height=\"872\"><figcaption id=\"caption-attachment-112432\" class=\"wp-caption-text\">En el futuro, podr\u00e1s controlar el color del estado del enlace. (Fuente de la imagen <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/34574\">GitHub<\/a>)<\/figcaption><\/figure>\n<p>Otras mejoras podr\u00edan incluir la posibilidad de que <a href=\"https:\/\/github.com\/WordPress\/theme-experiments\/pull\/292\">los temas<\/a> <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/36304\">ofrezcan paletas de colores alternativas<\/a> y <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/35619\">m\u00faltiples variaciones de estilo globales<\/a>.<\/p>\n<p>https:\/\/twitter.com\/kjellr\/status\/1460270505513082881<\/p>\n<p>Los desarrolladores pueden profundizar en el mecanismo de estilo global en el art\u00edculo de soporte <a href=\"https:\/\/developer.wordpress.org\/block-editor\/how-to-guides\/themes\/theme-json\/\">Ajustes y Estilos Globales (theme.json)<\/a>. Encontrar\u00e1s ejemplos adicionales en nuestra <a href=\"https:\/\/kinsta.com\/es\/blog\/temas-de-twenty-twenty-two\/#global-styles-in-twenty-twentytwo\">introducci\u00f3n al tema por defecto Twenty Twenty-Two<\/a>.<\/p>\n<h2>El bloque de navegaci\u00f3n<\/h2>\n<p>El bloque de navegaci\u00f3n <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/15\/wordpress-5-9-feature-go-no-go-october-14-2021\/\">ha sido calificado como<\/a> \u00abuno de los bloques tem\u00e1ticos m\u00e1s impactantes\u00bb, y no tememos decir que estamos de acuerdo.<\/p>\n<p>El bloque ha estado en fase embrionaria durante un tiempo (consulta tambi\u00e9n el <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/27593\">tema de seguimiento<\/a> del bloque de navegaci\u00f3n y el <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/35521\">tema de seguimiento i2<\/a>). Aun as\u00ed, ahora que se han solucionado todos los <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/36556\">problemas pendientes y los bloqueos<\/a> enumerados como imprescindibles en WordPress 5.9, por fin podemos empezar a utilizar <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/34041\">una de las funciones m\u00e1s potentes<\/a> incorporadas al n\u00facleo <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/15\/wordpress-5-9-feature-go-no-go-october-14-2021\/\">con WordPress 5.9<\/a>.<\/p>\n<h3>Una r\u00e1pida visi\u00f3n de la interfaz del bloque de navegaci\u00f3n<\/h3>\n<p>El uso del nuevo bloque puede ser un poco confuso al principio, pero una vez que le cojas el tranquillo, apreciar\u00e1s todo su potencial.<\/p>\n<figure id=\"attachment_112667\" aria-describedby=\"caption-attachment-112667\" style=\"width: 1382px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112667\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/navigation-block-placeholder.jpg\" alt=\"The Navigation block placeholder in WordPress 5.9, showing options for the navigation panel, including \"Select menu\", \"Add all pages\", and \"Start empty\".\" width=\"1382\" height=\"404\"><figcaption id=\"caption-attachment-112667\" class=\"wp-caption-text\">El marcador de posici\u00f3n del bloque de navegaci\u00f3n<\/figcaption><\/figure>\n<p>Cuando a\u00f1ades por primera vez un bloque de navegaci\u00f3n, el marcador de posici\u00f3n del bloque ofrece tres opciones para seleccionar un men\u00fa basado en un bloque existente, crear un men\u00fa con todas las p\u00e1ginas o empezar de cero con un men\u00fa vac\u00edo.<\/p>\n<figure id=\"attachment_112672\" aria-describedby=\"caption-attachment-112672\" style=\"width: 1412px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112672\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/select-navigation-menu.jpg\" alt=\"Selecting an existing navigation menu.\" width=\"1412\" height=\"860\"><figcaption id=\"caption-attachment-112672\" class=\"wp-caption-text\">Seleccionando un men\u00fa de navegaci\u00f3n existente.<\/figcaption><\/figure>\n<p>El nuevo men\u00fa de navegaci\u00f3n tambi\u00e9n te permite importar men\u00fas creados a trav\u00e9s de la <a href=\"https:\/\/wordpress.org\/support\/article\/appearance-menus-screen\/\">pantalla de men\u00fas de apariencia<\/a> que est\u00e1 disponible con los temas cl\u00e1sicos.<\/p>\n<p>Esto significa que si est\u00e1s pasando de un tema cl\u00e1sico a un tema de bloques, no tendr\u00e1s que reconstruir tus men\u00fas existentes. S\u00f3lo tienes que elegir uno de tus \u00abmen\u00fas cl\u00e1sicos\u00bb actualmente disponibles, y se <a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/07\/the-new-navigation-block\/\">convertir\u00e1<\/a> autom\u00e1ticamente <a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/07\/the-new-navigation-block\/\">en un men\u00fa de navegaci\u00f3n basado en<\/a> bloques.<\/p>\n<figure id=\"attachment_113474\" aria-describedby=\"caption-attachment-113474\" style=\"width: 1352px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-113474\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/importing-cassic-menus.jpg\" alt=\"Selecting a classic menu.\" width=\"1352\" height=\"1280\"><figcaption id=\"caption-attachment-113474\" class=\"wp-caption-text\">Seleccionando un men\u00fa cl\u00e1sico.<\/figcaption><\/figure>\n<p>Puedes a\u00f1adir el bloque de navegaci\u00f3n en cualquier lugar de tus p\u00e1ginas. Por ejemplo, puede resultarte \u00fatil en los <a href=\"https:\/\/kinsta.com\/es\/blog\/articulos-de-forma-larga\/\">art\u00edculos largos<\/a> para crear <a href=\"https:\/\/kinsta.com\/es\/blog\/enlaces-ancla\/\">una tabla de contenidos<\/a>, que permita a los usuarios saltar a secciones de contenido espec\u00edficas.<\/p>\n<figure id=\"attachment_112673\" aria-describedby=\"caption-attachment-112673\" style=\"width: 1424px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112673\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/internal-links-navigation.jpg\" alt=\"Adding anchor links to a Navigation menu.\" width=\"1424\" height=\"1024\"><figcaption id=\"caption-attachment-112673\" class=\"wp-caption-text\">A\u00f1adiendo enlaces de anclaje a un men\u00fa de Navegaci\u00f3n.<\/figcaption><\/figure>\n<p>Los nuevos enlaces de navegaci\u00f3n se a\u00f1aden instant\u00e1neamente al bloque de navegaci\u00f3n haciendo clic en el icono del signo m\u00e1s (<strong>+<\/strong>) de la derecha (consulta tambi\u00e9n <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/14\/whats-new-in-gutenberg-11-7-october-13th\/\">las notas de la versi\u00f3n 11.7 de Gutenberg<\/a>), <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/34899\">a menos que ya se hayan a\u00f1adido otros tipos de bloques<\/a> al men\u00fa.<\/p>\n<figure id=\"attachment_112662\" aria-describedby=\"caption-attachment-112662\" style=\"width: 1416px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112662\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/navigation-block-appender.jpg\" alt=\"The Navigation block appender, showing navigation links.\" width=\"1416\" height=\"1246\"><figcaption id=\"caption-attachment-112662\" class=\"wp-caption-text\">El anexo del bloque de Navegaci\u00f3n, mostrando los enlaces de navegaci\u00f3n.<\/figcaption><\/figure>\n<p>Al hacer clic en el bot\u00f3n <strong>Editar<\/strong> de la barra de herramientas del bloque de Navegaci\u00f3n, un elemento del men\u00fa se convierte en un enlace personalizado. Esto te permite a\u00f1adir, editar, reordenar y eliminar elementos individualmente.<\/p>\n<figure id=\"attachment_112674\" aria-describedby=\"caption-attachment-112674\" style=\"width: 1426px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112674\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/converting-navigation-menu-items.jpg\" alt=\"Converting a navigation menu to individual page links.\" width=\"1426\" height=\"770\"><figcaption id=\"caption-attachment-112674\" class=\"wp-caption-text\">Convirtiendo un men\u00fa de navegaci\u00f3n en enlaces de p\u00e1ginas individuales.<\/figcaption><\/figure>\n<p>Tambi\u00e9n puedes <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/14\/whats-new-in-gutenberg-11-7-october-13th\/\">transformar los enlaces en bloques<\/a> haciendo clic en el bot\u00f3n <strong>Transformar<\/strong> de la barra de herramientas de bloques. Esto te permite a\u00f1adir <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/34978\">bloques espec\u00edficos directamente al men\u00fa de navegaci\u00f3n<\/a>.<\/p>\n<figure id=\"attachment_112675\" aria-describedby=\"caption-attachment-112675\" style=\"width: 1398px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112675\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/transform-links-to-blocks-in-navigation-menu.jpg\" alt=\"Transforming navigation links to blocks.\" width=\"1398\" height=\"700\"><figcaption id=\"caption-attachment-112675\" class=\"wp-caption-text\">Transformando enlaces de navegaci\u00f3n en bloques.<\/figcaption><\/figure>\n<p>Los bloques Enlace personalizado, Espaciador, Logotipo del sitio, Enlace de inicio, Iconos sociales y B\u00fasqueda est\u00e1n ahora expuestos a los usuarios al a\u00f1adir bloques a los men\u00fas de navegaci\u00f3n.<\/p>\n<p>En la barra lateral de Configuraci\u00f3n, encontrar\u00e1s un amplio conjunto de opciones para controlar varios aspectos de tus men\u00fas de navegaci\u00f3n.<\/p>\n<p>El panel de Dise\u00f1o incluye controles para la <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/35077\">justificaci\u00f3n<\/a>, la orientaci\u00f3n y la envoltura.<\/p>\n<figure id=\"attachment_112666\" aria-describedby=\"caption-attachment-112666\" style=\"width: 1688px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112666\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/navigation-block-layout-settings.jpg\" alt=\"Navigation block layout settings.\" width=\"1688\" height=\"644\"><figcaption id=\"caption-attachment-112666\" class=\"wp-caption-text\">Configuraci\u00f3n del dise\u00f1o del bloque de navegaci\u00f3n<\/figcaption><\/figure>\n<p>El bloque de navegaci\u00f3n tambi\u00e9n cuenta con un panel de configuraci\u00f3n de <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/28\/whats-new-in-gutenberg-11-8-0-27-october\/\">visualizaci\u00f3n mejorado<\/a> con una opci\u00f3n para un men\u00fa de hamburguesa siempre activo.<\/p>\n<figure id=\"attachment_112664\" aria-describedby=\"caption-attachment-112664\" style=\"width: 1682px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112664\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/navigation-block-display-settings.jpg\" alt=\"Navigation block Display settings panel for the Navigation block.\" width=\"1682\" height=\"1008\"><figcaption id=\"caption-attachment-112664\" class=\"wp-caption-text\">Un panel mejorado de ajustes de visualizaci\u00f3n para el bloque de Navegaci\u00f3n.<\/figcaption><\/figure>\n<p>Tambi\u00e9n puedes personalizar el texto y los colores de fondo de tus men\u00fas y submen\u00fas.<\/p>\n<figure id=\"attachment_112663\" aria-describedby=\"caption-attachment-112663\" style=\"width: 1686px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112663\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/navigation-block-color-settings.jpg\" alt=\"Navigation block color settings.\" width=\"1686\" height=\"1162\"><figcaption id=\"caption-attachment-112663\" class=\"wp-caption-text\">Configuraci\u00f3n del color del bloque de navegaci\u00f3n.<\/figcaption><\/figure>\n<p>Otra \u00fatil adici\u00f3n <a href=\"https:\/\/make.wordpress.org\/core\/2021\/09\/17\/whats-new-in-gutenberg-11-5-16-september\/\">a\u00f1adida recientemente<\/a> al bloque de Navegaci\u00f3n es la <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/33991\">compatibilidad con la separaci\u00f3n de bloques<\/a>, que a\u00f1ade la posibilidad de que los usuarios controlen la distancia entre los elementos del men\u00fa.<\/p>\n<figure id=\"attachment_112669\" aria-describedby=\"caption-attachment-112669\" style=\"width: 1684px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112669\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/navigation-block-spacing.jpg\" alt=\"Navigation block spacing.\" width=\"1684\" height=\"1114\"><figcaption id=\"caption-attachment-112669\" class=\"wp-caption-text\">Control del espacio entre bloques en el bloque de Navegaci\u00f3n.<\/figcaption><\/figure>\n<p>El panel de Tipograf\u00eda proporciona un conjunto de controles para la familia de fuentes, la apariencia, la altura de las l\u00edneas, la decoraci\u00f3n y las may\u00fasculas y min\u00fasculas. Todos estos controles pueden activarse y desactivarse desde un men\u00fa desplegable que aparece cuando haces clic en el icono de la elipsis de la derecha.<\/p>\n<figure id=\"attachment_112670\" aria-describedby=\"caption-attachment-112670\" style=\"width: 1688px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112670\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/navigation-block-typography-settings.jpg\" alt=\"Navigation block typography settings.\" width=\"1688\" height=\"964\"><figcaption id=\"caption-attachment-112670\" class=\"wp-caption-text\">Configuraci\u00f3n de la tipograf\u00eda del bloque de navegaci\u00f3n.<\/figcaption><\/figure>\n<h3>El bloque de navegaci\u00f3n: Bajo el cap\u00f3<\/h3>\n<p>Los datos del bloque de navegaci\u00f3n se almacenan en la base de datos utilizando un <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/35746\">tipo de post dedicado a<\/a> <code>wp_navigation<\/code>.<\/p>\n<p>\u00bfPor qu\u00e9 es esto interesante para los usuarios de WordPress y c\u00f3mo funciona?<\/p>\n<p>Digamos que has creado un men\u00fa de navegaci\u00f3n compuesto por dos enlaces personalizados y un cuadro de b\u00fasqueda. Con el <a href=\"https:\/\/kinsta.com\/es\/blog\/temas-de-twenty-twenty-two\/\">tema Twenty Twenty-Two<\/a> instalado, el men\u00fa podr\u00eda tener el aspecto que se muestra en la siguiente imagen:<\/p>\n<figure id=\"attachment_112665\" aria-describedby=\"caption-attachment-112665\" style=\"width: 1610px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112665\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/navigation-block-example.jpg\" alt=\"Navigation block example.\" width=\"1610\" height=\"246\"><figcaption id=\"caption-attachment-112665\" class=\"wp-caption-text\">Ejemplo de bloque de navegaci\u00f3n<\/figcaption><\/figure>\n<p>El bloque de navegaci\u00f3n anterior se almacena en la base de datos como <code>wp_navigation<\/code> post type como sigue:<\/p>\n<pre><code class=\"language-html\">&lt;!-- wp:navigation-link {\"label\":\"Contacts\",\"type\":\"page\",\"id\":7,\"url\":\"http:\/\/wordpress-59.local\/?page_id=7\",\"kind\":\"post-type\",\"isTopLevelLink\":true} \/--&gt;\n\n&lt;!-- wp:navigation-link {\"label\":\"About Us\",\"type\":\"page\",\"id\":10,\"url\":\"http:\/\/wordpress-59.local\/?page_id=10\",\"kind\":\"post-type\",\"isTopLevelLink\":true} \/--&gt;\n\n&lt;!-- wp:search {\"showLabel\":false,\"placeholder\":\"Search the site\",\"buttonPosition\":\"button-inside\",\"buttonUseIcon\":true} \/--&gt;<\/code><\/pre>\n<p>Almacenar el contenido del bloque de Navegaci\u00f3n en la base de datos permite a los usuarios utilizar los mismos men\u00fas de navegaci\u00f3n en diferentes temas de bloques. Si el men\u00fa no es visible de inmediato, basta con elegir el men\u00fa de navegaci\u00f3n deseado en el selector de men\u00fas (ver tambi\u00e9n el tema <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/36087\">#36087<\/a> y el PR <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/36178\">#36178<\/a>).<\/p>\n<p>La siguiente imagen muestra el men\u00fa anterior con <a href=\"https:\/\/kinsta.com\/es\/blog\/twenty-twenty-one-tema\/#the-twenty-twentyone-blocks-experiment\">el tema de bloques Twenty-One<\/a>:<\/p>\n<figure id=\"attachment_112671\" aria-describedby=\"caption-attachment-112671\" style=\"width: 1158px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112671\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/navigation-menu-selector-tt1b.jpg\" alt=\"Select menu in Twenty Twenty-One Blocks.\" width=\"1158\" height=\"708\"><figcaption id=\"caption-attachment-112671\" class=\"wp-caption-text\">Selecciona el men\u00fa en Twenty Twenty-One Blocks.<\/figcaption><\/figure>\n<p>El bloque Navegaci\u00f3n ha pasado por varias iteraciones. Puedes profundizar en cada implementaci\u00f3n en las notas de la versi\u00f3n de Gutenberg <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/14\/whats-new-in-gutenberg-11-7-october-13th\/\">11.7<\/a>, <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/28\/whats-new-in-gutenberg-11-8-0-27-october\/\">11.8<\/a> y <a href=\"https:\/\/make.wordpress.org\/core\/2021\/11\/12\/whats-new-in-gutenberg-11-9-0-10-november\/\">11.9<\/a>.<\/p>\n<p>Tambi\u00e9n puedes leer m\u00e1s sobre el bloque de navegaci\u00f3n en el <a href=\"https:\/\/wordpress.org\/support\/article\/navigation-block\/\">art\u00edculo<\/a> <a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/07\/the-new-navigation-block\/\">The new Navigation block dev note<\/a> y <a href=\"https:\/\/wordpress.org\/support\/article\/navigation-block\/\">Navigation block support<\/a>.<\/p>\n<h2>Galer\u00edas de im\u00e1genes, im\u00e1genes destacadas e iconos del sitio<\/h2>\n<p>Con el objetivo de que las im\u00e1genes se comporten de forma m\u00e1s coherente en diferentes contextos, WordPress 5.9 ofrece nuevas caracter\u00edsticas y mejoras en varios bloques. El bloque Galer\u00eda ha sido completamente revisado, mientras que varios cambios en los bloques Imagen destacada e Icono del sitio dan a los usuarios un control m\u00e1s granular sobre las respectivas im\u00e1genes.<\/p>\n<h3>Un bloque de galer\u00eda refactorizado<\/h3>\n<p>En WordPress 5.8, la capacidad de personalizar la apariencia de las im\u00e1genes en las galer\u00edas es algo limitada. No hab\u00eda forma de cambiar el estilo de la imagen ni de aplicar un filtro de duotono.<\/p>\n<p>Adem\u00e1s, faltaban funciones importantes en las im\u00e1genes de las galer\u00edas, como a\u00f1adir enlaces personalizados a las im\u00e1genes individuales de una galer\u00eda.<\/p>\n<p>Para entender mejor la raz\u00f3n de esta asimetr\u00eda entre las im\u00e1genes en los dos contextos diferentes de una sola imagen y una imagen en una galer\u00eda, echemos un vistazo al bloque Galer\u00eda en la vista de C\u00f3digo en WordPress 5.8:<\/p>\n<figure id=\"attachment_112457\" aria-describedby=\"caption-attachment-112457\" style=\"width: 1896px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112457\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/gallery-block-code-view-wordpress-5-8.jpg\" alt=\"Gallery block in code view in WordPress 5.8.\" width=\"1896\" height=\"494\"><figcaption id=\"caption-attachment-112457\" class=\"wp-caption-text\">Bloque de Galer\u00eda en la vista de c\u00f3digo en WordPress 5.8.<\/figcaption><\/figure>\n<p>Ten en cuenta que los detalles de las im\u00e1genes s\u00f3lo se almacenan en el delimitador del bloque de la Galer\u00eda (consulta tambi\u00e9n <a href=\"https:\/\/kinsta.com\/es\/blog\/bloques-gutenberg\/#what-is-a-gutenberg-block\">\u00bfQu\u00e9 es un bloque Gutenberg?<\/a>).<\/p>\n<figure id=\"attachment_112461\" aria-describedby=\"caption-attachment-112461\" style=\"width: 1822px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112461\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/gallery-block-wordpress-5-8.jpg\" alt=\"Gallery block in WordPress 5.8.\" width=\"1822\" height=\"778\"><figcaption id=\"caption-attachment-112461\" class=\"wp-caption-text\">Inspecci\u00f3n del bloque Galer\u00eda en WordPress 5.8.<\/figcaption><\/figure>\n<p>Esto hizo que las <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/11436\">im\u00e1genes individuales se comportaran de forma diferente a las im\u00e1genes de las galer\u00edas<\/a>.<\/p>\n<p>Para que las im\u00e1genes se comporten de forma coherente en los dos contextos diferentes, WordPress 5.9 introduce <a href=\"https:\/\/wordpress.org\/news\/2021\/09\/upcoming-gallery-block-improvements\/\">un bloque Galer\u00eda completamente refactorizado<\/a>, que ahora <a href=\"https:\/\/make.wordpress.org\/core\/2021\/08\/20\/gallery-block-refactor-dev-note\/\">se comporta como un contenedor para una colecci\u00f3n de elementos de figuras<\/a> en lugar de una lista desordenada de im\u00e1genes.<\/p>\n<p>En WordPress 5.9, las im\u00e1genes de la galer\u00eda se anidan utilizando <a href=\"https:\/\/kinsta.com\/es\/blog\/bloques-gutenberg\/#innerblocks-component\">las APIs del n\u00facleo <code>innerBlocks<\/code> <\/a>, y cada imagen almacena su propio conjunto de detalles, exactamente como las im\u00e1genes individuales.<\/p>\n<figure id=\"attachment_112458\" aria-describedby=\"caption-attachment-112458\" style=\"width: 1896px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112458\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/gallery-block-code-view-wordpress-5-9.jpg\" alt=\"Gallery block in code view in WordPress 5.9.\" width=\"1896\" height=\"628\"><figcaption id=\"caption-attachment-112458\" class=\"wp-caption-text\">Bloque de galer\u00eda en la vista de c\u00f3digo en WordPress 5.9<\/figcaption><\/figure>\n<p>Se trata de una gran mejora, ya que <strong>las im\u00e1genes del bloque Galer\u00eda admiten ahora las mismas caracter\u00edsticas disponibles en los bloques de Imagen principales<\/strong>, como las dimensiones de la imagen y <a href=\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-8\/#duotone-block-support\">los filtros de duotono<\/a>, as\u00ed como las caracter\u00edsticas est\u00e1ndar del bloque, como las funcionalidades de arrastrar y soltar, copiar, duplicar y eliminar.<\/p>\n<figure id=\"attachment_112462\" aria-describedby=\"caption-attachment-112462\" style=\"width: 1604px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112462\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/gallery-block-wordpress-5-9.jpg\" alt=\"Gallery block in WordPress 5.9.\" width=\"1604\" height=\"864\"><figcaption id=\"caption-attachment-112462\" class=\"wp-caption-text\">Inspecci\u00f3n del bloque Galer\u00eda en WordPress 5.9<\/figcaption><\/figure>\n<p>Con el nuevo bloque Galer\u00eda, podr\u00e1s estilizar las im\u00e1genes individualmente. Esto otorga una amplia gama de oportunidades de personalizaci\u00f3n.<\/p>\n<p>La imagen de abajo muestra varias im\u00e1genes en una galer\u00eda, cada una con esquinas redondeadas de forma diferente:<\/p>\n<figure id=\"attachment_112459\" aria-describedby=\"caption-attachment-112459\" style=\"width: 1642px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112459\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/gallery-block-full-wordpress-5-9.jpg\" alt=\"The new Gallery block.\" width=\"1642\" height=\"1274\"><figcaption id=\"caption-attachment-112459\" class=\"wp-caption-text\">El nuevo bloque Galer\u00eda es una envoltura para los bloques individuales de Imagen.<\/figcaption><\/figure>\n<p>Tambi\u00e9n puedes utilizar diferentes filtros de duotono en distintas im\u00e1genes de la misma galer\u00eda.<\/p>\n<figure id=\"attachment_112460\" aria-describedby=\"caption-attachment-112460\" style=\"width: 1728px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112460\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/gallery-block-image-duotone-filters.jpg\" alt=\"Duotone filters applied to different images in a Gallery block.\" width=\"1728\" height=\"1048\"><figcaption id=\"caption-attachment-112460\" class=\"wp-caption-text\">Diferentes filtros de duotono aplicados a diferentes im\u00e1genes en un bloque de Galer\u00eda<\/figcaption><\/figure>\n<p>Y, por supuesto, puedes asignar una clase CSS espec\u00edfica a cada imagen, lo que te da superpoderes adicionales para a\u00f1adir cualquier personalizaci\u00f3n que necesites a las im\u00e1genes de tu galer\u00eda.<\/p>\n<p>Para ver m\u00e1s de cerca el nuevo bloque de Galer\u00eda, consulta tambi\u00e9n <a href=\"https:\/\/make.wordpress.org\/core\/2021\/08\/20\/gallery-block-refactor-dev-note\/\">Gallery Block Refactor Dev Note<\/a>, <a href=\"https:\/\/wordpress.org\/news\/2021\/09\/upcoming-gallery-block-improvements\/\">Pr\u00f3ximas mejoras del bloque de Galer\u00eda<\/a> y <a href=\"https:\/\/make.wordpress.org\/core\/2021\/09\/01\/whats-new-in-gutenberg-11-4-1-september\/\">las notas de la versi\u00f3n 11.4 de Gutenberg<\/a>.<\/p>\n<h3>Mejoras en las im\u00e1genes destacadas<\/h3>\n<p>Tambi\u00e9n se han introducido varias mejoras en el bloque Imagen destacada.<\/p>\n<h4>Controles de dimensiones b\u00e1sicas<\/h4>\n<p>El bloque Imagen destacada cuenta ahora con un nuevo panel de configuraci\u00f3n de Dimensiones que proporciona <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/31634\">controles de altura, anchura y escala<\/a>.<\/p>\n<figure id=\"attachment_112828\" aria-describedby=\"caption-attachment-112828\" style=\"width: 2032px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112828\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/featured-image-dimensions-control-1.jpg\" alt=\"Featured Image Dimensions panel.\" width=\"2032\" height=\"1128\"><figcaption id=\"caption-attachment-112828\" class=\"wp-caption-text\">Panel de Dimensiones de la Imagen Destacada.<\/figcaption><\/figure>\n<p>El control de las dimensiones tambi\u00e9n se aplica a las im\u00e1genes destacadas en los bloques del Bucle de Consulta, como se muestra en la siguiente imagen:<\/p>\n<figure id=\"attachment_112829\" aria-describedby=\"caption-attachment-112829\" style=\"width: 2876px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112829\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/featured-image-dimensions-control-2.jpg\" alt=\"Featured Image dimensions controls in a Query Loop block.\" width=\"2876\" height=\"1202\"><figcaption id=\"caption-attachment-112829\" class=\"wp-caption-text\">Dimensiones de las im\u00e1genes destacadas en un bloque de bucle de consulta.<\/figcaption><\/figure>\n<h4>Filtros de duotono en las im\u00e1genes destacadas<\/h4>\n<p>Ya hemos mencionado que ahora podemos aplicar el filtro duotono en las im\u00e1genes envueltas en el nuevo bloque de Galer\u00eda refactorizado.<\/p>\n<p>Ahora, a partir de WordPress 5.9, <a href=\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-8\/#duotone-block-support\">los filtros de duotono<\/a> tambi\u00e9n est\u00e1n disponibles en los bloques de Im\u00e1genes Destacadas en cualquier contexto, desde las plantillas de entradas y p\u00e1ginas hasta los bloques de Query Loop.<\/p>\n<figure id=\"attachment_112830\" aria-describedby=\"caption-attachment-112830\" style=\"width: 2110px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112830\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/featured-image-duotone-filter.jpg\" alt=\"Duotone filter on featured images in a Query Loop block.\" width=\"2110\" height=\"1042\"><figcaption id=\"caption-attachment-112830\" class=\"wp-caption-text\">Filtro duotono en im\u00e1genes destacadas en un bloque Query Loop.<\/figcaption><\/figure>\n<p>Esta funci\u00f3n abre la puerta a combinaciones de colores creativas y coherentes en todo el sitio.<\/p>\n<h3>Recortar im\u00e1genes en el logotipo del sitio<\/h3>\n<p>Antes de WordPress 5.9 (y <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/01\/whats-new-in-gutenberg-11-6-29-september\/\">Gutenberg 11.6<\/a>), las im\u00e1genes del logotipo s\u00f3lo pod\u00edan editarse antes de subirlas. Con WordPress 5.9, puedes <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/31607\">recortar, ampliar y girar las<\/a> im\u00e1genes utilizadas en el bloque Logotipo del Sitio directamente desde la barra de herramientas del bloque.<\/p>\n<figure id=\"attachment_112831\" aria-describedby=\"caption-attachment-112831\" style=\"width: 1258px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112831\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/editing-logo-image.jpg\" alt=\"Editing Site Logo image.\" width=\"1258\" height=\"1272\"><figcaption id=\"caption-attachment-112831\" class=\"wp-caption-text\">Editando la imagen del Logotipo del Sitio.<\/figcaption><\/figure>\n<h2>Nuevas herramientas de dise\u00f1o, bloques y mejoras en la interfaz de usuario<\/h2>\n<p>Once versiones de Gutenberg se fusionan en el n\u00facleo con WordPress 5.9, ofreciendo tantas caracter\u00edsticas, mejoras y correcciones de errores que no ser\u00eda posible abarcarlas todas en un solo art\u00edculo.<\/p>\n<p>As\u00ed que hemos elegido algunas de las que nos han parecido m\u00e1s dignas de atenci\u00f3n. Para obtener una visi\u00f3n m\u00e1s profunda de esas caracter\u00edsticas y mejoras, tambi\u00e9n puedes consultar las publicaciones de la versi\u00f3n de Gutenberg <a href=\"https:\/\/make.wordpress.org\/core\/2021\/06\/10\/whats-new-in-gutenberg-10-8-9-june\/\">10.8<\/a>, <a href=\"https:\/\/make.wordpress.org\/core\/2021\/06\/24\/whats-new-in-gutenberg-10-9-23-june\/\">10.9<\/a>, <a href=\"https:\/\/make.wordpress.org\/core\/2021\/07\/09\/whats-new-in-gutenberg-11-0-0-9-july\/\">11.0<\/a>, <a href=\"https:\/\/make.wordpress.org\/core\/2021\/07\/21\/whats-new-in-gutenberg-11-1-0-21-july\/\">11.1<\/a>, <a href=\"https:\/\/make.wordpress.org\/core\/2021\/08\/05\/whats-new-in-gutenberg-11-2-0-4-august\/\">11.2<\/a>, <a href=\"https:\/\/make.wordpress.org\/core\/2021\/08\/18\/whats-new-in-gutenberg-11-3-18-august\/\">11.3<\/a>, <a href=\"https:\/\/make.wordpress.org\/core\/2021\/09\/01\/whats-new-in-gutenberg-11-4-1-september\/\">11.4<\/a>, <a href=\"https:\/\/make.wordpress.org\/core\/2021\/09\/17\/whats-new-in-gutenberg-11-5-16-september\/\">11.5<\/a>, <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/01\/whats-new-in-gutenberg-11-6-29-september\/\">11.6<\/a>, <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/14\/whats-new-in-gutenberg-11-7-october-13th\/\">11.7<\/a>, <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/28\/whats-new-in-gutenberg-11-8-0-27-october\/\">11.8<\/a> y <a href=\"https:\/\/make.wordpress.org\/core\/2021\/11\/12\/whats-new-in-gutenberg-11-9-0-10-november\/\">11.9<\/a>.<\/p>\n<p>Dicho esto, esta secci\u00f3n cubrir\u00e1 los siguientes cambios:<br \/>\n<div><\/div><kinsta-auto-toc list-style=\"decimal\" selector=\"h3\" count-number=\"9\" sub-toc=\"true\"><\/kinsta-auto-toc><\/p>\n<h3>La interfaz de usuario compatible con los bordes<\/h3>\n<p>A partir de WordPress 5.9, cuando el <strong>theme.json<\/strong> declare la configuraci\u00f3n de <code>border<\/code> y un bloque declare la compatibilidad con los bordes a trav\u00e9s de la <a href=\"https:\/\/developer.wordpress.org\/block-editor\/reference-guides\/block-api\/block-supports\/\">API de compatibilidad de bloques<\/a>, un nuevo panel de configuraci\u00f3n proporcionar\u00e1 controles para el <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/31585\">radio, la anchura, el estilo, el color<\/a> y las <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/33315\">unidades de<\/a> <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/31585\">los bordes<\/a>(v\u00e9ase tambi\u00e9n <a href=\"https:\/\/make.wordpress.org\/core\/2021\/07\/21\/whats-new-in-gutenberg-11-1-0-21-july\/\">Gutenberg 11.1<\/a>).<\/p>\n<p>El bloque <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/tree\/trunk\/packages\/block-library\/src\/group\">principal de Grupo<\/a> es un buen ejemplo de esta \u00fatil mejora de la interfaz de usuario. El archivo <strong>block.json<\/strong> del bloque Grupo incluye ahora las siguientes declaraciones <code>supports<\/code>:<\/p>\n<pre><code class=\"language-json\">{\n\t...\n\t\"supports\": {\n\t\t\"align\": [ \"wide\", \"full\" ],\n\t\t\"anchor\": true,\n\t\t\"html\": false,\n\t\t\"color\": {\n\t\t\t\"gradients\": true,\n\t\t\t\"link\": true\n\t\t},\n\t\t\"spacing\": {\n\t\t\t\"padding\": true,\n\t\t\t\"__experimentalDefaultControls\": {\n\t\t\t\t\"padding\": true\n\t\t\t}\n\t\t},\n\t\t\"__experimentalBorder\": {\n\t\t\t\"color\": true,\n\t\t\t\"radius\": true,\n\t\t\t\"style\": true,\n\t\t\t\"width\": true,\n\t\t\t\"__experimentalDefaultControls\": {\n\t\t\t\t\"color\": true,\n\t\t\t\t\"radius\": true,\n\t\t\t\t\"style\": true,\n\t\t\t\t\"width\": true\n\t\t\t}\n\t\t},\n\t\t...\n\t},\n\t...\n}<\/code><\/pre>\n<p>Esta funci\u00f3n permite a los usuarios crear impresionantes efectos gr\u00e1ficos en sus sitios web con un esfuerzo m\u00ednimo. Puedes verlo en acci\u00f3n con el nuevo tema Twenty Twenty-Two.<\/p>\n<p>En una nueva entrada o p\u00e1gina, crea un nuevo bloque de grupo y selecci\u00f3nalo. Ver\u00e1s un panel de <strong>bordes<\/strong> en la barra lateral de configuraci\u00f3n del bloque. Cambia el ancho y el estilo del borde seg\u00fan sea necesario y disfruta del resultado.<\/p>\n<figure id=\"attachment_112693\" aria-describedby=\"caption-attachment-112693\" style=\"width: 1868px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112693\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/border-controls.jpg\" alt=\"A Group block with a custom border configuration with Twenty Twenty-Two.\" width=\"1868\" height=\"1222\"><figcaption id=\"caption-attachment-112693\" class=\"wp-caption-text\">Un bloque de Grupo con una configuraci\u00f3n de borde personalizada con Twenty Twenty-Two.<\/figcaption><\/figure>\n<p>Si eres un desarrollador de temas y quieres a\u00f1adir esta funci\u00f3n a tus temas, abre tu archivo <strong>theme.json<\/strong> y declara la compatibilidad con los bordes como se muestra en el siguiente c\u00f3digo:<\/p>\n<pre><code class=\"language-json\">{\n\t\"version\": 1,\n\t\"settings\": {\n\t\t\"border\": {\n\t\t\t\"customColor\": true,\n\t\t\t\"customRadius\": true,\n\t\t\t\"customStyle\": true,\n\t\t\t\"customWidth\": true\n\t\t}\n\t}\n}<\/code><\/pre>\n<p>Guarda el archivo y vuelve a tu panel de control de WordPress. En una nueva entrada o p\u00e1gina, crea un nuevo bloque de grupo y selecci\u00f3nalo. Ahora deber\u00edas ver un panel de bordes en la barra lateral de configuraci\u00f3n del bloque (consulta tambi\u00e9n este <a href=\"https:\/\/gist.github.com\/aaronrobertshaw\/8ed108e4a024b81297a55fc498ef3a57\">theme.json experimental<\/a>).<\/p>\n<h3>Mejoras en la vista de lista<\/h3>\n<p>Con WordPress 5.9, una vista de lista ha sido mejorada y ahora cuenta con la funci\u00f3n de arrastrar y soltar, secciones plegables y anclajes HTML.<\/p>\n<h4>Arrastrar y soltar en la vista de lista<\/h4>\n<p>Como se menciona en el <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/33320\">pull request #33320<\/a>, se ha implementado la funci\u00f3n de arrastrar y soltar en el Esquema pero se ha desactivado por problemas de rendimiento.<\/p>\n<p>A partir de WordPress 5.9, se ha reimplementado la funci\u00f3n de arrastrar y soltar en el Esquema. Puedes volver a <a href=\"https:\/\/make.wordpress.org\/core\/2021\/07\/21\/whats-new-in-gutenberg-11-1-0-21-july\/\">arrastrar y soltar bloques<\/a> y grupos de bloques en cualquier lugar de la Vista de Lista. Esta es una gran mejora en la usabilidad del editor, ya que te permite mover r\u00e1pida y f\u00e1cilmente bloques y grupos de bloques por tus p\u00e1ginas. Es fundamental en <a href=\"https:\/\/kinsta.com\/es\/blog\/articulos-de-forma-larga\/\">art\u00edculos y p\u00e1ginas de formato largo<\/a>, y en la gesti\u00f3n de estructuras complejas de bloques anidados.<\/p>\n<figure id=\"attachment_112560\" aria-describedby=\"caption-attachment-112560\" style=\"width: 1994px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112560\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/drag-and-drop-in-list-view.jpg\" alt=\"Drag and drop in List View.\" width=\"1994\" height=\"1180\"><figcaption id=\"caption-attachment-112560\" class=\"wp-caption-text\">Arrastrar y soltar en la vista de lista.<\/figcaption><\/figure>\n<h4>Secciones colapsables en la vista de lista<\/h4>\n<p>Otra mejora significativa de la Vista de Lista es la posibilidad de <a href=\"https:\/\/make.wordpress.org\/core\/2021\/06\/24\/whats-new-in-gutenberg-10-9-23-june\/\">expandir\/contraer secciones de bloques anidados<\/a>. Esto te permite navegar f\u00e1cilmente por estructuras de bloques complejas, expandiendo grupos individuales de bloques mientras dejas todo el resto colapsado.<\/p>\n<p>Tambi\u00e9n puedes expandir y contraer las secciones de la Vista de Lista <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/32117\">utilizando las flechas izquierda y derecha<\/a>.<\/p>\n<figure id=\"attachment_112561\" aria-describedby=\"caption-attachment-112561\" style=\"width: 1996px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112561\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/group-block-expanded.jpg\" alt=\"An expanded group of blocks .\" width=\"1996\" height=\"1102\"><figcaption id=\"caption-attachment-112561\" class=\"wp-caption-text\">Un grupo expandido de bloques.<\/figcaption><\/figure>\n<h4>Anclas HTML en los elementos de la vista de lista<\/h4>\n<p>Otra mejora \u00fatil es la posibilidad de a\u00f1adir anclas HTML a tus bloques en la Vista de Lista y verlas de un vistazo.<\/p>\n<figure id=\"attachment_112562\" aria-describedby=\"caption-attachment-112562\" style=\"width: 1997px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112562\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/html-anchors-list-view.jpg\" alt=\"HTML anchors in List View.\" width=\"1997\" height=\"1112\"><figcaption id=\"caption-attachment-112562\" class=\"wp-caption-text\">Anclas HTML en la Vista de Lista.<\/figcaption><\/figure>\n<h3>Control del espacio entre bloques<\/h3>\n<p>Introducido por primera vez en <a href=\"https:\/\/make.wordpress.org\/core\/2021\/09\/01\/whats-new-in-gutenberg-11-4-1-september\/\">Gutenberg 11.4<\/a> y ahora incorporado al n\u00facleo con WordPress 5.9, el nuevo control de espacio de bloques te permite establecer una distancia personalizada entre los elementos de un bloque. A continuaci\u00f3n, puedes ver una vista previa con diferentes valores de espaciado entre bloques en un bloque Columnas con el tema predeterminado Twenty Twenty-Two:<\/p>\n<figure id=\"attachment_113303\" aria-describedby=\"caption-attachment-113303\" style=\"width: 1966px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-113303\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/block-spacing-90.jpg\" alt=\"Controlling Columns Block spacing in WordPress 5.9.\" width=\"1966\" height=\"1166\"><figcaption id=\"caption-attachment-113303\" class=\"wp-caption-text\">Controlando el espaciado de bloques de Columnas en WordPress 5.9.<\/figcaption><\/figure>\n<p>El espaciado de huecos estar\u00e1 disponible inicialmente para bloques espec\u00edficos, incluyendo botones, im\u00e1genes, columnas, t\u00edtulos y navegaci\u00f3n, pero el soporte deber\u00eda extenderse a m\u00e1s bloques en el futuro.<\/p>\n<p>Los temas deben activar el espaciado de separaci\u00f3n en <strong>theme.json<\/strong> utilizando la nueva propiedad <em>appearanceTools<\/em>. Puedes leer m\u00e1s sobre los appearanceTools en nuestra <a href=\"https:\/\/kinsta.com\/es\/blog\/temas-de-twenty-twenty-two\/#layout-and-appearance-tools\">inmersi\u00f3n profunda en Twenty Twenty-Two<\/a>. Consulta tambi\u00e9n los pull requests <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/33991\">#33991<\/a> y <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/34630\">#34630<\/a>.<\/p>\n<h3>Vista previa de la URL enriquecida para el control de enlaces<\/h3>\n<p>Aprovechando el nuevo <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/31763\">punto final REST url-details<\/a>, el control de enlaces proporciona ahora una vista previa de la <a href=\"https:\/\/make.wordpress.org\/core\/2021\/06\/24\/whats-new-in-gutenberg-10-9-23-june\/\">URL enriquecida<\/a> que muestra los detalles de un recurso de destino de enlace.<\/p>\n<figure id=\"attachment_112702\" aria-describedby=\"caption-attachment-112702\" style=\"width: 1390px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112702\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/rich-url-preview.jpg\" alt=\"Rich URL preview in the post editor.\" width=\"1390\" height=\"1002\"><figcaption id=\"caption-attachment-112702\" class=\"wp-caption-text\">Vista previa de la URL enriquecida en el editor de entradas.<\/figcaption><\/figure>\n<p>En su <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/31464\">primera implementaci\u00f3n<\/a>, esta funci\u00f3n s\u00f3lo estaba disponible en el <a href=\"https:\/\/kinsta.com\/es\/blog\/bloques-gutenberg\/#using-richtext-component\">componente richtext<\/a> del editor de entradas. En el momento de escribir este art\u00edculo, tambi\u00e9n est\u00e1 disponible en el Editor de Sitios, pero no en los editores de Navegaci\u00f3n y Widgets.<\/p>\n<h3>Crear p\u00e1ginas desde la ventana emergente de enlaces<\/h3>\n<p>WordPress 5.9 tambi\u00e9n presenta una <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/14\/whats-new-in-gutenberg-11-7-october-13th\/\">interfaz de usuario de enlaces en l\u00ednea mejorada<\/a>, que muestra un nuevo bot\u00f3n para <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/35083\">crear nuevas p\u00e1ginas directamente desde la ventana emergente de enlaces en l\u00ednea<\/a>. Esta funci\u00f3n s\u00f3lo est\u00e1 disponible en el Editor de <a href=\"https:\/\/kinsta.com\/es\/blog\/gutenberg-wordpress-editor\/\">Publicaciones<\/a>.<\/p>\n<figure id=\"attachment_113304\" aria-describedby=\"caption-attachment-113304\" style=\"width: 1332px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-113304\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/create-pages-from-link-popup.jpg\" alt=\"Create pages from link popup.\" width=\"1332\" height=\"1100\"><figcaption id=\"caption-attachment-113304\" class=\"wp-caption-text\">WordPress 5.9 presenta una nueva interfaz de usuario de enlaces en l\u00ednea.<\/figcaption><\/figure>\n<h3>Mejoras en el bloque de b\u00fasqueda<\/h3>\n<p>El Bloque de B\u00fasqueda ahora muestra la <a href=\"https:\/\/make.wordpress.org\/core\/2021\/08\/05\/whats-new-in-gutenberg-11-2-0-4-august\/\">configuraci\u00f3n del color del bot\u00f3n y del borde<\/a>.<\/p>\n<figure id=\"attachment_113295\" aria-describedby=\"caption-attachment-113295\" style=\"width: 2032px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-113295\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/search-block-color-settings.jpg\" alt=\"Search Block Color settings.\" width=\"2032\" height=\"1068\"><figcaption id=\"caption-attachment-113295\" class=\"wp-caption-text\">Configuraci\u00f3n del color del bloque de b\u00fasqueda.<\/figcaption><\/figure>\n<p>Ahora tambi\u00e9n puedes personalizar el <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/32416\">color del fondo y del texto<\/a> y el <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/31783\">color y el radio de los<\/a> bordes.<\/p>\n<figure id=\"attachment_113294\" aria-describedby=\"caption-attachment-113294\" style=\"width: 2028px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-113294\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/search-block-border-settings.jpg\" alt=\"Search Block border color and radius settings.\" width=\"2028\" height=\"1100\"><figcaption id=\"caption-attachment-113294\" class=\"wp-caption-text\">Ajustes de color y radio del Bloque de B\u00fasqueda.<\/figcaption><\/figure>\n<h3>Nuevos controles para las dimensiones de los bloques<\/h3>\n<p>Ahora hay un nuevo panel de configuraci\u00f3n de Dimensiones para que <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/28356\">los usuarios<\/a> puedan <a href=\"https:\/\/make.wordpress.org\/core\/2021\/08\/18\/whats-new-in-gutenberg-11-3-18-august\/\">controlar el espacio que ocupa un bloque<\/a> en la p\u00e1gina. <em>El<\/em> panel incluir\u00e1 controles de altura, anchura, padding, margen y posiblemente alineaci\u00f3n, pero no todos los atributos estar\u00e1n disponibles para todos los bloques.<\/p>\n<figure id=\"attachment_113296\" aria-describedby=\"caption-attachment-113296\" style=\"width: 2026px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-113296\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/dimensions-panel-group-block.jpg\" alt=\"Group block dimensions panel.\" width=\"2026\" height=\"616\"><figcaption id=\"caption-attachment-113296\" class=\"wp-caption-text\">Control de padding para un bloque de grupo en WordPress 5.9.<\/figcaption><\/figure>\n<p><a href=\"https:\/\/kinsta.com\/es\/blog\/bloques-gutenberg\/\">Los desarrolladores de<\/a> bloques encontrar\u00e1n el componente <code>&lt;DimensionControl \/&gt;<\/code> <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/blob\/trunk\/packages\/components\/src\/dimension-control\/README.md\">documentado en GitHub<\/a>, pero ten en cuenta que todav\u00eda est\u00e1 marcado como una funci\u00f3n experimental y podr\u00eda estar sujeto a cambios de ruptura en el momento de escribir este art\u00edculo.<\/p>\n<h3>Se ha a\u00f1adido un nuevo bloque de grupo de widgets a la pantalla de widgets<\/h3>\n<p><a href=\"https:\/\/make.wordpress.org\/core\/2021\/09\/17\/whats-new-in-gutenberg-11-5-16-september\/\">Ahora<\/a> hay un nuevo bloque de <a href=\"https:\/\/make.wordpress.org\/core\/2021\/09\/22\/core-editor-improvement-introducing-the-widget-group-block\/\">grupo de widgets<\/a> disponible en el editor de widgets basado en bloques. El \u00faltimo bloque te permite <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/34484\">a\u00f1adir un grupo de bloques en un widget con un t\u00edtulo<\/a> en el Editor de Widgets de los temas cl\u00e1sicos y en el Personalizador.<\/p>\n<figure id=\"attachment_113297\" aria-describedby=\"caption-attachment-113297\" style=\"width: 1398px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-113297\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/widget-group-block.jpg\" alt=\"Widget Group block in the Twenty Twenty-One theme.\" width=\"1398\" height=\"1122\"><figcaption id=\"caption-attachment-113297\" class=\"wp-caption-text\">Bloque de Grupo de Widgets en el tema Twenty Twenty-One.<\/figcaption><\/figure>\n<p>Puedes leer m\u00e1s sobre el editor de widgets en <a href=\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-8\/#blockbased-widgets-editor-and-block-widgets-in-the-customizer\">Editor de widgets por bloques y Widgets por bloques en el personalizador<\/a>.<\/p>\n<h3>Flex Layout y el nuevo bloque de filas<\/h3>\n<p>Introducido originalmente como una <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/33359\">caracter\u00edstica experimental<\/a> con <a href=\"https:\/\/make.wordpress.org\/core\/2021\/08\/05\/whats-new-in-gutenberg-11-2-0-4-august\/\">Gutenberg 11.2<\/a>, el dise\u00f1o <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/CSS\/CSS_Flexible_Box_Layout\/Basic_Concepts_of_Flexbox\">flexible<\/a> se ha extendido a varios bloques, incluyendo los bloques de <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/34493\">Enlaces Sociales<\/a> y de Grupo.<\/p>\n<p>Algunos bloques, como el de Enlaces Sociales, ofrecen ahora un conjunto de controles de la barra de herramientas y ajustes de la barra lateral que te permiten personalizar el dise\u00f1o flexible.<\/p>\n<figure id=\"attachment_112704\" aria-describedby=\"caption-attachment-112704\" style=\"width: 1358px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112704\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/social-links-layout-controls.jpg\" alt=\"Layout controls in the Social Links block toolbar.\" width=\"1358\" height=\"524\"><figcaption id=\"caption-attachment-112704\" class=\"wp-caption-text\">Controles de dise\u00f1o en la barra de herramientas del bloque Enlaces sociales.<\/figcaption><\/figure>\n<p>Esta misma funcionalidad est\u00e1 disponible en el bloque <a href=\"#the-navigation-block\">Navegaci\u00f3n<\/a> y en el bloque <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/34535\">Fila<\/a>, una nueva variaci\u00f3n del bloque Grupo introducida con <a href=\"https:\/\/make.wordpress.org\/core\/2021\/09\/17\/whats-new-in-gutenberg-11-5-16-september\/\">Gutenberg 11.5<\/a>.<\/p>\n<p>La siguiente imagen muestra el bloque Fila con controles de dise\u00f1o en la barra lateral de ajustes:<\/p>\n<figure id=\"attachment_112706\" aria-describedby=\"caption-attachment-112706\" style=\"width: 2046px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112706\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/row-block-with-layout-settings.jpg\" alt=\"The new Row block with Layout settings.\" width=\"2046\" height=\"772\"><figcaption id=\"caption-attachment-112706\" class=\"wp-caption-text\">El nuevo bloque Fila con los ajustes de dise\u00f1o.<\/figcaption><\/figure>\n<p>A continuaci\u00f3n, puedes ver el mismo bloque Row en el frontend y en la <a href=\"https:\/\/kinsta.com\/es\/blog\/inspeccion-elementos\/\">herramienta de inspecci\u00f3n<\/a> de Chrome.<\/p>\n<figure id=\"attachment_112705\" aria-describedby=\"caption-attachment-112705\" style=\"width: 2460px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112705\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/row-block-flex-props.jpg\" alt=\"A Row block in Chrome inspector tool.\" width=\"2460\" height=\"880\"><figcaption id=\"caption-attachment-112705\" class=\"wp-caption-text\">Un bloque Fila en la herramienta de inspecci\u00f3n de Chrome.<\/figcaption><\/figure>\n<h2>Mejoras en el patr\u00f3n de bloques<\/h2>\n<p><a href=\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-5\/#block-patterns\">Introducidos por primera vez en WordPress 5.5<\/a>, los patrones de bloques permiten a los usuarios de WordPress incluir en su contenido <a href=\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-5\/#block-patterns\">complejas estructuras de bloques anidados listas para usar<\/a> con s\u00f3lo unos pocos clics.<\/p>\n<p>Ahora, WordPress 5.9 da un paso m\u00e1s hacia la democratizaci\u00f3n del dise\u00f1o y el empoderamiento del usuario al introducir un par de mejoras en el sistema de patrones de bloques.<\/p>\n<p>Entonces, \u00bfqu\u00e9 hay de nuevo en los patrones de bloques en WordPress 5.9?<\/p>\n<h3>Patrones destacados del directorio de patrones<\/h3>\n<p>El insertador de bloques <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/28\/whats-new-in-gutenberg-11-8-0-27-october\/\">muestra ahora patrones de bloques<\/a> destacados recuperados din\u00e1micamente del <a href=\"https:\/\/wordpress.org\/patterns\/\">directorio de patrones<\/a>, proporcionando a los usuarios una forma r\u00e1pida y f\u00e1cil de encontrar patrones populares para utilizar en sus contenidos.<\/p>\n<figure id=\"attachment_112574\" aria-describedby=\"caption-attachment-112574\" style=\"width: 2160px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112574\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/buttons-patterns-wp-59-tt2.jpg\" alt=\"Buttons block patterns in WordPress 5.9.\" width=\"2160\" height=\"1308\"><figcaption id=\"caption-attachment-112574\" class=\"wp-caption-text\">Patrones de bloques de botones en WordPress 5.9.<\/figcaption><\/figure>\n<p>Del mismo modo, a medida que los patrones llegan directamente al panel de control de WordPress, los desarrolladores de WordPress deber\u00edan animarse a crear y publicar m\u00e1s y m\u00e1s patrones con el tiempo, lo que dar\u00e1 lugar a capacidades de dise\u00f1o cada vez m\u00e1s avanzadas para los usuarios.<\/p>\n<h3>Un nuevo explorador de patrones a pantalla completa<\/h3>\n<p>Como el n\u00famero de patrones de bloques disponibles en el <a href=\"https:\/\/wordpress.org\/patterns\/\">Directorio de Patrones<\/a> sigue creciendo y m\u00e1s temas los utilizan, WordPress 5.9 introduce una <a href=\"https:\/\/make.wordpress.org\/core\/2021\/11\/12\/whats-new-in-gutenberg-11-9-0-10-november\/\">nueva interfaz de navegaci\u00f3n<\/a> de patrones de bloques: el Explorador de Patrones.<\/p>\n<figure id=\"attachment_112575\" aria-describedby=\"caption-attachment-112575\" style=\"width: 2158px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112575\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/fullscreen-pattern-modal.jpg\" alt=\"Fullscreen pattern modal in WordPress 5.9.\" width=\"2158\" height=\"1300\"><figcaption id=\"caption-attachment-112575\" class=\"wp-caption-text\">Modalidad de patrones a pantalla completa en WordPress 5.9.<\/figcaption><\/figure>\n<p>Un nuevo bot\u00f3n de <strong>Exploraci\u00f3n<\/strong> abre ahora un modal a pantalla <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/35773\">completa<\/a> que permite a los usuarios explorar, buscar e insertar patrones de bloques con s\u00f3lo unos clics. El resultado es una experiencia de usuario mejorada.<\/p>\n<figure id=\"attachment_112576\" aria-describedby=\"caption-attachment-112576\" style=\"width: 1996px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112576\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/featured-block-patterns.jpg\" alt=\"Featured block patterns in the block inserter.\" width=\"1996\" height=\"1132\"><figcaption id=\"caption-attachment-112576\" class=\"wp-caption-text\">Patrones de bloques destacados en el insertador de bloques.<\/figcaption><\/figure>\n<p>Tambi\u00e9n encontrar\u00e1s notas adicionales y varios ejemplos de patrones de bloques en nuestra inmersi\u00f3n profunda en el <a href=\"https:\/\/kinsta.com\/es\/blog\/temas-de-twenty-twenty-two\/#twenty-twentytwo-block-patterns\">tema Twenty Twenty-Two de WordPress<\/a>.<\/p>\n<p>Si te interesa y quieres saber m\u00e1s, escucha los <a href=\"https:\/\/wordpress.org\/news\/2021\/09\/episode-16-a-sneak-peek-at-wordpress-5-9\/\">episodios 16<\/a> y <a href=\"https:\/\/wordpress.org\/news\/2021\/11\/episode-21-all-things-block-themes\/\">21<\/a> del podcast de Josepha Haden Chomphosy, y mira el v\u00eddeo de YouTube <a href=\"https:\/\/www.youtube.com\/watch?v=r59aR1tmY6k\">Explorando WordPress 5.9<\/a> de Anne McCarthy.<\/p>\n<h2>El tema Twenty Twenty-Two y los temas en bloque de WordPress<\/h2>\n<p>Con WordPress 5.9, ya no necesitar\u00e1s instalar el plugin Gutenberg para habilitar el Full Site Editing en tu sitio web de WordPress. S\u00f3lo tendr\u00e1s que permitir un tema en bloque para aprovechar todas las funciones de FSE.<\/p>\n<p>Adem\u00e1s, WordPress 5.9 incluye un nuevo tema por defecto, Twenty Twenty-Two, que cambia las reglas del juego, ya que Twenty Twenty-Two es el primer tema por defecto en bloque de la historia.<\/p>\n<p>Twenty Twenty-Two es un tema muy flexible y personalizable. Proporciona una caja de arena perfecta para probar el nuevo flujo de edici\u00f3n de plantillas, los nuevos bloques, las mejoras de la interfaz y todas las funciones de edici\u00f3n del sitio a\u00f1adidas al n\u00facleo, a partir de WordPress 5.9.<\/p>\n<figure id=\"attachment_110731\" aria-describedby=\"caption-attachment-110731\" style=\"width: 2560px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-110731\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/tt2.jpg\" alt=\"Twenty Twenty-Two preview.\" width=\"2560\" height=\"1752\"><figcaption id=\"caption-attachment-110731\" class=\"wp-caption-text\">Twenty Twenty-Two es el nuevo tema por defecto de WordPress. (Fuente de la imagen: <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/06\/introducing-twenty-twenty-two\/\">WordPress.org<\/a>)<\/figcaption><\/figure>\n<p>Como se ha mencionado anteriormente, todo lo que tienes que hacer es instalar y activar un tema <a href=\"https:\/\/wordpress.org\/themes\/tags\/full-site-editing\/\">en bloque<\/a>, como Twenty Twenty-Two. Una vez que el tema est\u00e9 activo, aparecer\u00e1 un nuevo elemento de men\u00fa <strong>Editor <\/strong>(<strong>beta<\/strong>) en el men\u00fa de administraci\u00f3n del panel de WordPress.<\/p>\n<figure id=\"attachment_113422\" aria-describedby=\"caption-attachment-113422\" style=\"width: 2002px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-113422\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/wp-59-appearance-menu.jpg\" alt=\"The new Appearance Menu in WordPress 5.9.\" width=\"2002\" height=\"830\"><figcaption id=\"caption-attachment-113422\" class=\"wp-caption-text\">El nuevo men\u00fa de apariencia en WordPress 5.9.<\/figcaption><\/figure>\n<p>La interfaz del Editor del Sitio cuenta ahora con un <a href=\"https:\/\/kinsta.com\/es\/blog\/temas-de-twenty-twenty-two\/#twenty-twentytwo-brings-a-new-site-editing-flow\">flujo de edici\u00f3n del sitio<\/a> renovado. Desde la interfaz de edici\u00f3n, podr\u00e1s editar visualmente la p\u00e1gina de inicio del sitio, las plantillas y las partes de la plantilla, as\u00ed como acceder a la <a href=\"#global-styles-a-graphic-interface-for-themejson\">interfaz de Estilos Globales<\/a>.<\/p>\n<figure id=\"attachment_110741\" aria-describedby=\"caption-attachment-110741\" style=\"width: 2318px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-110741\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/editor-navigation-menu.jpg\" alt=\"The Editor navigation menu.\" width=\"2318\" height=\"1046\"><figcaption id=\"caption-attachment-110741\" class=\"wp-caption-text\">El men\u00fa de navegaci\u00f3n del Editor.<\/figcaption><\/figure>\n<p>Cuando actives un tema en bloque, <a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/07\/state-of-the-customizer-with-block-themes-in-wordpress-5-9\/\">no encontrar\u00e1s el Personalizador<\/a>. Esto se debe a que el Personalizador no es compatible con los temas en bloque, que s\u00f3lo utilizan el Editor del Sitio. Esa es tambi\u00e9n la raz\u00f3n por la que <strong>no puedes previsualizar los temas de bloque inactivos<\/strong>.<\/p>\n<figure id=\"attachment_113429\" aria-describedby=\"caption-attachment-113429\" style=\"width: 1650px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-113429\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/live-preview-not-available.jpg\" alt=\"The Live Preview is not available with block themes.\" width=\"1650\" height=\"1268\"><figcaption id=\"caption-attachment-113429\" class=\"wp-caption-text\">La vista previa en vivo no est\u00e1 disponible con los temas de bloque.<\/figcaption><\/figure>\n<p>As\u00ed pues, a partir de WordPress 5.9, el punto de acceso al Personalizador ya no est\u00e1 disponible en el men\u00fa de administraci\u00f3n cuando un tema de bloque est\u00e1 activo (a menos que utilices <a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/04\/block-themes-a-new-way-to-build-themes-in-wordpress-5-9\/\">un plugin que haga uso de \u00e9l<\/a>).<\/p>\n<p>Si todav\u00eda est\u00e1s atado a los temas tradicionales y te preocupa la retrocompatibilidad, estate tranquilo: puedes seguir utilizando tu tema.<\/p>\n<p>Actualmente tienes cuatro categor\u00edas diferentes de temas para elegir:<\/p>\n<ul>\n<li><strong>Temas de bloques<\/strong>: Temas dise\u00f1ados para FSE<\/li>\n<li><strong>Temas universales<\/strong>: Temas que funcionan tanto con el Personalizador como con el Editor del Sitio<\/li>\n<li><strong>Temas h\u00edbridos<\/strong>: Temas cl\u00e1sicos que admiten funciones de FSE como theme.json<\/li>\n<li><strong>Temas<\/strong> <strong>cl\u00e1sicos<\/strong>: Temas con plantillas PHP, functions.php, etc.<\/li>\n<\/ul>\n<p>Debido al impacto que probablemente tendr\u00e1n los temas en bloque en el ecosistema de WordPress, tenemos un art\u00edculo completo que trata sobre <a href=\"https:\/\/kinsta.com\/es\/blog\/temas-de-twenty-twenty-two\/\">Twenty Twenty-Two y los temas en bloque de WordPress<\/a>. Aseg\u00farate de consultarlo para obtener una visi\u00f3n m\u00e1s profunda.<\/p>\n<h2>Mejoras en el rendimiento<\/h2>\n<p>Aqu\u00ed en Kinsta, estamos obsesionados con la <a href=\"https:\/\/kinsta.com\/es\/aprender\/acelerar-wordpress\/\">velocidad del sitio web<\/a>. Por eso estamos entusiasmados con las <a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/05\/wordpress-5-9-performance-improvements\/\">mejoras<\/a> de rendimiento que llegar\u00e1n con WordPress 5.9.<\/p>\n<p>Estas mejoras afectar\u00e1n a varias \u00e1reas del CMS, desde el editor de bloques hasta los temas de bloques, la carga lenta y mucho m\u00e1s. Vamos a sumergirnos en ello.<br \/>\n<div><\/div><kinsta-auto-toc list-style=\"decimal\" selector=\"h3\" count-number=\"4\" sub-toc=\"true\"><\/kinsta-auto-toc><\/p>\n<h3>Mejoras en el editor de bloques<\/h3>\n<p>Desde la versi\u00f3n 5.9 de WordPress, los tipos de bloques, los patrones y las categor\u00edas se cargan de forma perezosa en el editor de bloques. El navegador carga primero el contenido de mayor prioridad, lo que proporciona al usuario una experiencia de edici\u00f3n m\u00e1s fluida y un mayor rendimiento.<\/p>\n<p>Otras mejoras de rendimiento notables en el contexto del editor de bloques afectan a los bloques reutilizables y a la <a href=\"#list-view-improvements\">vista de lista<\/a>.<\/p>\n<h3>Menos CSS cargado<\/h3>\n<p>En cuanto al frontend, WordPress 5.9 ha reducido dr\u00e1sticamente la cantidad de CSS cargado por los temas de bloques, lo que hace que las p\u00e1ginas se carguen significativamente m\u00e1s r\u00e1pido.<\/p>\n<p>La principal mejora que cabe destacar en este contexto es la introducci\u00f3n del mecanismo de configuraci\u00f3n y estilos <strong>theme.json<\/strong>, que evita que los temas utilicen hojas de estilo masivas, incluyendo cientos de declaraciones CSS. La cantidad de c\u00f3digo CSS que utiliza un tema se ha reducido ahora a <a href=\"https:\/\/kinsta.com\/es\/blog\/temas-de-twenty-twenty-two\/#twenty-twentytwo-at-its-core-a-quick-overview-of-themejson\">unas pocas propiedades CSS personalizadas<\/a> que cualquier tipo de bloque puede reutilizar.<\/p>\n<h3>Mejoras en el rendimiento del lazy loading<\/h3>\n<p>La carga lenta de im\u00e1genes se <a href=\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-5\/#native-image-lazyloading-in-wordpress-core\">introdujo por primera vez en WordPress 5.5<\/a>. A partir de WordPress 5.7, la funcionalidad del \u00a0lazy loading se <a href=\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-7\/#lazyloading-iframes\">extendi\u00f3 a los iframes<\/a>, permitiendo a los propietarios de sitios web construirlos m\u00e1s r\u00e1pidamente y <a href=\"https:\/\/kinsta.com\/es\/ebooks\/wordpress\/como-mejorar-seo\/\">mejorar su SEO<\/a>.<\/p>\n<p>De todos modos, tras un an\u00e1lisis del <a href=\"https:\/\/kinsta.com\/es\/blog\/core-web-vitals\/#largest-contentful-paint-lcp\">Largest Contentful Paint (LCP)<\/a>, result\u00f3 que asignar el atributo <code>loading=\"lazy\"<\/code> a todas las im\u00e1genes e iframes de la p\u00e1gina provoca una ligera degradaci\u00f3n del rendimiento.<\/p>\n<p>Omitir simplemente el atributo <code>loading=\"lazy\"<\/code> no era una soluci\u00f3n porque al hacerlo se perder\u00edan las claras ventajas del <a href=\"https:\/\/kinsta.com\/es\/blog\/lazy-load-de-wordpress\/\">lazy loading<\/a>.<\/p>\n<p>La <a href=\"https:\/\/make.wordpress.org\/core\/2021\/07\/15\/refining-wordpress-cores-lazy-loading-implementation\/\">soluci\u00f3n \u00f3ptima<\/a> ser\u00eda omitir el atributo <code>loading=\"lazy\"<\/code> s\u00f3lo en las im\u00e1genes que aparecen por encima del pliegue. Sin embargo, como el atributo <code>loading=\"lazy\"<\/code> se asigna en el lado del servidor, WordPress no puede determinar qu\u00e9 im\u00e1genes se muestran por encima del pliegue exactamente. Es algo que depende sobre todo del tema activo.<\/p>\n<p>Ahora, como soluci\u00f3n de compromiso, <a href=\"https:\/\/make.wordpress.org\/core\/2021\/12\/29\/enhanced-lazy-loading-performance-in-5-9\/\">a partir de WordPress 5.9<\/a>, el atributo <code>loading=\"lazy\"<\/code> no se aplica a la primera imagen de contenido o iframe. Un an\u00e1lisis realizado en 50 <a href=\"https:\/\/kinsta.com\/es\/blog\/temas-wordpress-rapidos\/\">temas populares de WordPress<\/a> descubri\u00f3 que esta soluci\u00f3n conlleva una mejora considerable del rendimiento y que las p\u00e1ginas se cargan hasta un 30% m\u00e1s r\u00e1pido.<\/p>\n<p>Felix Arntz explica <a href=\"https:\/\/make.wordpress.org\/core\/2021\/12\/29\/enhanced-lazy-loading-performance-in-5-9\/\">c\u00f3mo funciona<\/a>:<\/p>\n<blockquote><p>&#8230; para mejorar el rendimiento de forma inmediata, sin necesidad de que el desarrollador personalice el comportamiento, ahora WordPress omitir\u00e1 que la primera \u00abimagen de contenido o iframe\u00bb de la p\u00e1gina se cargue de forma perezosa. El t\u00e9rmino \u00abimagen de contenido o iframe\u00bb denota aqu\u00ed cualquier imagen o iframe que se encuentre dentro del contenido de cualquier entrada en el bucle de consulta principal actual, as\u00ed como cualquier imagen destacada de dicha entrada. Esto se aplica tanto al contenido \u00absingular\u00bb como al de \u00abarchivo\u00bb: En un contexto \u00absingular\u00bb la primera imagen o iframe del (\u00fanico) post no se carga de forma perezosa, mientras que en un contexto \u00abde archivo\u00bb la primera imagen o iframe del primer post de la consulta no se carga de forma perezosa.<\/p><\/blockquote>\n<p>Los desarrolladores de temas pueden ahora utilizar el nuevo filtro <code>wp_omit_loading_attr_threshold<\/code> para cambiar el n\u00famero de im\u00e1genes\/iframes que se saltan el lazy loading.<\/p>\n<h3>M\u00faltiples hojas de estilo por bloque<\/h3>\n<p>Los desarrolladores de bloques y temas pueden <a href=\"https:\/\/make.wordpress.org\/core\/2021\/12\/15\/using-multiple-stylesheets-per-block\/\">registrar m\u00faltiples hojas de estilo en cada bloque<\/a> y cargar estilos de otros bloques cuando sea necesario. Esto permite cargar hojas de estilo en funci\u00f3n del contenido de la p\u00e1gina, evitando que los temas carguen enormes hojas de estilo en cada p\u00e1gina.<\/p>\n<p>Seg\u00fan <a href=\"https:\/\/make.wordpress.org\/core\/2021\/12\/15\/using-multiple-stylesheets-per-block\/\">Ari Stathopoulos<\/a><\/p>\n<blockquote><p>Los bloques podr\u00e1n ahora registrar m\u00faltiples hojas de estilo y cargar estilos de otros bloques cuando sea necesario. Los temas podr\u00e1n a\u00f1adir estilos por bloque en lugar de cargar hojas de estilo monol\u00edticas que se cargan a la fuerza en cualquier lugar. Esto tiene un mayor impacto en los temas por bloques, donde la carga de las hojas de estilo se optimiza en funci\u00f3n del contenido de la p\u00e1gina y del dise\u00f1o, pero tambi\u00e9n puede ser utilizado por los temas cl\u00e1sicos.<\/p><\/blockquote>\n<h2>Caracter\u00edsticas adicionales para desarrolladores<\/h2>\n<p>Adem\u00e1s de las numerosas caracter\u00edsticas y mejoras de la interfaz de usuario comentadas hasta ahora, WordPress 5.9 tambi\u00e9n introduce varias funciones para los desarrolladores.<\/p>\n<aside role=\"note\" class=\"wp-block-kinsta-notice is-style-info\">\n            <h3>Info<\/h3>\n        <p>Si eres nuevo en el desarrollo de bloques de WordPress, aseg\u00farate de consultar nuestro <a href=\"https:\/\/kinsta.com\/es\/blog\/bloques-gutenberg\/\">Tutorial definitivo de desarrollo de bloques<\/a><\/p>\n<\/aside>\n\n<div><\/div><kinsta-auto-toc list-style=\"decimal\" selector=\"h3\" count-number=\"3\" sub-toc=\"true\"><\/kinsta-auto-toc>\n<h3>Un nuevo atributo para bloquear bloques<\/h3>\n<p>Los desarrolladores de bloques ahora pueden impedir que los usuarios <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/01\/whats-new-in-gutenberg-11-6-29-september\/\">muevan o eliminen bloques individuales<\/a> <a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/08\/locking-blocks-in-wordpress-5-9\/\">a\u00f1adiendo un atributo <code>lock<\/code> <\/a> en la configuraci\u00f3n de los bloques:<\/p>\n<pre><code class=\"language-json\">{\n\t...\n\t\"attributes\": {\n\t\t\"lock\": {\n\t\t\t\"type\": \"object\",\n\t\t\t\"default\": {\n\t\t\t\t\"move\": true,\n\t\t\t\t\"remove\": true\n\t\t\t}\n\t\t}\n\t}\n}<\/code><\/pre>\n<p>Con <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/32457\">esta funci\u00f3n activada<\/a>, los usuarios pueden editar el contenido del bloque, pero no pueden moverlo en la p\u00e1gina ni eliminarlo del lienzo del editor. La siguiente imagen muestra un bloque <a href=\"https:\/\/kinsta.com\/es\/blog\/bloques-gutenberg\/\">personalizado<\/a> con un conjunto est\u00e1ndar de controles de la barra de herramientas:<\/p>\n<figure id=\"attachment_112708\" aria-describedby=\"caption-attachment-112708\" style=\"width: 1288px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112708\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/custom-block-with-regular-toolbar.jpg\" alt=\"Custom block with a regular toolbar.\" width=\"1288\" height=\"946\"><figcaption id=\"caption-attachment-112708\" class=\"wp-caption-text\">Un bloque personalizado con una barra de herramientas normal<\/figcaption><\/figure>\n<p>Al definir el atributo <code>lock<\/code>, como se ve en el c\u00f3digo anterior, se ocultan los desplazamientos del bloque y los controles <strong>Mover a<\/strong> y <strong>Eliminar<\/strong> de la barra de herramientas del bloque. La imagen siguiente muestra el resultado final en la pantalla:<\/p>\n<figure id=\"attachment_112709\" aria-describedby=\"caption-attachment-112709\" style=\"width: 1284px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-112709\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/custom-block-without-move-and-remove-controls.jpg\" alt=\"A custom block without move and remove controls.\" width=\"1284\" height=\"762\"><figcaption id=\"caption-attachment-112709\" class=\"wp-caption-text\">Un bloque personalizado sin controles de mover y eliminar<\/figcaption><\/figure>\n<p>Tambi\u00e9n puedes bloquear un bloque espec\u00edfico en un patr\u00f3n de bloques. Para ver un ejemplo, consulta tambi\u00e9n <a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/08\/locking-blocks-in-wordpress-5-9\/\">Bloques de bloqueo en WordPress 5.9<\/a>.<\/p>\n<h3>Nueva API para acceder a la configuraci\u00f3n global y a los estilos<\/h3>\n<p>WordPress 5.9 introduce una nueva <a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/04\/new-api-to-access-global-settings-styles\/\">API p\u00fablica de PHP<\/a> para leer datos de theme <strong>.json<\/strong>.<\/p>\n<h4>Lectura de ajustes y estilos desde theme.json<\/h4>\n<p>Hay dos nuevas funciones para leer datos de las secciones <code>settings<\/code> y <code>styles<\/code> declaradas en el theme. <strong>json<\/strong>:<\/p>\n<pre><code class=\"language-php\">wp_get_global_settings( $path = array() , $context = array() );\nwp_get_global_styles( $path = array(), $context = array() );<\/code><\/pre>\n<ul>\n<li><code>$path<\/code> es una matriz que enumera la ruta de acceso al ajuste especificado<\/li>\n<li><code>$context<\/code> es una matriz que establece el contexto para esos datos. Los desarrolladores pueden leer desde una secci\u00f3n espec\u00edfica de ajustes del bloque &#8211; por ejemplo, <code>array( 'block_name' =&gt; 'core\/paragraph' )<\/code>. La clave <code>orygin<\/code> establecida en <code>base<\/code> permite ignorar los datos personalizados guardados por el usuario.<\/li>\n<\/ul>\n<p>El siguiente c\u00f3digo de ejemplo devolver\u00eda el valor de ajuste de <code>contentSize<\/code>. En Veintid\u00f3s, ser\u00eda <code>650px<\/code>:<\/p>\n<pre><code class=\"language-php\">wp_get_global_settings( array( 'layout', 'contentSize' ) );<\/code><\/pre>\n<p>Estableciendo un contexto, puedes recuperar estilos para bloques espec\u00edficos. El siguiente c\u00f3digo muestra c\u00f3mo recuperar el valor del radio del borde para el bloque <code>core\/button<\/code>:<\/p>\n<pre><code class=\"language-php\">function get_global_styles() {\n\treturn\n\twp_get_global_styles(\n\t\tarray( 'border', 'radius' ),\n\t\tarray( 'block_name' =&gt; 'core\/button' )\n\t);\n}<\/code><\/pre>\n<p>La funci\u00f3n anterior devuelve el valor de la propiedad requerida teniendo en cuenta la configuraci\u00f3n por defecto, la configuraci\u00f3n del tema y los datos del usuario. El valor personalizado se proporcionar\u00e1 si el usuario configura el radio del borde del bot\u00f3n en la interfaz de Estilos Globales.<\/p>\n<p>Para ignorar los datos del usuario, utilizar\u00edas el siguiente c\u00f3digo:<\/p>\n<pre><code class=\"language-php\">function get_global_styles() {\n\treturn\n\twp_get_global_styles(\n\t\tarray( 'border', 'radius' ),\n\t\tarray( 'block_name' =&gt; 'core\/button', 'origin' =&gt; 'base' )\n\t);\n}<\/code><\/pre>\n<h4>Obtener la hoja de estilos generada<\/h4>\n<p>WordPress 5.9 tambi\u00e9n introduce una nueva funci\u00f3n para obtener la hoja de estilos resultante de los estilos por defecto, del tema y de los estilos personalizados:<\/p>\n<pre><code class=\"language-php\">wp_get_global_stylesheet( $types = array() );<\/code><\/pre>\n<p><code>$types<\/code> es una lista de los estilos a generar.<\/p>\n<p>Puedes leer m\u00e1s sobre la nueva API en <a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/04\/new-api-to-access-global-settings-styles\/\">Nueva API para acceder a la configuraci\u00f3n global y a los estilos<\/a>.<\/p>\n<h3>M\u00e1s caracter\u00edsticas para desarrolladores<\/h3>\n<p>Entre los cambios adicionales de WordPress 5.9 para desarrolladores que quiz\u00e1 quieras conocer est\u00e1n<\/p>\n<ul>\n<li><a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/04\/block-themes-a-new-way-to-build-themes-in-wordpress-5-9\/\">Temas en bloque, una nueva forma de crear temas en WordPress 5.9<\/a><\/li>\n<li><a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/08\/updates-for-settings-styles-and-theme-json\/\">Actualizaciones para los ajustes, estilos y theme.json<\/a><\/li>\n<li><a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/07\/theme-focused-changes-and-filters-in-wordpress-5-9\/\">Cambios y filtros centrados en los temas en WordPress 5.9<\/a><\/li>\n<li><a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/05\/new-capability-queries-in-wordpress-5-9\/\">Nuevas consultas de capacidad en WordPress 5.9<\/a><\/li>\n<li><a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/04\/miscellaneous-core-changes-in-wordpress-5-9\/\">Varios cambios en el n\u00facleo de WordPress 5.9<\/a><\/li>\n<li><a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/04\/miscellaneous-block-editor-changes-in-wordpress-5-9\/\">Cambios varios en el editor de bloques en WordPress 5.9<\/a><\/li>\n<li><a href=\"https:\/\/make.wordpress.org\/core\/2021\/12\/28\/take-more-control-over-inner-block-areas-as-a-block-developer\/\">M\u00e1s control sobre las \u00e1reas internas de los bloques (como desarrollador de bloques)<\/a><\/li>\n<\/ul>\n\n<h2>Resumen<\/h2>\n<p>Terminaremos este art\u00edculo con una nota r\u00e1pida sobre la <a href=\"https:\/\/kinsta.com\/es\/cuota-de-mercado-de-wordpress\/\">cuota de mercado de WordPress<\/a>. Actualmente, WordPress impulsa m\u00e1s del 65% de todos los sitios web cuyo sistema de gesti\u00f3n de contenidos se conoce y se sit\u00faa al norte del <strong>43% de todos los sitios web<\/strong>.<\/p>\n<p>Estas cifras son impresionantes, sobre todo si se comparan con las de los competidores m\u00e1s cercanos, con menos del 5% de cuota de mercado, como Shopify.<\/p>\n<p>Y esto tambi\u00e9n significa que no puedes pasar por alto la evoluci\u00f3n <a href=\"https:\/\/kinsta.com\/es\/blog\/sitema-de-gestion-de-contenido\/\">del CMS WP<\/a>. Cada <a href=\"https:\/\/kinsta.com\/es\/blog\/version-wordpress\/\">nueva versi\u00f3n de WordPress<\/a> aporta nuevas caracter\u00edsticas, mejoras en la interfaz y en el rendimiento, y WordPress 5.9 no es una excepci\u00f3n. Todo lo que necesitas para probar las nuevas caracter\u00edsticas es un tema en bloque, como el nuevo tema por defecto Twenty Twenty-Two, y estar\u00e1s listo para empezar.<\/p>\n<p><em>\u00a1Ahora te toca a ti! \u00bfEst\u00e1s preparado para cambiar a los temas de bloques y a FSE? \u00bfY cu\u00e1les son tus cambios favoritos de WordPress 5.9?<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u00a1Ya est\u00e1 aqu\u00ed WordPress 5.9 Josephine! El lanzamiento de la primera versi\u00f3n de WordPress del a\u00f1o estaba previsto inicialmente para el 14 de diciembre de 2021. &#8230;<\/p>\n","protected":false},"author":36,"featured_media":46901,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_kinsta_gated_content":false,"_kinsta_gated_content_redirect":"","footnotes":""},"tags":[421,919,920,414,172],"topic":[1357],"class_list":["post-46900","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","tag-cms","tag-editing","tag-updates","tag-webdev","tag-wordpress","topic-actualizaciones-wordpress"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v24.6 (Yoast SEO v24.6) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Novedades de WordPress 5.9 - Full Site Editing, Estilos Globales, Bloques, Patrones, APIs, Mejoras UI y Mucho M\u00e1s<\/title>\n<meta name=\"description\" content=\"Consulta nuestro an\u00e1lisis en profundidad de WordPress 5.9 y descubre todas las principales caracter\u00edsticas introducidas en la primera versi\u00f3n de WordPress de 2022.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Novedades de WordPress 5.9 - Full Site Editing, Estilos Globales, Bloques, Patrones, APIs, Mejoras UI y Mucho M\u00e1s\" \/>\n<meta property=\"og:description\" content=\"Consulta nuestro an\u00e1lisis en profundidad de WordPress 5.9 y descubre todas las principales caracter\u00edsticas introducidas en la primera versi\u00f3n de WordPress de 2022.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/\" \/>\n<meta property=\"og:site_name\" content=\"Kinsta\u00ae\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/kinsta.es\/\" \/>\n<meta property=\"article:published_time\" content=\"2022-01-19T13:34:01+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-01-31T13:57:15+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2022\/01\/whats-new-in-wordpress-5-9.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1460\" \/>\n\t<meta property=\"og:image:height\" content=\"730\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Carlo Daniele\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:description\" content=\"Consulta nuestro an\u00e1lisis en profundidad de WordPress 5.9 y descubre todas las principales caracter\u00edsticas introducidas en la primera versi\u00f3n de WordPress de 2022.\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2022\/01\/whats-new-in-wordpress-5-9.jpg\" \/>\n<meta name=\"twitter:creator\" content=\"@carlodaniele\" \/>\n<meta name=\"twitter:site\" content=\"@Kinsta_ES\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Carlo Daniele\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"42 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/\"},\"author\":{\"name\":\"Carlo Daniele\",\"@id\":\"https:\/\/kinsta.com\/es\/#\/schema\/person\/962dde02ea6f5df089b5d8d0853bbc63\"},\"headline\":\"Novedades de WordPress 5.9 &#8211; Full Site Editing, Estilos Globales, Bloques, Patrones, APIs, Mejoras UI y Mucho M\u00e1s\",\"datePublished\":\"2022-01-19T13:34:01+00:00\",\"dateModified\":\"2025-01-31T13:57:15+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/\"},\"wordCount\":7344,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/es\/#organization\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2022\/01\/whats-new-in-wordpress-5-9.jpg\",\"keywords\":[\"CMS\",\"editing\",\"updates\",\"webdev\",\"WordPress\"],\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/\",\"url\":\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/\",\"name\":\"Novedades de WordPress 5.9 - Full Site Editing, Estilos Globales, Bloques, Patrones, APIs, Mejoras UI y Mucho M\u00e1s\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/es\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2022\/01\/whats-new-in-wordpress-5-9.jpg\",\"datePublished\":\"2022-01-19T13:34:01+00:00\",\"dateModified\":\"2025-01-31T13:57:15+00:00\",\"description\":\"Consulta nuestro an\u00e1lisis en profundidad de WordPress 5.9 y descubre todas las principales caracter\u00edsticas introducidas en la primera versi\u00f3n de WordPress de 2022.\",\"breadcrumb\":{\"@id\":\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/#primaryimage\",\"url\":\"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2022\/01\/whats-new-in-wordpress-5-9.jpg\",\"contentUrl\":\"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2022\/01\/whats-new-in-wordpress-5-9.jpg\",\"width\":1460,\"height\":730,\"caption\":\"Novedades de WordPress 5.9 - Edici\u00f3n completa del sitio, estilos globales, bloques, patrones, API, mejoras de la interfaz de usuario y mucho m\u00e1s\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/kinsta.com\/es\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Actualizaciones de WordPress\",\"item\":\"https:\/\/kinsta.com\/es\/secciones\/actualizaciones-wordpress\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Novedades de WordPress 5.9 &#8211; Full Site Editing, Estilos Globales, Bloques, Patrones, APIs, Mejoras UI y Mucho M\u00e1s\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/kinsta.com\/es\/#website\",\"url\":\"https:\/\/kinsta.com\/es\/\",\"name\":\"Kinsta\u00ae\",\"description\":\"Soluciones de alojamiento premium, r\u00e1pidas y seguras\",\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/es\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/kinsta.com\/es\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/kinsta.com\/es\/#organization\",\"name\":\"Kinsta\",\"url\":\"https:\/\/kinsta.com\/es\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/kinsta.com\/es\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2023\/12\/kinsta-logo.jpeg\",\"contentUrl\":\"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2023\/12\/kinsta-logo.jpeg\",\"width\":500,\"height\":500,\"caption\":\"Kinsta\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/es\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/kinsta.es\/\",\"https:\/\/x.com\/Kinsta_ES\",\"https:\/\/www.instagram.com\/kinstahosting\/\",\"https:\/\/www.linkedin.com\/company\/kinsta\/\",\"https:\/\/www.pinterest.com\/kinstahosting\/\",\"https:\/\/www.youtube.com\/c\/Kinsta\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/kinsta.com\/es\/#\/schema\/person\/962dde02ea6f5df089b5d8d0853bbc63\",\"name\":\"Carlo Daniele\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/kinsta.com\/es\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/429e5568f88110fd9a409b84cb22197e?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/429e5568f88110fd9a409b84cb22197e?s=96&d=mm&r=g\",\"caption\":\"Carlo Daniele\"},\"description\":\"Carlo is a passionate lover of webdesign and front-end development. He has been playing with WordPress for more than 20 years, also in collaboration with Italian and European universities and educational institutions. He has written hundreds of articles and guides about WordPress, published both on Italian and international websites, as well as on printed magazines. You can find him on LinkedIn.\",\"sameAs\":[\"https:\/\/frammentidicodice.com\/\",\"https:\/\/x.com\/carlodaniele\"],\"url\":\"https:\/\/kinsta.com\/es\/blog\/author\/carlodaniele\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Novedades de WordPress 5.9 - Full Site Editing, Estilos Globales, Bloques, Patrones, APIs, Mejoras UI y Mucho M\u00e1s","description":"Consulta nuestro an\u00e1lisis en profundidad de WordPress 5.9 y descubre todas las principales caracter\u00edsticas introducidas en la primera versi\u00f3n de WordPress de 2022.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/","og_locale":"es_ES","og_type":"article","og_title":"Novedades de WordPress 5.9 - Full Site Editing, Estilos Globales, Bloques, Patrones, APIs, Mejoras UI y Mucho M\u00e1s","og_description":"Consulta nuestro an\u00e1lisis en profundidad de WordPress 5.9 y descubre todas las principales caracter\u00edsticas introducidas en la primera versi\u00f3n de WordPress de 2022.","og_url":"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/","og_site_name":"Kinsta\u00ae","article_publisher":"https:\/\/www.facebook.com\/kinsta.es\/","article_published_time":"2022-01-19T13:34:01+00:00","article_modified_time":"2025-01-31T13:57:15+00:00","og_image":[{"width":1460,"height":730,"url":"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2022\/01\/whats-new-in-wordpress-5-9.jpg","type":"image\/jpeg"}],"author":"Carlo Daniele","twitter_card":"summary_large_image","twitter_description":"Consulta nuestro an\u00e1lisis en profundidad de WordPress 5.9 y descubre todas las principales caracter\u00edsticas introducidas en la primera versi\u00f3n de WordPress de 2022.","twitter_image":"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2022\/01\/whats-new-in-wordpress-5-9.jpg","twitter_creator":"@carlodaniele","twitter_site":"@Kinsta_ES","twitter_misc":{"Escrito por":"Carlo Daniele","Tiempo de lectura":"42 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/#article","isPartOf":{"@id":"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/"},"author":{"name":"Carlo Daniele","@id":"https:\/\/kinsta.com\/es\/#\/schema\/person\/962dde02ea6f5df089b5d8d0853bbc63"},"headline":"Novedades de WordPress 5.9 &#8211; Full Site Editing, Estilos Globales, Bloques, Patrones, APIs, Mejoras UI y Mucho M\u00e1s","datePublished":"2022-01-19T13:34:01+00:00","dateModified":"2025-01-31T13:57:15+00:00","mainEntityOfPage":{"@id":"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/"},"wordCount":7344,"commentCount":0,"publisher":{"@id":"https:\/\/kinsta.com\/es\/#organization"},"image":{"@id":"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2022\/01\/whats-new-in-wordpress-5-9.jpg","keywords":["CMS","editing","updates","webdev","WordPress"],"inLanguage":"es","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/","url":"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/","name":"Novedades de WordPress 5.9 - Full Site Editing, Estilos Globales, Bloques, Patrones, APIs, Mejoras UI y Mucho M\u00e1s","isPartOf":{"@id":"https:\/\/kinsta.com\/es\/#website"},"primaryImageOfPage":{"@id":"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/#primaryimage"},"image":{"@id":"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2022\/01\/whats-new-in-wordpress-5-9.jpg","datePublished":"2022-01-19T13:34:01+00:00","dateModified":"2025-01-31T13:57:15+00:00","description":"Consulta nuestro an\u00e1lisis en profundidad de WordPress 5.9 y descubre todas las principales caracter\u00edsticas introducidas en la primera versi\u00f3n de WordPress de 2022.","breadcrumb":{"@id":"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/#primaryimage","url":"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2022\/01\/whats-new-in-wordpress-5-9.jpg","contentUrl":"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2022\/01\/whats-new-in-wordpress-5-9.jpg","width":1460,"height":730,"caption":"Novedades de WordPress 5.9 - Edici\u00f3n completa del sitio, estilos globales, bloques, patrones, API, mejoras de la interfaz de usuario y mucho m\u00e1s"},{"@type":"BreadcrumbList","@id":"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kinsta.com\/es\/"},{"@type":"ListItem","position":2,"name":"Actualizaciones de WordPress","item":"https:\/\/kinsta.com\/es\/secciones\/actualizaciones-wordpress\/"},{"@type":"ListItem","position":3,"name":"Novedades de WordPress 5.9 &#8211; Full Site Editing, Estilos Globales, Bloques, Patrones, APIs, Mejoras UI y Mucho M\u00e1s"}]},{"@type":"WebSite","@id":"https:\/\/kinsta.com\/es\/#website","url":"https:\/\/kinsta.com\/es\/","name":"Kinsta\u00ae","description":"Soluciones de alojamiento premium, r\u00e1pidas y seguras","publisher":{"@id":"https:\/\/kinsta.com\/es\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/kinsta.com\/es\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Organization","@id":"https:\/\/kinsta.com\/es\/#organization","name":"Kinsta","url":"https:\/\/kinsta.com\/es\/","logo":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/kinsta.com\/es\/#\/schema\/logo\/image\/","url":"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2023\/12\/kinsta-logo.jpeg","contentUrl":"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2023\/12\/kinsta-logo.jpeg","width":500,"height":500,"caption":"Kinsta"},"image":{"@id":"https:\/\/kinsta.com\/es\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/kinsta.es\/","https:\/\/x.com\/Kinsta_ES","https:\/\/www.instagram.com\/kinstahosting\/","https:\/\/www.linkedin.com\/company\/kinsta\/","https:\/\/www.pinterest.com\/kinstahosting\/","https:\/\/www.youtube.com\/c\/Kinsta"]},{"@type":"Person","@id":"https:\/\/kinsta.com\/es\/#\/schema\/person\/962dde02ea6f5df089b5d8d0853bbc63","name":"Carlo Daniele","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/kinsta.com\/es\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/429e5568f88110fd9a409b84cb22197e?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/429e5568f88110fd9a409b84cb22197e?s=96&d=mm&r=g","caption":"Carlo Daniele"},"description":"Carlo is a passionate lover of webdesign and front-end development. He has been playing with WordPress for more than 20 years, also in collaboration with Italian and European universities and educational institutions. He has written hundreds of articles and guides about WordPress, published both on Italian and international websites, as well as on printed magazines. You can find him on LinkedIn.","sameAs":["https:\/\/frammentidicodice.com\/","https:\/\/x.com\/carlodaniele"],"url":"https:\/\/kinsta.com\/es\/blog\/author\/carlodaniele\/"}]}},"acf":[],"_links":{"self":[{"href":"https:\/\/kinsta.com\/es\/wp-json\/wp\/v2\/posts\/46900","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kinsta.com\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kinsta.com\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kinsta.com\/es\/wp-json\/wp\/v2\/users\/36"}],"replies":[{"embeddable":true,"href":"https:\/\/kinsta.com\/es\/wp-json\/wp\/v2\/comments?post=46900"}],"version-history":[{"count":13,"href":"https:\/\/kinsta.com\/es\/wp-json\/wp\/v2\/posts\/46900\/revisions"}],"predecessor-version":[{"id":48662,"href":"https:\/\/kinsta.com\/es\/wp-json\/wp\/v2\/posts\/46900\/revisions\/48662"}],"alternate":[{"embeddable":true,"hreflang":"en","title":"English","href":"https:\/\/kinsta.com\/es\/wp-json\/kinsta\/v1\/posts\/46900\/translations\/en"},{"embeddable":true,"hreflang":"de","title":"German","href":"https:\/\/kinsta.com\/es\/wp-json\/kinsta\/v1\/posts\/46900\/translations\/de"},{"embeddable":true,"hreflang":"it","title":"Italian","href":"https:\/\/kinsta.com\/es\/wp-json\/kinsta\/v1\/posts\/46900\/translations\/it"},{"embeddable":true,"hreflang":"fr","title":"French","href":"https:\/\/kinsta.com\/es\/wp-json\/kinsta\/v1\/posts\/46900\/translations\/fr"},{"embeddable":true,"hreflang":"pt","title":"Portuguese","href":"https:\/\/kinsta.com\/es\/wp-json\/kinsta\/v1\/posts\/46900\/translations\/pt"},{"embeddable":true,"hreflang":"es","title":"Spanish","href":"https:\/\/kinsta.com\/es\/wp-json\/kinsta\/v1\/posts\/46900\/translations\/es"},{"embeddable":true,"hreflang":"nl","title":"Dutch","href":"https:\/\/kinsta.com\/es\/wp-json\/kinsta\/v1\/posts\/46900\/translations\/nl"},{"embeddable":true,"hreflang":"sv","title":"Swedish","href":"https:\/\/kinsta.com\/es\/wp-json\/kinsta\/v1\/posts\/46900\/translations\/se"},{"embeddable":true,"hreflang":"da","title":"Danish","href":"https:\/\/kinsta.com\/es\/wp-json\/kinsta\/v1\/posts\/46900\/translations\/dk"},{"embeddable":true,"hreflang":"ja","title":"Japanese","href":"https:\/\/kinsta.com\/es\/wp-json\/kinsta\/v1\/posts\/46900\/translations\/jp"},{"href":"https:\/\/kinsta.com\/es\/wp-json\/kinsta\/v1\/posts\/46900\/tree"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/kinsta.com\/es\/wp-json\/wp\/v2\/media\/46901"}],"wp:attachment":[{"href":"https:\/\/kinsta.com\/es\/wp-json\/wp\/v2\/media?parent=46900"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kinsta.com\/es\/wp-json\/wp\/v2\/tags?post=46900"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/kinsta.com\/es\/wp-json\/wp\/v2\/topic?post=46900"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}