{"id":52245,"date":"2022-01-18T13:47:33","date_gmt":"2022-01-18T12:47:33","guid":{"rendered":"https:\/\/kinsta.com\/fr\/?p=52245&#038;preview=true&#038;preview_id=52245"},"modified":"2024-10-08T13:24:23","modified_gmt":"2024-10-08T12:24:23","slug":"wordpress-5-9","status":"publish","type":"post","link":"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/","title":{"rendered":"Nouveaut\u00e9s de WordPress 5.9 &#8211; Modification compl\u00e8te du site, styles globaux, blocs, mod\u00e8les, API, am\u00e9liorations de l&rsquo;interface utilisateur et bien plus encore"},"content":{"rendered":"<p><a href=\"https:\/\/wordpress.org\/news\/2022\/01\/josephine\/\">WordPress 5.9 Jos\u00e9phine<\/a> est arriv\u00e9 ! La premi\u00e8re version de WordPress de l&rsquo;ann\u00e9e \u00e9tait initialement pr\u00e9vue pour une sortie le 14 d\u00e9cembre 2021. En raison de plusieurs probl\u00e8mes ouverts et de bogues non r\u00e9solus, <a href=\"https:\/\/make.wordpress.org\/core\/2021\/11\/22\/wordpress-5-9-revised-release-schedule\/\">la version finale avait \u00e9t\u00e9 retard\u00e9e<\/a> et a finalement \u00e9t\u00e9 publi\u00e9e le 25 janvier 2022.<\/p>\n<p>Si vous vous demandez ce qu&rsquo;il y a de nouveau dans WordPress 5.9, la r\u00e9ponse courte est <strong>Full Site Editing<\/strong> (FSE).<\/p>\n<p>Et en effet, de nombreuses fonctionnalit\u00e9s de la version 5.9 ne sont disponibles que si vous utilisez un th\u00e8me prenant en charge Full Site Editing, comme le tout nouveau th\u00e8me par d\u00e9faut, <a href=\"https:\/\/kinsta.com\/fr\/blog\/twenty-twenty-two-themes\/\">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=\"wp-image-110731 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/tt2.jpg\" alt=\"Un aper\u00e7u de Twenty Twenty-Two, le nouveau th\u00e8me par d\u00e9faut de WordPress.\" width=\"2560\" height=\"1752\"><figcaption id=\"caption-attachment-110731\" class=\"wp-caption-text\">Un aper\u00e7u de Twenty Twenty-Two, le nouveau th\u00e8me par d\u00e9faut de WordPress. (Image source : <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/06\/introducing-twenty-twenty-two\/\">WordPress.org<\/a>)<\/figcaption><\/figure>\n<p>Avec WordPress 5.9, nous entrons dans le c\u0153ur de la deuxi\u00e8me phase de la <a href=\"https:\/\/wordpress.org\/about\/roadmap\/\">feuille de route de Gutenberg<\/a>: la <strong>phase de personnalisation<\/strong>, qui est principalement ax\u00e9e sur le Full Site Editing, les compositions de blocs, le r\u00e9pertoire de blocs et les th\u00e8mes bas\u00e9s sur les blocs.<\/p>\n<blockquote><p><em>Avec la 5.9, qui sortira le mois prochain, nous sommes &#8211; je dirais &#8211; au MVP, le Minimum Viable Product de cette phase de personnalisation de Gutenberg.<\/em><\/p><\/blockquote>\n<p>Ces mots de Matt Mullenweg au <a href=\"https:\/\/wordpress.tv\/2021\/12\/15\/matt-mullenweg-2021-state-of-the-word\/\">2021 State of the Word<\/a> r\u00e9sument le mieux les principales caract\u00e9ristiques de la nouvelle version 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=\"wp-image-113486 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/gutenberg-roadmap-2.jpg\" alt=\"La feuille de route de Gutenberg.\" width=\"1940\" height=\"1120\"><figcaption id=\"caption-attachment-113486\" class=\"wp-caption-text\">La feuille de route de Gutenberg. (Image source : <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>Cela dit, qu&rsquo;y a-t-il de nouveau dans la premi\u00e8re version de WordPress de 2022 ?<\/p>\n<p>Nous allons le d\u00e9couvrir !<\/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>Styles globaux : Une interface graphique pour <strong>theme.json<\/strong><\/h2>\n<p>Avec la <a href=\"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-8\/#block-settings-and-styles-with-themejson\">sortie de WordPress 5.8<\/a> en 2021, la manipulation du fichier <a href=\"https:\/\/developer.wordpress.org\/block-editor\/reference-guides\/theme-json-reference\/\">theme.json<\/a> est devenue le moyen standard pour les d\u00e9veloppeurs de th\u00e8mes de personnaliser les r\u00e9glages et les styles de l&rsquo;\u00e9diteur.<\/p>\n<p>WordPress 5.9 fait passer les choses au niveau sup\u00e9rieur en introduisant une interface graphique qui permet aux utilisateurs de personnaliser les <a href=\"https:\/\/kinsta.com\/fr\/blog\/twenty-twenty-two-themes\/#twenty-twentytwo-at-its-core-a-quick-overview-of-themejson\">pr\u00e9-r\u00e9glages de style<\/a> pour leurs sites web, soit globalement, soit au niveau du bloc, sans \u00e9crire une seule ligne de code.<\/p>\n<p>Le m\u00e9canisme des styles globaux devrait modifier consid\u00e9rablement la fa\u00e7on dont vous avez l&rsquo;habitude de personnaliser l&rsquo;apparence de vos sites web, car les <a href=\"https:\/\/make.wordpress.org\/design\/handbook\/focuses\/global-styles\/\">styles globaux<\/a> affectent plusieurs aspects de la conception des sites WordPress.<\/p>\n<p>Tout d&rsquo;abord, l&rsquo;interface des styles globaux remplace l&rsquo;<a href=\"https:\/\/kinsta.com\/fr\/blog\/comment-personnaliser-theme-wordpress\/#customizing-your-theme-via-the-customizer\">outil de personnalisation<\/a> et constitue d\u00e9sormais le seul moyen de personnaliser les r\u00e9glages et les styles avec les th\u00e8mes bas\u00e9s sur des blocs. De m\u00eame, les pages d&rsquo;administration complexes des options de th\u00e8me ne seront plus n\u00e9cessaires. Cela fournit un nouveau moyen standard de configurer les r\u00e9glages et les styles des th\u00e8mes et, en m\u00eame temps, devrait rationaliser le flux de travail de d\u00e9veloppement des th\u00e8mes.<\/p>\n<p>Avec les styles globaux, les utilisateurs de WordPress b\u00e9n\u00e9ficient d&rsquo;un contr\u00f4le accru sur la pr\u00e9sentation de leurs sites web, \u00e0 la fois globalement et par type de bloc, au-del\u00e0 du contexte des pages ou des articles individuels.<\/p>\n<p>Une nouvelle colonne lat\u00e9rale est maintenant disponible dans l&rsquo;\u00e9diteur de site, en haut de laquelle vous trouverez un petit panneau d&rsquo;aper\u00e7u et quatre composants dans l&rsquo;ordre suivant :<\/p>\n<ul>\n<li><a href=\"#typography\">Typographie<\/a><\/li>\n<li><a href=\"#colors\">Couleurs<\/a><\/li>\n<li><a href=\"#layout\">Mise en page<\/a><\/li>\n<li><a href=\"#blocks\">Blocs<\/a><\/li>\n<\/ul>\n<p>Nous pouvons nous attendre \u00e0 ce que de nouveaux composants soient <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/34574\">ajout\u00e9s au fil du temps<\/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=\"wp-image-112441 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/global-styles-sidebar.jpg\" alt=\"La colonne lat\u00e9rale des styles globaux avec le th\u00e8me Blockbase d'Automattic.\" width=\"1962\" height=\"1290\"><figcaption id=\"caption-attachment-112441\" class=\"wp-caption-text\">La colonne lat\u00e9rale des styles globaux avec le <a href=\"https:\/\/wordpress.org\/themes\/blockbase\/\">th\u00e8me Blockbase<\/a> d&rsquo;Automattic.<\/figcaption><\/figure>\n<p>Regardons de plus pr\u00e8s la nouvelle interface.<\/p>\n\n<h3>Pr\u00e9visualisation de style<\/h3>\n<p>Le premier \u00e9l\u00e9ment de la colonne lat\u00e9rale des styles globaux est un panneau d&rsquo;aper\u00e7u. Ce panneau vous permet de v\u00e9rifier le r\u00e9sultat de vos personnalisations et est particuli\u00e8rement utile lorsque vos modifications s&rsquo;appliquent \u00e0 des \u00e9l\u00e9ments non visibles dans le canevas de l&rsquo;\u00e9diteur de site.<\/p>\n<p>L&rsquo;image suivante montre la comparaison de trois combinaisons de styles diff\u00e9rents :<\/p>\n<figure id=\"attachment_112425\" aria-describedby=\"caption-attachment-112425\" style=\"width: 1826px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112425 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/global-styles-preview.jpg\" alt=\"Pr\u00e9visualisations de styles globaux compar\u00e9es.\" width=\"1826\" height=\"1230\"><figcaption id=\"caption-attachment-112425\" class=\"wp-caption-text\">Pr\u00e9visualisations de styles globaux compar\u00e9es.<\/figcaption><\/figure>\n<h3>Typographie<\/h3>\n<p>Le panneau Typographie est l&rsquo;endroit o\u00f9 vous contr\u00f4lez la typographie de votre site web. Bien entendu, les contr\u00f4les disponibles dans ce panneau d\u00e9pendent des r\u00e9glages de votre <strong>theme.json<\/strong>.<\/p>\n<p>Par exemple, le th\u00e8me <a href=\"https:\/\/wordpress.org\/themes\/tt1-blocks\/\">Twenty Twenty-One Blocks<\/a> (TT1 Blocks) d\u00e9clare les propri\u00e9t\u00e9s de typographie suivantes :<\/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>L&rsquo;image suivante montre les r\u00e9glages de typographie r\u00e9sultants dans la colonne lat\u00e9rale des styles globaux :<\/p>\n<figure id=\"attachment_112443\" aria-describedby=\"caption-attachment-112443\" style=\"width: 1790px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112443 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/tt1b-typography-settings.jpg\" alt=\"R\u00e9glages de typographie dans les styles globaux de TT1 Blocks.\" width=\"1790\" height=\"1146\"><figcaption id=\"caption-attachment-112443\" class=\"wp-caption-text\">R\u00e9glages de typographie dans les styles globaux de TT1 Blocks.<\/figcaption><\/figure>\n<p>Plongeons un peu plus profond\u00e9ment et voyons comment le th\u00e8me TT1 Blocks d\u00e9clare <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>Vous pouvez v\u00e9rifier ces familles de polices dans le panneau d&rsquo;aper\u00e7u des styles globaux :<\/p>\n<figure id=\"attachment_112427\" aria-describedby=\"caption-attachment-112427\" style=\"width: 1682px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112427 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/tt1b-font-preview.jpg\" alt=\"Familles de polices disponibles dans Twenty Twenty-One Blocks.\" width=\"1682\" height=\"804\"><figcaption id=\"caption-attachment-112427\" class=\"wp-caption-text\">Familles de polices disponibles dans Twenty Twenty-One Blocks.<\/figcaption><\/figure>\n<h3>Couleurs<\/h3>\n<p>Dans la section Couleurs, vous pouvez afficher et modifier les palettes de couleurs et personnaliser la couleur de plusieurs \u00e9l\u00e9ments du site.<\/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=\"Panneau des couleurs dans les modules Twenty Twenty-One\" width=\"1522\" height=\"1348\"><figcaption id=\"caption-attachment-112428\" class=\"wp-caption-text\">Panneau des couleurs dans les modules Twenty Twenty-One<\/figcaption><\/figure>\n<p>En cliquant sur ces \u00e9l\u00e9ments, vous acc\u00e9dez \u00e0 un nouveau panneau o\u00f9 vous pouvez choisir les couleurs parmi trois palettes de couleurs : Palette par d\u00e9faut, Palette du th\u00e8me et Palette personnalis\u00e9e (pour en savoir plus, lisez <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/29568\">Couleurs par d\u00e9faut, Couleurs du th\u00e8me et Couleurs personnalis\u00e9es<\/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=\"R\u00e9glages de couleur dans les blocs Twenty Twenty-One\" width=\"1790\" height=\"1146\"><figcaption id=\"caption-attachment-112445\" class=\"wp-caption-text\">R\u00e9glages de couleur dans les blocs Twenty Twenty-One<\/figcaption><\/figure>\n<p>Dans ce panneau, vous pourrez d\u00e9finir et modifier la couleur de l&rsquo;\u00e9l\u00e9ment actuel.<\/p>\n<figure id=\"attachment_112430\" aria-describedby=\"caption-attachment-112430\" style=\"width: 1522px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112430 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/color-picker-1.jpg\" alt=\"Personnalisation de la couleur des liens dans les styles globaux\" width=\"1522\" height=\"1286\"><figcaption id=\"caption-attachment-112430\" class=\"wp-caption-text\">Personnalisation de la couleur des liens dans les styles globaux<\/figcaption><\/figure>\n<h3>Mise en page<\/h3>\n<p>Le dernier groupe d&rsquo;outils est destin\u00e9 aux personnalisations de la mise en page. Dans le contexte global, celle-ci est limit\u00e9e au conteneur du site.<\/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=\"R\u00e9glages de mise en page dans les blocs Twenty Twenty-One.\" width=\"2404\" height=\"1350\"><figcaption id=\"caption-attachment-112431\" class=\"wp-caption-text\">R\u00e9glages de mise en page dans les blocs Twenty Twenty-One.<\/figcaption><\/figure>\n<h3>Blocs<\/h3>\n<p>Gr\u00e2ce \u00e0 l&rsquo;impl\u00e9mentation du m\u00e9canisme de styles globaux, il est d\u00e9sormais \u00e9galement possible de modifier l&rsquo;apparence de blocs sp\u00e9cifiques, tels que Paragraphe (typographie et couleurs), Boutons (mise en page) et Colonne (couleurs et mise en page).<\/p>\n<p>Notez que les <strong>styles de bloc peuvent \u00eatre personnalis\u00e9s \u00e0 partir de l&rsquo;interface des styles globaux uniquement si le bloc d\u00e9clare la prise en charge d&rsquo;une fonctionnalit\u00e9 sp\u00e9cifique<\/strong> dans le fichier <strong>block.json<\/strong> correspondant. Par exemple, le bloc <code>core\/post-title<\/code> prend actuellement en charge les styles suivants :<\/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>Puisque le bloc <code>core\/post-title<\/code> prend en charge les couleurs, l&rsquo;espacement et la typographie, vous trouverez les entr\u00e9es correspondantes dans les r\u00e9glages de styles globaux du bloc Titre de publication.<\/p>\n<p>L&rsquo;image suivante montre les r\u00e9glages de typographie, que vous pouvez facilement comparer avec le code ci-dessus :<\/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=\"Personnalisation des r\u00e9glages de typographie du Titre de publication\" width=\"1790\" height=\"1308\"><figcaption id=\"caption-attachment-112449\" class=\"wp-caption-text\">Personnalisation des r\u00e9glages de typographie du Titre de publication<\/figcaption><\/figure>\n<p>Il convient de noter que WordPress 5.9 ne fournit que la premi\u00e8re impl\u00e9mentation de l&rsquo;interface des styles globaux. Comme le <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/34574\">souligne Matias Ventura<\/a>, nous pouvons raisonnablement nous attendre \u00e0 un d\u00e9veloppement plus pouss\u00e9 de la nouvelle fonctionnalit\u00e9 de contr\u00f4le des styles :<\/p>\n<blockquote><p>\u00c0 l&rsquo;avenir, des flux seront int\u00e9gr\u00e9s au syst\u00e8me pour vous permettre de passer des styles locaux aux styles globaux &#8211; par exemple, en apportant des personnalisations \u00e0 un bloc de boutons et en choisissant de les appliquer globalement \u00e0 tous les boutons de ce type.<\/p><\/blockquote>\n<p>Nous pourrions donc voir des am\u00e9liorations majeures prochainement. L&rsquo;image ci-dessous n&rsquo;est qu&rsquo;un exemple de ce \u00e0 quoi nous pouvons nous attendre :<\/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=\"\u00c0 l'avenir, vous pourrez contr\u00f4ler la couleur de l'\u00e9tat du lien.\" width=\"1586\" height=\"872\"><figcaption id=\"caption-attachment-112432\" class=\"wp-caption-text\">\u00c0 l&rsquo;avenir, vous pourrez contr\u00f4ler la couleur de l&rsquo;\u00e9tat du lien. (Image source <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/34574\">GitHub<\/a>)<\/figcaption><\/figure>\n<p>Des am\u00e9liorations suppl\u00e9mentaires pourraient inclure la <a href=\"https:\/\/github.com\/WordPress\/theme-experiments\/pull\/292\">possibilit\u00e9 pour les th\u00e8mes<\/a> de <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/36304\">fournir des palettes de couleurs alternatives<\/a> et de <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/35619\">multiples variations de style global<\/a>.<\/p>\n<p>https:\/\/twitter.com\/kjellr\/status\/1460270505513082881<\/p>\n<p>Les d\u00e9veloppeurs peuvent plonger plus profond\u00e9ment dans le m\u00e9canisme de style global dans l&rsquo;article de support <a href=\"https:\/\/developer.wordpress.org\/block-editor\/how-to-guides\/themes\/theme-json\/\">Global Settings &#038; Styles (theme.json)<\/a>. Vous trouverez des exemples suppl\u00e9mentaires dans notre <a href=\"https:\/\/kinsta.com\/fr\/blog\/twenty-twenty-two-themes\/#global-styles-in-twenty-twentytwo\">introduction au th\u00e8me par d\u00e9faut Twenty Twenty-Two<\/a>.<\/p>\n<h2>Le bloc Navigation<\/h2>\n<p>Le bloc Navigation <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/15\/wordpress-5-9-feature-go-no-go-october-14-2021\/\">a \u00e9t\u00e9 surnomm\u00e9<\/a> \u00ab l&rsquo;un des blocs de th\u00e8me les plus percutants \u00bb, et nous n&rsquo;avons pas peur de dire que nous sommes d&rsquo;accord.<\/p>\n<p>Le bloc est dans une phase embryonnaire depuis un certain temps (voir \u00e9galement le <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/27593\">probl\u00e8me de suivi du<\/a> bloc Navigation et le <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/35521\">probl\u00e8me de suivi i2<\/a>). Cependant, maintenant que tous les <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/36556\">probl\u00e8mes en suspens et les bloqueurs<\/a> list\u00e9s comme des incontournables de WordPress 5.9 ont \u00e9t\u00e9 corrig\u00e9s, nous pouvons enfin commencer \u00e0 utiliser <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/34041\">l&rsquo;une des fonctionnalit\u00e9s les plus puissantes<\/a> fusionn\u00e9es dans le c\u0153ur <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/15\/wordpress-5-9-feature-go-no-go-october-14-2021\/\">avec WordPress 5.9<\/a>.<\/p>\n<h3>Un aper\u00e7u rapide de l&rsquo;interface du bloc de navigation<\/h3>\n<p>L&rsquo;utilisation du nouveau bloc peut \u00eatre un peu d\u00e9routante au d\u00e9but, mais une fois que vous aurez pris le coup de main, vous appr\u00e9cierez tout son potentiel.<\/p>\n<figure id=\"attachment_112667\" aria-describedby=\"caption-attachment-112667\" style=\"width: 1382px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112667 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/navigation-block-placeholder.jpg\" alt=\"Le bloc Navigation\" width=\"1382\" height=\"404\"><figcaption id=\"caption-attachment-112667\" class=\"wp-caption-text\">Le bloc Navigation<\/figcaption><\/figure>\n<p>Lorsque vous ajoutez un bloc Navigation pour la premi\u00e8re fois, l&rsquo;espace r\u00e9serv\u00e9 au bloc propose trois options : s\u00e9lectionner un menu existant bas\u00e9 sur le bloc, cr\u00e9er un menu avec toutes les pages ou repartir de z\u00e9ro avec un menu vide.<\/p>\n<figure id=\"attachment_112672\" aria-describedby=\"caption-attachment-112672\" style=\"width: 1412px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112672 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/select-navigation-menu.jpg\" alt=\"S\u00e9lection d'un menu de navigation existant.\" width=\"1412\" height=\"860\"><figcaption id=\"caption-attachment-112672\" class=\"wp-caption-text\">S\u00e9lection d&rsquo;un menu de navigation existant.<\/figcaption><\/figure>\n<p>Le nouveau menu de navigation vous permet \u00e9galement d&rsquo;importer des menus cr\u00e9\u00e9s via <a href=\"https:\/\/wordpress.org\/support\/article\/appearance-menus-screen\/\">l&rsquo;\u00e9cran Menus d&rsquo;apparence<\/a> disponible avec les th\u00e8mes classiques.<\/p>\n<p>Cela signifie que si vous passez d&rsquo;un th\u00e8me classique \u00e0 un th\u00e8me bas\u00e9 sur des blocs, vous n&rsquo;aurez pas \u00e0 reconstruire vos menus existants. Il vous suffit de choisir l&rsquo;un de vos \u00ab Menus classiques \u00bb actuellement disponibles, et il sera automatiquement <a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/07\/the-new-navigation-block\/\">converti en un menu de navigation bas\u00e9 sur le bloc<\/a>.<\/p>\n<figure id=\"attachment_113474\" aria-describedby=\"caption-attachment-113474\" style=\"width: 1352px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-113474 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/importing-cassic-menus.jpg\" alt=\"S\u00e9lection d'un menu classique.\" width=\"1352\" height=\"1280\"><figcaption id=\"caption-attachment-113474\" class=\"wp-caption-text\">S\u00e9lection d&rsquo;un menu classique.<\/figcaption><\/figure>\n<p>Vous pouvez ajouter le bloc Navigation n&rsquo;importe o\u00f9 sur vos pages. Par exemple, vous pouvez le trouver utile dans les <a href=\"https:\/\/kinsta.com\/fr\/blog\/articles-forme-longue\/\">articles longs<\/a> pour cr\u00e9er <a href=\"https:\/\/kinsta.com\/fr\/blog\/liens-ancrage\/\">une table des mati\u00e8res<\/a>, permettant aux utilisateurs de sauter \u00e0 des sections de contenu sp\u00e9cifiques.<\/p>\n<figure id=\"attachment_112673\" aria-describedby=\"caption-attachment-112673\" style=\"width: 1424px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112673 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/internal-links-navigation.jpg\" alt=\"Ajouter des liens d'ancrage \u00e0 un menu de navigation.\" width=\"1424\" height=\"1024\"><figcaption id=\"caption-attachment-112673\" class=\"wp-caption-text\">Ajouter des liens d&rsquo;ancrage \u00e0 un menu de navigation.<\/figcaption><\/figure>\n<p>Les nouveaux liens de navigation sont instantan\u00e9ment ajout\u00e9s au bloc de navigation en cliquant sur l&rsquo;ic\u00f4ne plus (<strong>+<\/strong>) sur le c\u00f4t\u00e9 droit (voir aussi les <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/14\/whats-new-in-gutenberg-11-7-october-13th\/\">notes de mise \u00e0 jour de Gutenberg 11.7<\/a>), <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/34899\">sauf si d&rsquo;autres types de blocs<\/a> ont d\u00e9j\u00e0 \u00e9t\u00e9 ajout\u00e9s au menu.<\/p>\n<figure id=\"attachment_112662\" aria-describedby=\"caption-attachment-112662\" style=\"width: 1416px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112662 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/navigation-block-appender.jpg\" alt=\"Le bloc Navigation, affichant les liens de navigation.\" width=\"1416\" height=\"1246\"><figcaption id=\"caption-attachment-112662\" class=\"wp-caption-text\">Le bloc Navigation, affichant les liens de navigation.<\/figcaption><\/figure>\n<p>En cliquant sur le bouton <strong>Modifier<\/strong> dans la barre d&rsquo;outils du bloc Liens de navigation, vous convertissez un \u00e9l\u00e9ment de menu en un lien personnalis\u00e9. Cela vous permet d&rsquo;ajouter, de modifier, de r\u00e9organiser et de supprimer des \u00e9l\u00e9ments individuellement.<\/p>\n<figure id=\"attachment_112674\" aria-describedby=\"caption-attachment-112674\" style=\"width: 1426px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112674 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/converting-navigation-menu-items.jpg\" alt=\"Conversion d'un menu de navigation en liens de page individuels.\" width=\"1426\" height=\"770\"><figcaption id=\"caption-attachment-112674\" class=\"wp-caption-text\">Conversion d&rsquo;un menu de navigation en liens de page individuels.<\/figcaption><\/figure>\n<p>Vous pouvez \u00e9galement <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/14\/whats-new-in-gutenberg-11-7-october-13th\/\">transformer les liens en blocs<\/a> en cliquant sur le bouton <strong>Transformer<\/strong> dans la barre d&rsquo;outils des blocs. Cela vous permet d&rsquo;ajouter des <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/34978\">blocs sp\u00e9cifiques directement au menu de navigation<\/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=\"wp-image-112675 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/transform-links-to-blocks-in-navigation-menu.jpg\" alt=\"Transformer des liens de navigation en blocs.\" width=\"1398\" height=\"700\"><figcaption id=\"caption-attachment-112675\" class=\"wp-caption-text\">Transformer des liens de navigation en blocs.<\/figcaption><\/figure>\n<p>Les blocs Lien personnalis\u00e9, Espaceur, Logo du site, Lien d&rsquo;accueil, Ic\u00f4nes sociales et Recherche sont d\u00e9sormais expos\u00e9s aux utilisateurs lors de l&rsquo;ajout de blocs aux menus de navigation.<\/p>\n<p>Dans la colonne lat\u00e9rale R\u00e9glages, vous trouverez un ensemble complet d&rsquo;options permettant de contr\u00f4ler plusieurs aspects de vos menus de navigation.<\/p>\n<p>Le panneau Mise en page comprend des contr\u00f4les pour la <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/35077\">justification<\/a>, l&rsquo;orientation et l&rsquo;habillage.<\/p>\n<figure id=\"attachment_112666\" aria-describedby=\"caption-attachment-112666\" style=\"width: 1688px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112666 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/navigation-block-layout-settings.jpg\" alt=\"R\u00e9glages de mise en page du bloc de navigation\" width=\"1688\" height=\"644\"><figcaption id=\"caption-attachment-112666\" class=\"wp-caption-text\">R\u00e9glages de mise en page du bloc de navigation<\/figcaption><\/figure>\n<p>Le bloc Navigation dispose \u00e9galement d&rsquo;un panneau de <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/28\/whats-new-in-gutenberg-11-8-0-27-october\/\">r\u00e9glages d&rsquo;affichage am\u00e9lior\u00e9<\/a> avec une option pour un menu hamburger toujours actif.<\/p>\n<figure id=\"attachment_112664\" aria-describedby=\"caption-attachment-112664\" style=\"width: 1682px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112664 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/navigation-block-display-settings.jpg\" alt=\"Un panneau de r\u00e9glages d'affichage am\u00e9lior\u00e9 pour le bloc Navigation\" width=\"1682\" height=\"1008\"><figcaption id=\"caption-attachment-112664\" class=\"wp-caption-text\">Un panneau de r\u00e9glages d&rsquo;affichage am\u00e9lior\u00e9 pour le bloc Navigation<\/figcaption><\/figure>\n<p>Vous pouvez \u00e9galement personnaliser les couleurs du texte et de l&rsquo;arri\u00e8re-plan de vos menus et sous-menus.<\/p>\n<figure id=\"attachment_112663\" aria-describedby=\"caption-attachment-112663\" style=\"width: 1686px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112663 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/navigation-block-color-settings.jpg\" alt=\"R\u00e9glages de couleur du bloc Navigation.\" width=\"1686\" height=\"1162\"><figcaption id=\"caption-attachment-112663\" class=\"wp-caption-text\">R\u00e9glages de couleur du bloc Navigation.<\/figcaption><\/figure>\n<p>Un autre ajout utile <a href=\"https:\/\/make.wordpress.org\/core\/2021\/09\/17\/whats-new-in-gutenberg-11-5-16-september\/\">r\u00e9cemment ajout\u00e9<\/a> au bloc de navigation est la <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/33991\">prise en charge de l&rsquo;\u00e9cart de bloc<\/a>, qui permet aux utilisateurs de contr\u00f4ler la distance entre les \u00e9l\u00e9ments de menu.<\/p>\n<figure id=\"attachment_112669\" aria-describedby=\"caption-attachment-112669\" style=\"width: 1684px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112669 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/navigation-block-spacing.jpg\" alt=\"Contr\u00f4le de l'espacement des blocs sur le bloc Navigation.\" width=\"1684\" height=\"1114\"><figcaption id=\"caption-attachment-112669\" class=\"wp-caption-text\">Contr\u00f4le de l&rsquo;espacement des blocs sur le bloc Navigation.<\/figcaption><\/figure>\n<p>Le panneau Typographie fournit un ensemble de contr\u00f4les pour la famille de polices, l&rsquo;apparence, la hauteur de ligne, la d\u00e9coration et la casse des lettres. Tous ces contr\u00f4les peuvent \u00eatre activ\u00e9s\/d\u00e9sactiv\u00e9s \u00e0 partir d&rsquo;un menu d\u00e9roulant qui appara\u00eet lorsque vous cliquez sur l&rsquo;ic\u00f4ne de l&rsquo;ellipse \u00e0 droite.<\/p>\n<figure id=\"attachment_112670\" aria-describedby=\"caption-attachment-112670\" style=\"width: 1688px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112670 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/navigation-block-typography-settings.jpg\" alt=\"R\u00e9glages de typographie du bloc de navigation.\" width=\"1688\" height=\"964\"><figcaption id=\"caption-attachment-112670\" class=\"wp-caption-text\">R\u00e9glages de typographie du bloc de navigation.<\/figcaption><\/figure>\n<h3>Le bloc de navigation : Sous le capot<\/h3>\n<p>Les donn\u00e9es du bloc de navigation sont stock\u00e9es dans la base de donn\u00e9es \u00e0 l&rsquo;aide d&rsquo;un <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/35746\">type de publication d\u00e9di\u00e9<\/a> <code>wp_navigation<\/code>.<\/p>\n<p>Pourquoi cela est-il int\u00e9ressant pour les utilisateurs de WordPress, et comment cela fonctionne-t-il ?<\/p>\n<p>Disons que vous avez cr\u00e9\u00e9 un menu de navigation compos\u00e9 de deux liens personnalis\u00e9s et d&rsquo;un champ de recherche. Avec le <a href=\"https:\/\/kinsta.com\/fr\/blog\/twenty-twenty-two-themes\/\">th\u00e8me Twenty Twenty-Two<\/a> install\u00e9, le menu pourrait ressembler \u00e0 l&rsquo;image suivante :<\/p>\n<figure id=\"attachment_112665\" aria-describedby=\"caption-attachment-112665\" style=\"width: 1610px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112665 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/navigation-block-example.jpg\" alt=\"Exemple de bloc de navigation\" width=\"1610\" height=\"246\"><figcaption id=\"caption-attachment-112665\" class=\"wp-caption-text\">Exemple de bloc de navigation<\/figcaption><\/figure>\n<p>Le bloc de navigation ci-dessus est stock\u00e9 dans la base de donn\u00e9es en tant que type de publication <code>wp_navigation<\/code> comme suit :<\/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>Le stockage du contenu du bloc Navigation dans la base de donn\u00e9es permet aux utilisateurs d&rsquo;utiliser les m\u00eames menus de navigation dans diff\u00e9rents th\u00e8mes de bloc. Si le menu n&rsquo;est pas imm\u00e9diatement visible, il suffit de choisir le menu de navigation souhait\u00e9 dans le s\u00e9lecteur de menu (voir \u00e9galement le probl\u00e8me <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/36087\">#36087<\/a> et PR <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/36178\">#36178<\/a>).<\/p>\n<p>L&rsquo;image suivante montre le menu ci-dessus avec le <a href=\"https:\/\/kinsta.com\/fr\/blog\/theme-twenty-twenty-one\/#the-twenty-twentyone-blocks-experiment\">th\u00e8me de blocs Twenty 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=\"wp-image-112671 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/navigation-menu-selector-tt1b.jpg\" alt=\"S\u00e9lectionnez le menu dans Twenty Twenty-One Blocks.\" width=\"1158\" height=\"708\"><figcaption id=\"caption-attachment-112671\" class=\"wp-caption-text\">S\u00e9lectionnez le menu dans Twenty Twenty-One Blocks.<\/figcaption><\/figure>\n<p>Le bloc Navigation est pass\u00e9 par plusieurs it\u00e9rations. Vous pouvez plonger plus profond\u00e9ment dans chaque impl\u00e9mentation dans les notes de version 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> et <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>Vous pouvez \u00e9galement lire plus d&rsquo;informations sur le bloc de navigation dans la <a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/07\/the-new-navigation-block\/\">nouvelle note de dev du bloc de navigation<\/a> et <a href=\"https:\/\/wordpress.org\/support\/article\/navigation-block\/\">l&rsquo;article de support du bloc de navigation<\/a>.<\/p>\n<h2>Galeries d&rsquo;images, images mises en avant et ic\u00f4nes du site<\/h2>\n<p>Dans le but de rendre le comportement des images plus coh\u00e9rent dans diff\u00e9rents contextes, WordPress 5.9 apporte de nouvelles fonctionnalit\u00e9s et des am\u00e9liorations \u00e0 plusieurs blocs. Le bloc Galerie a \u00e9t\u00e9 compl\u00e8tement r\u00e9vis\u00e9, tandis que diverses modifications apport\u00e9es aux blocs Image mise en avant et Ic\u00f4ne du site donnent aux utilisateurs un contr\u00f4le plus granulaire sur les images respectives.<\/p>\n<h3>Un bloc Galerie remani\u00e9<\/h3>\n<p>Dans WordPress 5.8, la possibilit\u00e9 de personnaliser l&rsquo;apparence des images dans les galeries \u00e9tait quelque peu limit\u00e9e. Il n&rsquo;y avait aucun moyen de modifier le style de l&rsquo;image ou d&rsquo;appliquer un filtre bicolore.<\/p>\n<p>En outre, des fonctionnalit\u00e9s importantes \u00e9taient absentes des images de la galerie, comme l&rsquo;ajout de liens personnalis\u00e9s vers des images individuelles dans une galerie.<\/p>\n<p>Pour mieux comprendre la raison de cette asym\u00e9trie entre les images dans les deux contextes diff\u00e9rents d&rsquo;une image unique et d&rsquo;une image dans une galerie, jetons un coup d&rsquo;\u0153il au bloc Galerie dans la vue Code de 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=\"wp-image-112457 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/gallery-block-code-view-wordpress-5-8.jpg\" alt=\"Bloc Galerie en vue code dans WordPress 5.8.\" width=\"1896\" height=\"494\"><figcaption id=\"caption-attachment-112457\" class=\"wp-caption-text\">Bloc Galerie en vue code dans WordPress 5.8.<\/figcaption><\/figure>\n<p>Notez que les d\u00e9tails de l&rsquo;image sont uniquement stock\u00e9s dans le d\u00e9limiteur du bloc Galerie (voir aussi <a href=\"https:\/\/kinsta.com\/fr\/blog\/blocs-gutenberg\/#what-is-a-gutenberg-block\">Qu&rsquo;est-ce qu&rsquo;un bloc 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=\"wp-image-112461 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/gallery-block-wordpress-5-8.jpg\" alt=\"Inspection du bloc Galerie dans WordPress 5.8.\" width=\"1822\" height=\"778\"><figcaption id=\"caption-attachment-112461\" class=\"wp-caption-text\">Inspection du bloc Galerie dans WordPress 5.8.<\/figcaption><\/figure>\n<p>Cela faisait que les <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/11436\">images individuelles se comportaient diff\u00e9remment des images dans les galeries<\/a>.<\/p>\n<p>Pour que les images se comportent de mani\u00e8re coh\u00e9rente dans ces deux contextes diff\u00e9rents, WordPress 5.9 introduit <a href=\"https:\/\/wordpress.org\/news\/2021\/09\/upcoming-gallery-block-improvements\/\">un bloc Galerie compl\u00e8tement remani\u00e9<\/a>, qui <a href=\"https:\/\/make.wordpress.org\/core\/2021\/08\/20\/gallery-block-refactor-dev-note\/\">se comporte maintenant comme un conteneur pour une collection d&rsquo;\u00e9l\u00e9ments de figures<\/a> au lieu d&rsquo;une liste non ordonn\u00e9e d&rsquo;images.<\/p>\n<p>Dans WordPress 5.9, les images de la galerie sont imbriqu\u00e9es \u00e0 l&rsquo;aide des <a href=\"https:\/\/kinsta.com\/fr\/blog\/blocs-gutenberg\/#innerblocks-component\">API du c\u0153ur <code>innerBlocks<\/code> <\/a>, et chaque image stocke son propre ensemble de d\u00e9tails, exactement comme les images individuelles.<\/p>\n<figure id=\"attachment_112458\" aria-describedby=\"caption-attachment-112458\" style=\"width: 1896px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112458 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/gallery-block-code-view-wordpress-5-9.jpg\" alt=\"Bloc de galerie en vue code dans WordPress 5.9\" width=\"1896\" height=\"628\"><figcaption id=\"caption-attachment-112458\" class=\"wp-caption-text\">Bloc de galerie en vue code dans WordPress 5.9<\/figcaption><\/figure>\n<p>C&rsquo;est une excellente am\u00e9lioration, puisque <strong>les images du bloc Galerie prennent d\u00e9sormais en charge les m\u00eames fonctionnalit\u00e9s que celles disponibles dans les blocs Image de base<\/strong>, telles que les dimensions de l&rsquo;image et les <a href=\"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-8\/#duotone-block-support\">filtres bicolores<\/a>, ainsi que les fonctionnalit\u00e9s standard des blocs, telles que les fonctionnalit\u00e9s de glisser-d\u00e9poser, de copier, de dupliquer et de supprimer.<\/p>\n<figure id=\"attachment_112462\" aria-describedby=\"caption-attachment-112462\" style=\"width: 1604px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112462 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/gallery-block-wordpress-5-9.jpg\" alt=\"Inspecter le bloc Galerie dans WordPress 5.9\" width=\"1604\" height=\"864\"><figcaption id=\"caption-attachment-112462\" class=\"wp-caption-text\">Inspecter le bloc Galerie dans WordPress 5.9<\/figcaption><\/figure>\n<p>Avec le nouveau bloc Galerie, vous serez en mesure de styliser les images individuellement. Cela offre un large \u00e9ventail de possibilit\u00e9s de personnalisation.<\/p>\n<p>L&rsquo;image ci-dessous affiche plusieurs images dans une galerie, chacune avec des coins arrondis diff\u00e9rents :<\/p>\n<figure id=\"attachment_112459\" aria-describedby=\"caption-attachment-112459\" style=\"width: 1642px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112459 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/gallery-block-full-wordpress-5-9.jpg\" alt=\"Le nouveau bloc Galerie enveloppe les blocs d'images individuels.\" width=\"1642\" height=\"1274\"><figcaption id=\"caption-attachment-112459\" class=\"wp-caption-text\">Le nouveau bloc Galerie enveloppe les blocs d&rsquo;images individuels.<\/figcaption><\/figure>\n<p>Vous pouvez \u00e9galement utiliser diff\u00e9rents filtres bicolores sur diff\u00e9rentes images dans la m\u00eame galerie.<\/p>\n<figure id=\"attachment_112460\" aria-describedby=\"caption-attachment-112460\" style=\"width: 1728px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112460 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/gallery-block-image-duotone-filters.jpg\" alt=\"Diff\u00e9rents filtres bicolores appliqu\u00e9s \u00e0 diff\u00e9rentes images dans un bloc Galerie\" width=\"1728\" height=\"1048\"><figcaption id=\"caption-attachment-112460\" class=\"wp-caption-text\">Diff\u00e9rents filtres bicolores appliqu\u00e9s \u00e0 diff\u00e9rentes images dans un bloc Galerie<\/figcaption><\/figure>\n<p>Et, bien s\u00fbr, vous pouvez attribuer une classe CSS sp\u00e9cifique \u00e0 chaque image, ce qui vous donne des super pouvoirs suppl\u00e9mentaires pour ajouter toute personnalisation dont vous avez besoin aux images de votre galerie.<\/p>\n<p>Pour une vue plus d\u00e9taill\u00e9e du nouveau bloc Galerie, consultez \u00e9galement la <a href=\"https:\/\/make.wordpress.org\/core\/2021\/08\/20\/gallery-block-refactor-dev-note\/\">note de d\u00e9veloppement sur le remaniement du bloc Galerie<\/a>, les <a href=\"https:\/\/wordpress.org\/news\/2021\/09\/upcoming-gallery-block-improvements\/\">am\u00e9liorations \u00e0 venir du bloc Galerie<\/a> et les <a href=\"https:\/\/make.wordpress.org\/core\/2021\/09\/01\/whats-new-in-gutenberg-11-4-1-september\/\">notes de publication de Gutenberg 11.4<\/a>.<\/p>\n<h3>Am\u00e9liorations de l&rsquo;image mise en avant<\/h3>\n<p>Plusieurs am\u00e9liorations ont \u00e9galement \u00e9t\u00e9 apport\u00e9es au bloc Image mise en avant.<\/p>\n<h4>Contr\u00f4les basique des dimensions<\/h4>\n<p>Le bloc Image mise en avant dispose d\u00e9sormais d&rsquo;un nouveau panneau de r\u00e9glages Dimensions offrant des <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/31634\">contr\u00f4les de hauteur, de largeur et d&rsquo;\u00e9chelle<\/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=\"wp-image-112828 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/featured-image-dimensions-control-1.jpg\" alt=\"Panneau Dimensions de l'image mise en avant.\" width=\"2032\" height=\"1128\"><figcaption id=\"caption-attachment-112828\" class=\"wp-caption-text\">Panneau Dimensions de l&rsquo;image mise en avant.<\/figcaption><\/figure>\n<p>Le contr\u00f4le des dimensions s&rsquo;applique \u00e9galement aux images mises en avant dans les blocs Requ\u00eate de boucle, comme le montre l&rsquo;image suivante :<\/p>\n<figure id=\"attachment_112829\" aria-describedby=\"caption-attachment-112829\" style=\"width: 2876px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112829 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/featured-image-dimensions-control-2.jpg\" alt=\"Dimensions des images mises en avant dans un bloc Requ\u00eate de boucle.\" width=\"2876\" height=\"1202\"><figcaption id=\"caption-attachment-112829\" class=\"wp-caption-text\">Dimensions des images mises en avant dans un bloc Requ\u00eate de boucle.<\/figcaption><\/figure>\n<h4>Filtres bicolores sur les images mises en avant<\/h4>\n<p>Nous avons mentionn\u00e9 ci-dessus que nous pouvons d\u00e9sormais appliquer le filtre bicolore dans les images envelopp\u00e9es dans le nouveau bloc Galerie remani\u00e9.<\/p>\n<p>Maintenant, \u00e0 partir de WordPress 5.9, les <a href=\"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-8\/#duotone-block-support\">filtres bicolores<\/a> sont \u00e9galement disponibles dans les blocs Image mise en avant dans n&rsquo;importe quel contexte, des mod\u00e8les d&rsquo;articles et de pages aux blocs Requ\u00eate de boucle.<\/p>\n<figure id=\"attachment_112830\" aria-describedby=\"caption-attachment-112830\" style=\"width: 2110px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112830 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/featured-image-duotone-filter.jpg\" alt=\"Filtre bicolore sur les images mises en avant dans un bloc Requ\u00eate de boucle.\" width=\"2110\" height=\"1042\"><figcaption id=\"caption-attachment-112830\" class=\"wp-caption-text\">Filtre bicolore sur les images mises en avant dans un bloc Requ\u00eate de boucle.<\/figcaption><\/figure>\n<p>Cette fonctionnalit\u00e9 ouvre la porte \u00e0 des combinaisons de couleurs cr\u00e9atives et coh\u00e9rentes sur l&rsquo;ensemble du site.<\/p>\n<h3>Recadrage des images dans le logo du site<\/h3>\n<p>Avant WordPress 5.9 (et <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/01\/whats-new-in-gutenberg-11-6-29-september\/\">Gutenberg 11.6<\/a>), les images de logo pouvaient uniquement \u00eatre modifi\u00e9es avant d&rsquo;\u00eatre t\u00e9l\u00e9vers\u00e9es. Avec WordPress 5.9, vous pouvez <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/31607\">recadrer, zoomer et faire pivoter les images<\/a> utilis\u00e9es dans le bloc Logo du site directement depuis la barre d&rsquo;outils du bloc.<\/p>\n<figure id=\"attachment_112831\" aria-describedby=\"caption-attachment-112831\" style=\"width: 1258px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112831 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/editing-logo-image.jpg\" alt=\"Modification de l'image de logo du site.\" width=\"1258\" height=\"1272\"><figcaption id=\"caption-attachment-112831\" class=\"wp-caption-text\">Modification de l&rsquo;image de logo du site.<\/figcaption><\/figure>\n<h2>Nouveaux outils de conception, blocs et am\u00e9liorations de l&rsquo;interface utilisateur<\/h2>\n<p>Onze versions de Gutenberg ont \u00e9t\u00e9 int\u00e9gr\u00e9es au c\u0153ur de WordPress 5.9, offrant tellement de fonctionnalit\u00e9s, d&rsquo;am\u00e9liorations et de corrections de bogues qu&rsquo;il serait impossible de les couvrir toutes dans un seul article.<\/p>\n<p>Nous avons donc choisi certaines de celles qui nous semblaient les plus dignes d&rsquo;attention. Pour un aper\u00e7u plus d\u00e9taill\u00e9 de ces fonctionnalit\u00e9s et am\u00e9liorations, vous pouvez \u00e9galement consulter les articles sur les versions <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> et <a href=\"https:\/\/make.wordpress.org\/core\/2021\/11\/12\/whats-new-in-gutenberg-11-9-0-10-november\/\">11.9<\/a> de Gutenberg.<\/p>\n<p>Ceci \u00e9tant dit, cette section couvrira les changements suivants :<br \/>\n<div><\/div><kinsta-auto-toc list-style=\"decimal\" selector=\"h3\" count-number=\"9\" sub-toc=\"true\"><\/kinsta-auto-toc><\/p>\n<h3>Support des bordures de l&rsquo;interface utilisateur<\/h3>\n<p>\u00c0 partir de WordPress 5.9, lorsque le <strong>theme.json<\/strong> d\u00e9clare les r\u00e9glages <code>border<\/code> et qu&rsquo;un bloc d\u00e9clare le support des bordures via <a href=\"https:\/\/developer.wordpress.org\/block-editor\/reference-guides\/block-api\/block-supports\/\">l&rsquo;API Block Supports<\/a>, un nouveau panneau de r\u00e9glages fournira des contr\u00f4les pour l&rsquo;<a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/31585\">arrondi, la largeur, le style, la couleur<\/a> et les <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/33315\">unit\u00e9s<\/a> des <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/31585\">bordures<\/a> (voir \u00e9galement <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>Le <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/tree\/trunk\/packages\/block-library\/src\/group\">bloc Groupe<\/a> est un bon exemple de cette am\u00e9lioration utile de l&rsquo;interface utilisateur. Le fichier <strong>block.json<\/strong> du bloc Groupe comprend maintenant les d\u00e9clarations <code>supports<\/code>\u00a0suivantes :<\/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>Cette fonctionnalit\u00e9 permet aux utilisateurs de cr\u00e9er des effets graphiques impressionnants sur leurs sites web avec un minimum d&rsquo;efforts. Vous pouvez la voir en action avec le nouveau th\u00e8me Twenty Twenty-Two.<\/p>\n<p>Dans un nouvel article ou une nouvelle page, cr\u00e9ez un nouveau bloc Groupe et s\u00e9lectionnez-le. Vous verrez un panneau <strong>Bordure<\/strong> dans la colonne lat\u00e9rale des r\u00e9glages du bloc. Modifiez la largeur et le style de la bordure selon vos besoins et appr\u00e9ciez le r\u00e9sultat.<\/p>\n<figure id=\"attachment_112693\" aria-describedby=\"caption-attachment-112693\" style=\"width: 1868px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112693 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/border-controls.jpg\" alt=\"Un bloc Groupe avec une configuration de bordure personnalis\u00e9e avec Twenty Twenty-Two.\" width=\"1868\" height=\"1222\"><figcaption id=\"caption-attachment-112693\" class=\"wp-caption-text\">Un bloc Groupe avec une configuration de bordure personnalis\u00e9e avec Twenty Twenty-Two.<\/figcaption><\/figure>\n<p>Si vous \u00eates un d\u00e9veloppeur de th\u00e8mes et que vous souhaitez ajouter cette fonctionnalit\u00e9 \u00e0 vos th\u00e8mes, ouvrez votre fichier <strong>theme.json<\/strong> et d\u00e9clarez la prise en charge des bordures comme indiqu\u00e9 dans le code suivant :<\/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>Enregistrez le fichier et retournez \u00e0 votre tableau de bord WordPress. Dans un nouvel article ou une nouvelle page, cr\u00e9ez un nouveau bloc Groupe et s\u00e9lectionnez-le. Vous devriez maintenant voir un panneau Bordure dans la colonne lat\u00e9rale des r\u00e9glages du bloc (voir aussi ce <a href=\"https:\/\/gist.github.com\/aaronrobertshaw\/8ed108e4a024b81297a55fc498ef3a57\">theme.json exp\u00e9rimental<\/a>).<\/p>\n<h3>Am\u00e9liorations de la vue Liste<\/h3>\n<p>Avec WordPress 5.9, la vue Liste a \u00e9t\u00e9 am\u00e9lior\u00e9e et dispose d\u00e9sormais de la fonction glisser-d\u00e9poser, de sections repliables et d&rsquo;ancres HTML.<\/p>\n<h4>Glisser-d\u00e9poser en vue Liste<\/h4>\n<p>Comme mentionn\u00e9 dans la <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/33320\">pull request #33320<\/a>, le glisser-d\u00e9poser a \u00e9t\u00e9 impl\u00e9ment\u00e9 dans la vue Liste mais a \u00e9t\u00e9 d\u00e9sactiv\u00e9 en raison de probl\u00e8mes de performance.<\/p>\n<p>\u00c0 partir de WordPress 5.9, le glisser-d\u00e9poser en vue Liste a \u00e9t\u00e9 r\u00e9-impl\u00e9ment\u00e9. Vous pouvez \u00e0 nouveau <a href=\"https:\/\/make.wordpress.org\/core\/2021\/07\/21\/whats-new-in-gutenberg-11-1-0-21-july\/\">glisser et d\u00e9poser des blocs<\/a> et des groupes de blocs n&rsquo;importe o\u00f9 dans la vue en liste. Il s&rsquo;agit d&rsquo;une am\u00e9lioration importante de la convivialit\u00e9 de l&rsquo;\u00e9diteur, car elle vous permet de d\u00e9placer rapidement et facilement des blocs et des groupes de blocs dans vos pages. C&rsquo;est tr\u00e8s utile pour les <a href=\"https:\/\/kinsta.com\/fr\/blog\/articles-forme-longue\/\">articles et les pages de grande taille<\/a>, ainsi que pour g\u00e9rer des structures complexes de blocs imbriqu\u00e9s.<\/p>\n<figure id=\"attachment_112560\" aria-describedby=\"caption-attachment-112560\" style=\"width: 1994px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112560 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/drag-and-drop-in-list-view.jpg\" alt=\"Glisser-d\u00e9poser en vue Liste.\" width=\"1994\" height=\"1180\"><figcaption id=\"caption-attachment-112560\" class=\"wp-caption-text\">Glisser-d\u00e9poser en vue Liste.<\/figcaption><\/figure>\n<h4>Sections repliables en vue Liste<\/h4>\n<p>Une autre am\u00e9lioration significative de la vue Liste est la possibilit\u00e9 de <a href=\"https:\/\/make.wordpress.org\/core\/2021\/06\/24\/whats-new-in-gutenberg-10-9-23-june\/\">d\u00e9velopper\/r\u00e9duire les sections de blocs imbriqu\u00e9s<\/a>. Cela vous permet de naviguer facilement dans des structures de blocs complexes, en d\u00e9veloppant des groupes de blocs uniques tout en laissant tout le reste repli\u00e9.<\/p>\n<p>Vous pouvez \u00e9galement d\u00e9plier et replier les sections de la vue Liste <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/32117\">\u00e0 l&rsquo;aide des fl\u00e8ches gauche et droite<\/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=\"wp-image-112561 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/group-block-expanded.jpg\" alt=\"Un groupe de blocs d\u00e9pli\u00e9.\" width=\"1996\" height=\"1102\"><figcaption id=\"caption-attachment-112561\" class=\"wp-caption-text\">Un groupe de blocs d\u00e9pli\u00e9.<\/figcaption><\/figure>\n<h4>Ancres HTML sur les \u00e9l\u00e9ments de la vue en liste<\/h4>\n<p>Une autre am\u00e9lioration utile est la possibilit\u00e9 d&rsquo;ajouter des ancres HTML \u00e0 vos blocs en vue Liste et de les voir d&rsquo;un coup d&rsquo;\u0153il.<\/p>\n<figure id=\"attachment_112562\" aria-describedby=\"caption-attachment-112562\" style=\"width: 1997px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112562 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/html-anchors-list-view.jpg\" alt=\"Ancres HTML en vue Liste.\" width=\"1997\" height=\"1112\"><figcaption id=\"caption-attachment-112562\" class=\"wp-caption-text\">Ancres HTML en vue Liste.<\/figcaption><\/figure>\n<h3>Contr\u00f4le de l&rsquo;espacement entre les blocs<\/h3>\n<p>Introduit pour la premi\u00e8re fois dans <a href=\"https:\/\/make.wordpress.org\/core\/2021\/09\/01\/whats-new-in-gutenberg-11-4-1-september\/\">Gutenberg 11.4<\/a> et maintenant fusionn\u00e9 dans le c\u0153ur avec WordPress 5.9, le nouveau contr\u00f4le d&rsquo;espacement des blocs vous permet de d\u00e9finir une distance personnalis\u00e9e entre les \u00e9l\u00e9ments d&rsquo;un bloc. Ci-dessous, vous pouvez voir un aper\u00e7u avec diff\u00e9rentes valeurs d&rsquo;espacement de bloc dans un bloc Colonnes avec le th\u00e8me par d\u00e9faut 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=\"wp-image-113303 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/block-spacing-90.jpg\" alt=\"Contr\u00f4le de l'espacement des blocs Colonnes dans WordPress 5.9.\" width=\"1966\" height=\"1166\"><figcaption id=\"caption-attachment-113303\" class=\"wp-caption-text\">Contr\u00f4le de l&rsquo;espacement des blocs Colonnes dans WordPress 5.9.<\/figcaption><\/figure>\n<p>L&rsquo;espacement de l&rsquo;\u00e9cart est initialement disponible pour des blocs sp\u00e9cifiques, notamment les boutons, les images, les colonnes, les titres et la navigation, mais le support devrait \u00eatre \u00e9tendu \u00e0 plus de blocs \u00e0 l&rsquo;avenir.<\/p>\n<p>Les th\u00e8mes doivent activer l&rsquo;espacement dans <strong>theme.json<\/strong> \u00e0 l&rsquo;aide de la nouvelle propri\u00e9t\u00e9 <em>appearanceTools<\/em>. Vous pouvez en savoir plus sur les outils d&rsquo;apparence dans notre <a href=\"https:\/\/kinsta.com\/fr\/blog\/twenty-twenty-two-themes\/#layout-and-appearance-tools\">plong\u00e9e profonde dans Twenty Twenty-Two<\/a>. Voir aussi les pull requests <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/33991\">#33991<\/a> et <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/34630\">#34630<\/a>.<\/p>\n<h3>Aper\u00e7u d&rsquo;URL riche pour le contr\u00f4le des liens<\/h3>\n<p>En tirant parti du nouveau <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/31763\">point de terminaison REST url-details<\/a>, le contr\u00f4le de lien offre d\u00e9sormais un <a href=\"https:\/\/make.wordpress.org\/core\/2021\/06\/24\/whats-new-in-gutenberg-10-9-23-june\/\">aper\u00e7u d&rsquo;URL riche<\/a> montrant les d\u00e9tails d&rsquo;une ressource cible de lien.<\/p>\n<figure id=\"attachment_112702\" aria-describedby=\"caption-attachment-112702\" style=\"width: 1390px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112702 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/rich-url-preview.jpg\" alt=\"Aper\u00e7u de l'URL riche dans l'\u00e9diteur.\" width=\"1390\" height=\"1002\"><figcaption id=\"caption-attachment-112702\" class=\"wp-caption-text\">Aper\u00e7u de l&rsquo;URL riche dans l&rsquo;\u00e9diteur.<\/figcaption><\/figure>\n<p>Dans sa <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/31464\">premi\u00e8re impl\u00e9mentation<\/a>, cette fonctionnalit\u00e9 \u00e9tait uniquement disponible dans le <a href=\"https:\/\/kinsta.com\/fr\/blog\/blocs-gutenberg\/#using-richtext-component\">composant richtext<\/a> de l&rsquo;\u00e9diteur de publication. Au moment de la r\u00e9daction de cet article, elle est \u00e9galement disponible dans l&rsquo;\u00e9diteur de site, mais pas dans les \u00e9diteurs de navigation et de widgets.<\/p>\n<h3>Cr\u00e9er des pages \u00e0 partir de la popup de liens<\/h3>\n<p>WordPress 5.9 propose \u00e9galement une <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/14\/whats-new-in-gutenberg-11-7-october-13th\/\">interface utilisateur am\u00e9lior\u00e9e pour les liens en ligne<\/a>, avec un tout nouveau bouton permettant de <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/35083\">cr\u00e9er de nouvelles pages directement \u00e0 partir de la fen\u00eatre contextuelle des liens en ligne<\/a>. Cette fonctionnalit\u00e9 est uniquement disponible dans <a href=\"https:\/\/kinsta.com\/fr\/blog\/editeur-wordpress-gutenberg\/\">l&rsquo;\u00e9diteur de publication<\/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=\"wp-image-113304 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/create-pages-from-link-popup.jpg\" alt=\"WordPress 5.9 pr\u00e9sente une nouvelle interface utilisateur pour les liens en ligne\" width=\"1332\" height=\"1100\"><figcaption id=\"caption-attachment-113304\" class=\"wp-caption-text\">WordPress 5.9 pr\u00e9sente une nouvelle interface utilisateur pour les liens en ligne<\/figcaption><\/figure>\n<h3>Am\u00e9liorations apport\u00e9es au bloc de recherche<\/h3>\n<p>Le bloc de recherche affiche d\u00e9sormais les <a href=\"https:\/\/make.wordpress.org\/core\/2021\/08\/05\/whats-new-in-gutenberg-11-2-0-4-august\/\">r\u00e9glages de couleur du bouton et de la bordure<\/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=\"wp-image-113295 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/search-block-color-settings.jpg\" alt=\"R\u00e9glages de couleur du bloc de recherche.\" width=\"2032\" height=\"1068\"><figcaption id=\"caption-attachment-113295\" class=\"wp-caption-text\">R\u00e9glages de couleur du bloc de recherche.<\/figcaption><\/figure>\n<p>Vous pouvez aussi maintenant personnaliser la <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/32416\">couleur de l&rsquo;arri\u00e8re-plan et du texte<\/a> ainsi que la <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/31783\">couleur et l&rsquo;arrondi de la bordure<\/a>.<\/p>\n<figure id=\"attachment_113294\" aria-describedby=\"caption-attachment-113294\" style=\"width: 2028px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-113294 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/search-block-border-settings.jpg\" alt=\"R\u00e9glages de couleur et d'arrondi de la bordure du bloc de recherche.\" width=\"2028\" height=\"1100\"><figcaption id=\"caption-attachment-113294\" class=\"wp-caption-text\">R\u00e9glages de couleur et d&rsquo;arrondi de la bordure du bloc de recherche.<\/figcaption><\/figure>\n<h3>Nouveaux contr\u00f4les pour les dimensions de bloc<\/h3>\n<p>Un nouveau panneau de r\u00e9glages Dimensions est <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/28356\">d\u00e9sormais disponible pour que les utilisateurs puissent<\/a> <a href=\"https:\/\/make.wordpress.org\/core\/2021\/08\/18\/whats-new-in-gutenberg-11-3-18-august\/\">contr\u00f4ler l&rsquo;espace occup\u00e9 par un bloc<\/a> sur la page. Le panneau <em>devrait<\/em> inclure des contr\u00f4les de hauteur, de largeur, de marge int\u00e9rieure, de marge et \u00e9ventuellement d&rsquo;alignement, mais tous les attributs ne seront pas disponibles pour chaque bloc.<\/p>\n<figure id=\"attachment_113296\" aria-describedby=\"caption-attachment-113296\" style=\"width: 2026px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-113296 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/dimensions-panel-group-block.jpg\" alt=\"Contr\u00f4le de marge int\u00e9rieure pour un bloc Groupe dans WordPress 5.9.\" width=\"2026\" height=\"616\"><figcaption id=\"caption-attachment-113296\" class=\"wp-caption-text\">Contr\u00f4le de marge int\u00e9rieure pour un bloc Groupe dans WordPress 5.9.<\/figcaption><\/figure>\n<p>Les <a href=\"https:\/\/kinsta.com\/fr\/blog\/blocs-gutenberg\/\">d\u00e9veloppeurs de blocs<\/a> trouveront le composant <code>&lt;DimensionControl \/&gt;<\/code> <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/blob\/trunk\/packages\/components\/src\/dimension-control\/README.md\">document\u00e9 sur GitHub<\/a>, mais notez qu&rsquo;il est toujours marqu\u00e9 comme une fonctionnalit\u00e9 exp\u00e9rimentale et pourrait \u00eatre sujet \u00e0 des changements au moment de la r\u00e9daction de cet article.<\/p>\n<h3>Un nouveau bloc de groupe de widgets ajout\u00e9 \u00e0 l&rsquo;\u00e9cran Widgets<\/h3>\n<p>Un nouveau <a href=\"https:\/\/make.wordpress.org\/core\/2021\/09\/22\/core-editor-improvement-introducing-the-widget-group-block\/\">bloc de groupe de widgets<\/a> est <a href=\"https:\/\/make.wordpress.org\/core\/2021\/09\/17\/whats-new-in-gutenberg-11-5-16-september\/\">d\u00e9sormais disponible<\/a> dans l&rsquo;\u00e9diteur de widgets bas\u00e9 sur des blocs. Ce dernier bloc vous permet <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/34484\">d&rsquo;ajouter un groupe de blocs dans un widget avec un titre<\/a> dans l&rsquo;\u00e9diteur de widgets des th\u00e8mes classiques et dans la personnalisation.<\/p>\n<figure id=\"attachment_113297\" aria-describedby=\"caption-attachment-113297\" style=\"width: 1398px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-113297 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/widget-group-block.jpg\" alt=\"Bloc Groupe de widgets dans le th\u00e8me Twenty Twenty-One.\" width=\"1398\" height=\"1122\"><figcaption id=\"caption-attachment-113297\" class=\"wp-caption-text\">Bloc Groupe de widgets dans le th\u00e8me Twenty Twenty-One.<\/figcaption><\/figure>\n<p>Vous pouvez en savoir plus sur l&rsquo;\u00e9diteur de widgets dans <a href=\"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-8\/#blockbased-widgets-editor-and-block-widgets-in-the-customizer\">\u00c9diteur de widgets par blocs et Widgets par blocs dans la personnalisation<\/a>.<\/p>\n<h3>Mise en page flexible et le nouveau bloc de rang\u00e9e<\/h3>\n<p>Introduite \u00e0 l&rsquo;origine comme une <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/33359\">fonctionnalit\u00e9 exp\u00e9rimentale<\/a> avec <a href=\"https:\/\/make.wordpress.org\/core\/2021\/08\/05\/whats-new-in-gutenberg-11-2-0-4-august\/\">Gutenberg 11.2<\/a>, la <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/CSS\/CSS_Flexible_Box_Layout\/Basic_Concepts_of_Flexbox\">mise en page flexible<\/a> a \u00e9t\u00e9 \u00e9tendue \u00e0 plusieurs blocs, notamment les blocs <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/34493\">Liens sociaux<\/a> et Groupe.<\/p>\n<p>Certains blocs, comme le bloc Liens sociaux, fournissent d\u00e9sormais un ensemble de commandes de barre d&rsquo;outils et de r\u00e9glages de colonne lat\u00e9rale qui vous permettent de personnaliser la mise en page 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=\"wp-image-112704 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/social-links-layout-controls.jpg\" alt=\"Contr\u00f4les de mise en page dans la barre d'outils du bloc Liens sociaux.\" width=\"1358\" height=\"524\"><figcaption id=\"caption-attachment-112704\" class=\"wp-caption-text\">Contr\u00f4les de mise en page dans la barre d&rsquo;outils du bloc Liens sociaux.<\/figcaption><\/figure>\n<p>Cette m\u00eame fonctionnalit\u00e9 est disponible dans le <a href=\"#the-navigation-block\">bloc Navigation<\/a> et le <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/34535\">bloc Rang\u00e9e<\/a>, une nouvelle variation du bloc Groupe introduite avec <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>L&rsquo;image suivante montre le bloc Rang\u00e9e avec les contr\u00f4les de mise en page dans la colonne lat\u00e9rale des r\u00e9glages :<\/p>\n<figure id=\"attachment_112706\" aria-describedby=\"caption-attachment-112706\" style=\"width: 2046px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112706 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/row-block-with-layout-settings.jpg\" alt=\"Le nouveau bloc Rang\u00e9e avec les r\u00e9glages de mise en page.\" width=\"2046\" height=\"772\"><figcaption id=\"caption-attachment-112706\" class=\"wp-caption-text\">Le nouveau bloc Rang\u00e9e avec les r\u00e9glages de mise en page.<\/figcaption><\/figure>\n<p>Ci-dessous, vous pouvez voir le m\u00eame bloc Rang\u00e9e sur l&rsquo;interface publique et dans <a href=\"https:\/\/kinsta.com\/fr\/blog\/inspecter-elements\/\">l&rsquo;outil Inspecter<\/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=\"wp-image-112705 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/row-block-flex-props.jpg\" alt=\"Un bloc Rang\u00e9e dans l'outil Inspecter de Chrome.\" width=\"2460\" height=\"880\"><figcaption id=\"caption-attachment-112705\" class=\"wp-caption-text\">Un bloc Rang\u00e9e dans l&rsquo;outil Inspecter de Chrome.<\/figcaption><\/figure>\n<h2>Am\u00e9liorations de composition de bloc<\/h2>\n<p><a href=\"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-5\/#block-patterns\">Introduites pour la premi\u00e8re fois avec WordPress 5.5<\/a>, les compositions de bloc permettent aux utilisateurs de WordPress d&rsquo;inclure des <a href=\"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-5\/#block-patterns\">structures complexes pr\u00eates \u00e0 l&#8217;emploi de blocs imbriqu\u00e9s<\/a> dans leur contenu en quelques clics seulement.<\/p>\n<p>Maintenant, WordPress 5.9 fait avancer les choses vers la d\u00e9mocratisation de la conception et la responsabilisation des utilisateurs en introduisant quelques am\u00e9liorations au syst\u00e8me des compositions de bloc.<\/p>\n<p>Alors, quoi de neuf avec les compositions de bloc dans WordPress 5.9 ?<\/p>\n<h3>Compositions mises en avant vedettes du r\u00e9pertoire de compositions<\/h3>\n<p>L&rsquo;Insertion de blocs <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/28\/whats-new-in-gutenberg-11-8-0-27-october\/\">affiche d\u00e9sormais les compositions de bloc mises en avant<\/a> r\u00e9cup\u00e9r\u00e9es dynamiquement dans le R\u00e9pertoire <a href=\"https:\/\/wordpress.org\/patterns\/\">des compositions<\/a>, offrant aux utilisateurs un moyen rapide et facile de trouver des compositions populaires \u00e0 utiliser dans leur contenu.<\/p>\n<figure id=\"attachment_112574\" aria-describedby=\"caption-attachment-112574\" style=\"width: 2160px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112574 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/buttons-patterns-wp-59-tt2.jpg\" alt=\"Compositions du bloc Boutons dans WordPress 5.9.\" width=\"2160\" height=\"1308\"><figcaption id=\"caption-attachment-112574\" class=\"wp-caption-text\">Compositions du bloc Boutons dans WordPress 5.9.<\/figcaption><\/figure>\n<p>De m\u00eame, \u00e9tant donn\u00e9 que les compositions sont directement int\u00e9gr\u00e9es au tableau de bord de WordPress, les d\u00e9veloppeurs de WordPress devraient \u00eatre encourag\u00e9s \u00e0 cr\u00e9er et \u00e0 publier de plus en plus de compositions au fil du temps, ce qui se traduira par des capacit\u00e9s de conception de plus en plus avanc\u00e9es pour les utilisateurs.<\/p>\n<h3>Un nouvel explorateur de compositions en plein \u00e9cran<\/h3>\n<p>Comme le nombre de compositions de bloc disponibles dans le <a href=\"https:\/\/wordpress.org\/patterns\/\">r\u00e9pertoire des compositions<\/a>\u00a0continue de cro\u00eetre et que de plus en plus de th\u00e8mes les utilisent, WordPress 5.9 introduit une <a href=\"https:\/\/make.wordpress.org\/core\/2021\/11\/12\/whats-new-in-gutenberg-11-9-0-10-november\/\">nouvelle interface de navigation des compositions de bloc<\/a>: l&rsquo;Explorateur de compositions.<\/p>\n<figure id=\"attachment_112575\" aria-describedby=\"caption-attachment-112575\" style=\"width: 2158px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112575 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/fullscreen-pattern-modal.jpg\" alt=\"Modale de compositions en plein \u00e9cran dans WordPress 5.9.\" width=\"2158\" height=\"1300\"><figcaption id=\"caption-attachment-112575\" class=\"wp-caption-text\">Modale de compositions en plein \u00e9cran dans WordPress 5.9.<\/figcaption><\/figure>\n<p>Un nouveau bouton <strong>Explorer<\/strong> ouvre d\u00e9sormais une <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/35773\">modale plein \u00e9cran<\/a> qui permet aux utilisateurs de parcourir, de rechercher et d&rsquo;ins\u00e9rer des compositions de bloc en quelques clics. Le r\u00e9sultat est une exp\u00e9rience utilisateur am\u00e9lior\u00e9e.<\/p>\n<figure id=\"attachment_112576\" aria-describedby=\"caption-attachment-112576\" style=\"width: 1996px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112576 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/featured-block-patterns.jpg\" alt=\"Compositions de blocs mises en avant dans l'insertion de blocs.\" width=\"1996\" height=\"1132\"><figcaption id=\"caption-attachment-112576\" class=\"wp-caption-text\">Compositions de blocs mises en avant dans l&rsquo;insertion de blocs.<\/figcaption><\/figure>\n<p>Vous trouverez \u00e9galement des notes suppl\u00e9mentaires et plusieurs exemples de compositions de blocs dans notre plong\u00e9e profonde dans le <a href=\"https:\/\/kinsta.com\/fr\/blog\/twenty-twenty-two-themes\/#twenty-twentytwo-block-patterns\">th\u00e8me WordPress Twenty Twenty-Two<\/a>.<\/p>\n<p>Si vous \u00eates int\u00e9ress\u00e9 et souhaitez en savoir plus, \u00e9coutez les <a href=\"https:\/\/wordpress.org\/news\/2021\/09\/episode-16-a-sneak-peek-at-wordpress-5-9\/\">\u00e9pisodes 16<\/a> et <a href=\"https:\/\/wordpress.org\/news\/2021\/11\/episode-21-all-things-block-themes\/\">21<\/a> du podcast de Josepha Haden Chomphosy, et regardez la vid\u00e9o YouTube <a href=\"https:\/\/www.youtube.com\/watch?v=r59aR1tmY6k\">Exploring WordPress 5.9<\/a> d&rsquo;Anne McCarthy.<\/p>\n<h2>Le th\u00e8me Twenty Twenty-Two et les th\u00e8mes bas\u00e9s sur les blocs de WordPress<\/h2>\n<p>Avec WordPress 5.9, vous n&rsquo;avez plus besoin d&rsquo;installer l&rsquo;extension Gutenberg pour activer la modification compl\u00e8te du site sur votre site WordPress. Il vous suffit d&rsquo;autoriser un th\u00e8me de bloc pour profiter de toutes les fonctionnalit\u00e9s FSE.<\/p>\n<p>En outre, WordPress 5.9 a \u00e9t\u00e9 livr\u00e9 avec un tout nouveau th\u00e8me par d\u00e9faut, Twenty Twenty-Two, et cela change la donne car Twenty Twenty-Two est le tout premier th\u00e8me bas\u00e9 sur des blocs par d\u00e9faut.<\/p>\n<p>Twenty Twenty-Two est un th\u00e8me hautement flexible et personnalisable. Il constitue un parfait terrain de jeu pour essayer le nouveau flux de modification des mod\u00e8les, les nouveaux blocs, les am\u00e9liorations de l&rsquo;interface et toutes les fonctions d&rsquo;\u00e9dition de site ajout\u00e9es au c\u0153ur \u00e0 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=\"wp-image-110731 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/tt2.jpg\" alt=\"Twenty Twenty-Two est le nouveau th\u00e8me par d\u00e9faut de WordPress.\" width=\"2560\" height=\"1752\"><figcaption id=\"caption-attachment-110731\" class=\"wp-caption-text\">Twenty Twenty-Two est le nouveau th\u00e8me par d\u00e9faut de WordPress. (Image source : <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/06\/introducing-twenty-twenty-two\/\">WordPress.org<\/a>)<\/figcaption><\/figure>\n<p>Comme mentionn\u00e9 ci-dessus, tout ce que vous devez faire est d&rsquo;installer et d&rsquo;activer un <a href=\"https:\/\/wordpress.org\/themes\/tags\/full-site-editing\/\">th\u00e8me \u00e0 base de bloc<\/a>, tel que Twenty Twenty-Two. Une fois le th\u00e8me activ\u00e9, un nouvel \u00e9l\u00e9ment de menu <strong>\u00c9diteur (beta)<\/strong> appara\u00eetra dans le menu d&rsquo;administration du tableau de bord 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=\"wp-image-113422 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/wp-59-appearance-menu.jpg\" alt=\"Le nouveau menu Apparence dans WordPress 5.9.\" width=\"2002\" height=\"830\"><figcaption id=\"caption-attachment-113422\" class=\"wp-caption-text\">Le nouveau menu Apparence dans WordPress 5.9.<\/figcaption><\/figure>\n<p>L&rsquo;interface de l&rsquo;\u00e9diteur de site pr\u00e9sente maintenant un <a href=\"https:\/\/kinsta.com\/fr\/blog\/twenty-twenty-two-themes\/#twenty-twentytwo-brings-a-new-site-editing-flow\">flux d&rsquo;\u00e9dition de site<\/a> remani\u00e9. Depuis l&rsquo;interface d&rsquo;\u00e9dition, vous pourrez modifier visuellement la page d&rsquo;accueil du site, les mod\u00e8les et les parties de mod\u00e8le, ainsi qu&rsquo;acc\u00e9der \u00e0 <a href=\"#global-styles-a-graphic-interface-for-themejson\">l&rsquo;interface des styles globaux<\/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=\"wp-image-110741 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2021\/12\/editor-navigation-menu.jpg\" alt=\"Le menu de navigation de l'\u00e9diteur.\" width=\"2318\" height=\"1046\"><figcaption id=\"caption-attachment-110741\" class=\"wp-caption-text\">Le menu de navigation de l&rsquo;\u00e9diteur.<\/figcaption><\/figure>\n<p>Lorsque vous activez un th\u00e8me bas\u00e9 sur des blocs, <a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/07\/state-of-the-customizer-with-block-themes-in-wordpress-5-9\/\">vous ne trouverez pas la personnalisation<\/a>. C&rsquo;est parce que la personnalisation ne prend pas en charge les th\u00e8mes bas\u00e9s sur des blocs, qui utilisent uniquement l&rsquo;\u00e9diteur de site. C&rsquo;est \u00e9galement la raison pour laquelle <strong>vous ne pouvez pas pr\u00e9visualiser les th\u00e8mes bas\u00e9s sur des blocs inactifs<\/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=\"wp-image-113429 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/live-preview-not-available.jpg\" alt=\"L'aper\u00e7u en direct n'est pas disponible avec les th\u00e8mes bas\u00e9s sur des blocs.\" width=\"1650\" height=\"1268\"><figcaption id=\"caption-attachment-113429\" class=\"wp-caption-text\">L&rsquo;aper\u00e7u en direct n&rsquo;est pas disponible avec les th\u00e8mes bas\u00e9s sur des blocs.<\/figcaption><\/figure>\n<p>Ainsi, \u00e0 partir de WordPress 5.9, le point d&rsquo;acc\u00e8s \u00e0 la personnalisation n&rsquo;est plus disponible dans le menu d&rsquo;administration lorsqu&rsquo;un th\u00e8me \u00e0 ba se de blocs est actif (\u00e0 moins que vous n&rsquo;utilisiez <a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/04\/block-themes-a-new-way-to-build-themes-in-wordpress-5-9\/\">une extension qui en fait usage<\/a>).<\/p>\n<p>Si vous \u00eates toujours attach\u00e9 aux th\u00e8mes traditionnels et que vous vous inqui\u00e9tez de la r\u00e9tro-compatibilit\u00e9, soyez tranquille : vous pouvez continuer \u00e0 utiliser votre th\u00e8me.<\/p>\n<p>Vous avez actuellement le choix entre quatre cat\u00e9gories diff\u00e9rentes de th\u00e8mes :<\/p>\n<ul>\n<li><strong>Th\u00e8mes bas\u00e9s sur des blocs <\/strong>: Th\u00e8mes con\u00e7us pour FSE<\/li>\n<li><strong>Th\u00e8mes universels <\/strong>: Th\u00e8mes qui fonctionnent \u00e0 la fois avec la personnalisation et l&rsquo;\u00e9diteur de site<\/li>\n<li><strong>Th\u00e8mes hybrides <\/strong>: Th\u00e8mes classiques prenant en charge les fonctionnalit\u00e9s du FSE comme theme.json<\/li>\n<li><strong>Th\u00e8mes classiques <\/strong>: Th\u00e8mes avec des mod\u00e8les PHP, functions.php, etc.<\/li>\n<\/ul>\n<p>En raison de l&rsquo;impact que les th\u00e8mes \u00e0 base de bloc auront probablement sur l&rsquo;\u00e9cosyst\u00e8me WordPress, nous avons un article entier couvrant <a href=\"https:\/\/kinsta.com\/fr\/blog\/twenty-twenty-two-themes\/\">Twenty Twenty-Two et les th\u00e8mes WordPress bas\u00e9s sur des blocs<\/a>. N&rsquo;h\u00e9sitez pas \u00e0 le consulter pour un aper\u00e7u plus approfondi.<\/p>\n<h2>Am\u00e9liorations des performances<\/h2>\n<p>Ici, chez Kinsta, nous sommes obs\u00e9d\u00e9s par la <a href=\"https:\/\/kinsta.com\/fr\/apprendre\/accelerer-wordpress\/\">vitesse des sites web<\/a>. C&rsquo;est pourquoi nous sommes ravis des <a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/05\/wordpress-5-9-performance-improvements\/\">am\u00e9liorations de performances<\/a> apport\u00e9es par WordPress 5.9.<\/p>\n<p>Ces am\u00e9liorations affecteront plusieurs domaines du CMS, de l&rsquo;\u00e9diteur de blocs aux th\u00e8mes bas\u00e9s sur des blocs, au chargement diff\u00e9r\u00e9, et plus encore. Plongeons-y.<br \/>\n<div><\/div><kinsta-auto-toc list-style=\"decimal\" selector=\"h3\" count-number=\"4\" sub-toc=\"true\"><\/kinsta-auto-toc><\/p>\n<h3>Am\u00e9liorations de l&rsquo;Insertion de bloc<\/h3>\n<p>Depuis WordPress 5.9, les types de blocs, les th\u00e8mes et les cat\u00e9gories sont rendus en mani\u00e8re diff\u00e9r\u00e9e dans l&rsquo;insertion de bloc. Le navigateur charge d&rsquo;abord le contenu le plus prioritaire, ce qui offre \u00e0 l&rsquo;utilisateur une exp\u00e9rience d&rsquo;\u00e9dition plus fluide et des performances am\u00e9lior\u00e9es.<\/p>\n<p>D&rsquo;autres am\u00e9liorations de performance notables dans le contexte de l&rsquo;\u00e9diteur de blocs affectent les blocs r\u00e9utilisables et la <a href=\"#list-view-improvements\">vue Liste<\/a>.<\/p>\n<h3>Moins de CSS charg\u00e9<\/h3>\n<p>En ce qui concerne l&rsquo;interface publique, WordPress 5.9 a r\u00e9duit de mani\u00e8re drastique la quantit\u00e9 de CSS charg\u00e9e par les th\u00e8mes bas\u00e9s sur des blocs, ce qui permet de charger les pages beaucoup plus rapidement.<\/p>\n<p>La principale am\u00e9lioration \u00e0 noter dans ce contexte est l&rsquo;introduction du m\u00e9canisme de r\u00e9glages et de styles <strong>theme.json<\/strong>, qui emp\u00eache les th\u00e8mes d&rsquo;utiliser des feuilles de style massives, comprenant des centaines de d\u00e9clarations CSS. La quantit\u00e9 de code CSS qu&rsquo;un th\u00e8me utilise a maintenant \u00e9t\u00e9 r\u00e9duite \u00e0 <a href=\"https:\/\/kinsta.com\/fr\/blog\/twenty-twenty-two-themes\/#twenty-twentytwo-at-its-core-a-quick-overview-of-themejson\">quelques propri\u00e9t\u00e9s personnalis\u00e9es CSS<\/a> que tout type de bloc peut r\u00e9utiliser.<\/p>\n<h3>Am\u00e9liorations des performances du chargement diff\u00e9r\u00e9<\/h3>\n<p>Le chargement diff\u00e9r\u00e9 des images a \u00e9t\u00e9 <a href=\"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-5\/#native-image-lazyloading-in-wordpress-core\">introduit pour la premi\u00e8re fois dans WordPress 5.5<\/a>. \u00c0 partir de WordPress 5.7, la fonctionnalit\u00e9 de chargement diff\u00e9r\u00e9 a \u00e9t\u00e9 <a href=\"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-7\/#lazyloading-iframes\">\u00e9tendue aux iframes<\/a>, permettant aux propri\u00e9taires de sites de cr\u00e9er des sites web plus rapides et <a href=\"https:\/\/kinsta.com\/fr\/ebooks\/wordpress\/comment-ameliorer-seo\/\">d&rsquo;am\u00e9liorer leur SEO<\/a>.<\/p>\n<p>Quoi qu&rsquo;il en soit, suite \u00e0 une analyse du <a href=\"https:\/\/kinsta.com\/fr\/blog\/optimiser-site-core-web-vitals\/#largest-contentful-paint-lcp\">Largest Contentful Paint (LCP)<\/a>, il s&rsquo;est av\u00e9r\u00e9 que l&rsquo;attribution de l&rsquo;attribut <code>loading=\"lazy\"<\/code> \u00e0 toutes les images et iframes de la page entra\u00eene une l\u00e9g\u00e8re d\u00e9gradation des performances.<\/p>\n<p>Ignorer simplement l&rsquo;attribut <code>loading=\"lazy\"<\/code> n&rsquo;\u00e9tait pas une solution car cela conduirait \u00e0 perdre les avantages \u00e9vidents du <a href=\"https:\/\/kinsta.com\/fr\/blog\/lazy-load-wordpress\/\">chargement diff\u00e9r\u00e9<\/a>.<\/p>\n<p>La <a href=\"https:\/\/make.wordpress.org\/core\/2021\/07\/15\/refining-wordpress-cores-lazy-loading-implementation\/\">solution optimale<\/a> serait d&rsquo;omettre l&rsquo;attribut <code>loading=\"lazy\"<\/code> uniquement sur les images apparaissant au-dessus du pli. Cependant, \u00e9tant donn\u00e9 que l&rsquo;attribut <code>loading=\"lazy\"<\/code> est attribu\u00e9 du c\u00f4t\u00e9 du serveur, WordPress ne peut pas d\u00e9terminer exactement quelles images sont affich\u00e9es au-dessus du pli. C&rsquo;est quelque chose qui d\u00e9pend principalement du th\u00e8me actif.<\/p>\n<p>Maintenant, comme solution de compromis, <a href=\"https:\/\/make.wordpress.org\/core\/2021\/12\/29\/enhanced-lazy-loading-performance-in-5-9\/\">\u00e0 partir de WordPress 5.9<\/a>, l&rsquo;attribut <code>loading=\"lazy\"<\/code> n&rsquo;est pas appliqu\u00e9 \u00e0 la premi\u00e8re image de contenu ou iframe. Une analyse men\u00e9e sur 50 <a href=\"https:\/\/kinsta.com\/fr\/blog\/theme-wordpress-plus-rapide\/\">th\u00e8mes WordPress<\/a> populaires a r\u00e9v\u00e9l\u00e9 que cette solution entra\u00eene une am\u00e9lioration consid\u00e9rable des performances et un chargement des pages jusqu&rsquo;\u00e0 30 % plus rapide.<\/p>\n<p>Felix Arntz explique <a href=\"https:\/\/make.wordpress.org\/core\/2021\/12\/29\/enhanced-lazy-loading-performance-in-5-9\/\">comment cela fonctionne<\/a>:<\/p>\n<blockquote><p>&#8230; pour am\u00e9liorer les performances d\u00e8s le d\u00e9part, sans qu&rsquo;un d\u00e9veloppeur ait \u00e0 personnaliser le comportement, WordPress \u00e9vitera d\u00e9sormais le chargement diff\u00e9r\u00e9 de la toute premi\u00e8re \u00ab image de contenu ou iframe \u00bb de la page. Le terme \u00ab image ou iframe de contenu \u00bb d\u00e9signe ici toute image ou iframe qui se trouve dans le contenu d&rsquo;un article dans la boucle de requ\u00eate principale actuelle, ainsi que toute image mise en avant d&rsquo;un tel article. Ceci s&rsquo;applique \u00e0 la fois au contenu\u00ab individuel \u00bb et au contenu \u00ab d&rsquo;archive \u00bb : Dans un contexte \u00ab individuel \u00bb, la premi\u00e8re image ou iframe du (seul) article n&rsquo;est pas charg\u00e9e de mani\u00e8re diff\u00e9r\u00e9e, tandis que dans un contexte \u00ab archive \u00bb, la premi\u00e8re image ou iframe du premier article de la requ\u00eate n&rsquo;est pas charg\u00e9e de mani\u00e8re diff\u00e9r\u00e9e.<\/p><\/blockquote>\n<p>Les d\u00e9veloppeurs de th\u00e8mes peuvent d\u00e9sormais utiliser le nouveau filtre <code>wp_omit_loading_attr_threshold<\/code> pour modifier le nombre d&rsquo;images\/iframes \u00e0 ignorer du chargement diff\u00e9r\u00e9.<\/p>\n<h3>Plusieurs feuilles de style par bloc<\/h3>\n<p>Les d\u00e9veloppeurs de blocs et de th\u00e8mes peuvent <a href=\"https:\/\/make.wordpress.org\/core\/2021\/12\/15\/using-multiple-stylesheets-per-block\/\">enregistrer plusieurs feuilles de style<\/a> sur chaque bloc et charger des styles \u00e0 partir d&rsquo;autres blocs lorsque cela est n\u00e9cessaire. Cela permet de charger les feuilles de style en fonction du contenu de la page, ce qui \u00e9vite aux th\u00e8mes de charger d&rsquo;\u00e9normes feuilles de style sur chaque page.<\/p>\n<p>Selon <a href=\"https:\/\/make.wordpress.org\/core\/2021\/12\/15\/using-multiple-stylesheets-per-block\/\">Ari Stathopoulos<\/a>:<\/p>\n<blockquote><p>Les blocs pourront d\u00e9sormais enregistrer plusieurs feuilles de style et charger les styles d&rsquo;autres blocs si n\u00e9cessaire. Les th\u00e8mes pourront ajouter des styles sur une base par bloc au lieu de charger des feuilles de style monolithiques qui sont charg\u00e9es de force partout. Ceci a un impact plus important sur les th\u00e8mes de blocs o\u00f9 le chargement des feuilles de style est optimis\u00e9 en fonction du contenu de la page et de la mise en page, mais peut \u00e9galement \u00eatre utilis\u00e9 par les th\u00e8mes classiques.<\/p><\/blockquote>\n<h2>Fonctionnalit\u00e9s suppl\u00e9mentaires pour les d\u00e9veloppeurs<\/h2>\n<p>En plus des nombreuses fonctionnalit\u00e9s et am\u00e9liorations de l&rsquo;interface utilisateur discut\u00e9es jusqu&rsquo;\u00e0 pr\u00e9sent, WordPress 5.9 introduit \u00e9galement plusieurs fonctionnalit\u00e9s pour les d\u00e9veloppeurs.<\/p>\n<aside role=\"note\" class=\"wp-block-kinsta-notice is-style-info\">\n            <h3>Info<\/h3>\n        <p>Si vous \u00eates nouveau dans le d\u00e9veloppement de blocs WordPress, assurez-vous de consulter notre <a href=\"https:\/\/kinsta.com\/fr\/blog\/blocs-gutenberg\/\">Tutoriel de d\u00e9veloppement de blocs<\/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 nouvel attribut pour verrouiller les blocs<\/h3>\n<p>Les d\u00e9veloppeurs de blocs peuvent d\u00e9sormais emp\u00eacher les utilisateurs de <a href=\"https:\/\/make.wordpress.org\/core\/2021\/10\/01\/whats-new-in-gutenberg-11-6-29-september\/\">d\u00e9placer ou de supprimer des blocs individuels<\/a> en <a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/08\/locking-blocks-in-wordpress-5-9\/\">ajoutant un attribut <code>lock<\/code><\/a> dans les r\u00e9glages des blocs :<\/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>Avec <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/32457\">cette fonctionnalit\u00e9 activ\u00e9e<\/a>, les utilisateurs peuvent modifier le contenu du bloc, mais ne peuvent pas d\u00e9placer le bloc sur la page ou le supprimer du canevas de l&rsquo;\u00e9diteur. L&rsquo;image suivante montre un <a href=\"https:\/\/kinsta.com\/fr\/blog\/blocs-gutenberg\/\">bloc personnalis\u00e9<\/a> avec un ensemble standard de commandes de barre d&rsquo;outils :<\/p>\n<figure id=\"attachment_112708\" aria-describedby=\"caption-attachment-112708\" style=\"width: 1288px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112708 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/custom-block-with-regular-toolbar.jpg\" alt=\"Un bloc personnalis\u00e9 avec une barre d'outils ordinaire\" width=\"1288\" height=\"946\"><figcaption id=\"caption-attachment-112708\" class=\"wp-caption-text\">Un bloc personnalis\u00e9 avec une barre d&rsquo;outils ordinaire<\/figcaption><\/figure>\n<p>La d\u00e9finition de l&rsquo;attribut <code>lock<\/code>, comme on le voit dans le code ci-dessus, permet de masquer les d\u00e9placeurs de bloc et les commandes <strong>D\u00e9placer vers<\/strong> et <strong>Supprimer<\/strong> de la barre d&rsquo;outils du bloc. L&rsquo;image ci-dessous montre le r\u00e9sultat final \u00e0 l&rsquo;\u00e9cran :<\/p>\n<figure id=\"attachment_112709\" aria-describedby=\"caption-attachment-112709\" style=\"width: 1284px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-112709 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/custom-block-without-move-and-remove-controls.jpg\" alt=\"Un bloc personnalis\u00e9 sans les contr\u00f4les de d\u00e9placement et de suppression\" width=\"1284\" height=\"762\"><figcaption id=\"caption-attachment-112709\" class=\"wp-caption-text\">Un bloc personnalis\u00e9 sans les contr\u00f4les de d\u00e9placement et de suppression<\/figcaption><\/figure>\n<p>Vous pouvez \u00e9galement verrouiller un bloc sp\u00e9cifique dans un mod\u00e8le de bloc. Pour un exemple, voir aussi <a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/08\/locking-blocks-in-wordpress-5-9\/\">Verrouillage des blocs dans WordPress 5.9<\/a>.<\/p>\n<h3>Nouvelle API pour acc\u00e9der aux r\u00e9glages et styles globaux<\/h3>\n<p>WordPress 5.9 introduit une nouvelle <a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/04\/new-api-to-access-global-settings-styles\/\">API publique PHP<\/a> pour lire les donn\u00e9es de <strong>theme.json<\/strong>.<\/p>\n<h4>Lecture des r\u00e9glages et des styles \u00e0 partir de theme.json<\/h4>\n<p>Il existe deux nouvelles fonctions pour lire les donn\u00e9es des sections <code>settings<\/code> et <code>styles<\/code> d\u00e9clar\u00e9es dans le <strong>theme.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> est un tableau listant le chemin d&rsquo;acc\u00e8s au r\u00e9glag sp\u00e9cifi\u00e9<\/li>\n<li><code>$context<\/code> est un tableau d\u00e9finissant le contexte de ces donn\u00e9es. Les d\u00e9veloppeurs peuvent lire \u00e0 partir d&rsquo;une section sp\u00e9cifique de r\u00e9glages de bloc &#8211; par exemple, <code>array( 'block_name' =&gt; 'core\/paragraph' )<\/code>. La cl\u00e9 <code>orygin<\/code> d\u00e9finie sur <code>base<\/code> permet d&rsquo;ignorer les donn\u00e9es personnalis\u00e9es enregistr\u00e9es par l&rsquo;utilisateur.<\/li>\n<\/ul>\n<p>L&rsquo;exemple de code suivant renverrait la valeur du r\u00e9glage <code>contentSize<\/code>. Dans Twenty Twenty-Two, ce serait <code>650px<\/code>:<\/p>\n<pre><code class=\"language-php\">wp_get_global_settings( array( 'layout', 'contentSize' ) );<\/code><\/pre>\n<p>En d\u00e9finissant un contexte, vous pouvez r\u00e9cup\u00e9rer les styles pour des blocs sp\u00e9cifiques. Le code suivant montre comment r\u00e9cup\u00e9rer la valeur d&rsquo;arrondi de la bordure pour le bloc <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 fonction ci-dessus renvoie la valeur de la propri\u00e9t\u00e9 n\u00e9cessaire tout en tenant compte des r\u00e9glages par d\u00e9faut, des r\u00e9glages du th\u00e8me et des donn\u00e9es utilisateur. La valeur personnalis\u00e9e sera fournie si l&rsquo;utilisateur configure le&rsquo;arrondi de la bordure du bouton dans l&rsquo;interface Styles globaux.<\/p>\n<p>Pour ignorer les donn\u00e9es de l&rsquo;utilisateur, vous devez utiliser le code suivant :<\/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>Obtenir la feuille de style g\u00e9n\u00e9r\u00e9e<\/h4>\n<p>WordPress 5.9 introduit \u00e9galement une nouvelle fonction pour obtenir la feuille de style r\u00e9sultant des styles par d\u00e9faut, du th\u00e8me et des styles personnalis\u00e9s :<\/p>\n<pre><code class=\"language-php\">wp_get_global_stylesheet( $types = array() );<\/code><\/pre>\n<p><code>$types<\/code> est une liste des styles \u00e0 g\u00e9n\u00e9rer.<\/p>\n<p>Vous pouvez en savoir plus sur la nouvelle API dans <a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/04\/new-api-to-access-global-settings-styles\/\">Nouvelle API pour acc\u00e9der aux r\u00e9glages et aux styles globaux<\/a>.<\/p>\n<h3>Autres fonctionnalit\u00e9s pour les d\u00e9veloppeurs<\/h3>\n<p>Les autres modifications apport\u00e9es \u00e0 WordPress 5.9 pour les d\u00e9veloppeurs que vous voudrez peut-\u00eatre conna\u00eetre comprennent :<\/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\/\">Les th\u00e8mes bas\u00e9s sur les blocs, une nouvelle fa\u00e7on de cr\u00e9er des th\u00e8mes dans WordPress 5.9<\/a><\/li>\n<li><a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/08\/updates-for-settings-styles-and-theme-json\/\">Mises \u00e0 jour pour R\u00e9glages, Styles et 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\/\">Modifications et filtres ax\u00e9s sur les th\u00e8mes dans WordPress 5.9<\/a><\/li>\n<li><a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/05\/new-capability-queries-in-wordpress-5-9\/\">Nouvelles requ\u00eates de capacit\u00e9 dans WordPress 5.9<\/a><\/li>\n<li><a href=\"https:\/\/make.wordpress.org\/core\/2022\/01\/04\/miscellaneous-core-changes-in-wordpress-5-9\/\">Diverses modifications du c\u0153ur dans 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\/\">Diverses modifications de l&rsquo;\u00e9diteur de blocs dans 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\/\">Prenez plus de contr\u00f4le sur les zones de blocs internes (en tant que d\u00e9veloppeur de blocs)<\/a><\/li>\n<\/ul>\n\n<h2>R\u00e9sum\u00e9<\/h2>\n<p>Nous conclurons cet article par une note rapide sur la <a href=\"https:\/\/kinsta.com\/fr\/part-de-marche-de-wordpress\/\">part de march\u00e9 de WordPress<\/a>. WordPress propulse actuellement plus de 65 % de tous les sites web dont le syst\u00e8me de gestion de contenu est connu et se trouve \u00e0 <strong>43 % de tous les sites web<\/strong>.<\/p>\n<p>Ces chiffres sont impressionnants, surtout lorsqu&rsquo;on les compare aux concurrents les plus proches qui d\u00e9tiennent moins de 5 % de parts de march\u00e9, comme Shopify.<\/p>\n<p>Et cela signifie \u00e9galement que vous ne pouvez pas n\u00e9gliger l&rsquo;\u00e9volution <a href=\"https:\/\/kinsta.com\/fr\/blog\/systeme-gestion-contenu\/\">du CMS WP<\/a>. Chaque <a href=\"https:\/\/kinsta.com\/fr\/blog\/version-wordpress\/\">nouvelle version de WordPress<\/a> apporte de nouvelles fonctionnalit\u00e9s, des am\u00e9liorations de l&rsquo;interface, des am\u00e9liorations des performances, et WordPress 5.9 ne fait pas exception. Tout ce dont vous avez besoin pour tester les nouvelles fonctionnalit\u00e9s est un th\u00e8me bas\u00e9 sur des blocs, comme le nouveau th\u00e8me par d\u00e9faut Twenty Twenty-Two, et vous serez pr\u00eat \u00e0 d\u00e9marrer.<\/p>\n<p><em>\u00c0 vous de jouer ! \u00cates-vous pr\u00eat \u00e0 passer aux th\u00e8mes \u00e0 base de blocs et \u00e0 FSE ? Et quels sont vos changements pr\u00e9f\u00e9r\u00e9s \u00e0 venir avec WordPress 5.9 ?<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>WordPress 5.9 Jos\u00e9phine est arriv\u00e9 ! La premi\u00e8re version de WordPress de l&rsquo;ann\u00e9e \u00e9tait initialement pr\u00e9vue pour une sortie le 14 d\u00e9cembre 2021. En raison de &#8230;<\/p>\n","protected":false},"author":36,"featured_media":52246,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_kinsta_gated_content":false,"_kinsta_gated_content_redirect":"","footnotes":""},"tags":[85,591,592,47,33],"topic":[1040],"class_list":["post-52245","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","tag-cms","tag-editing","tag-updates","tag-webdev","tag-wordpress","topic-mises-a-jour-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>Nouveaut\u00e9s de WordPress 5.9 - Modification compl\u00e8te du site, styles globaux, blocs, mod\u00e8les, API, am\u00e9liorations de l&#039;interface utilisateur et bien plus encore<\/title>\n<meta name=\"description\" content=\"Consultez notre revue approfondie de WordPress 5.9 et d\u00e9couvrez toutes les fonctionnalit\u00e9s majeures introduites dans la premi\u00e8re version 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\/fr\/blog\/wordpress-5-9\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Nouveaut\u00e9s de WordPress 5.9 - Modification compl\u00e8te du site, styles globaux, blocs, mod\u00e8les, API, am\u00e9liorations de l&#039;interface utilisateur et bien plus encore\" \/>\n<meta property=\"og:description\" content=\"Consultez notre revue approfondie de WordPress 5.9 et d\u00e9couvrez toutes les fonctionnalit\u00e9s majeures introduites dans la premi\u00e8re version de WordPress de 2022 !\" \/>\n<meta property=\"og:url\" content=\"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/\" \/>\n<meta property=\"og:site_name\" content=\"Kinsta\u00ae\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/kinstafrance\/\" \/>\n<meta property=\"article:published_time\" content=\"2022-01-18T12:47:33+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-10-08T12:24:23+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/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=\"Consultez notre revue approfondie de WordPress 5.9 et d\u00e9couvrez toutes les fonctionnalit\u00e9s majeures introduites dans la premi\u00e8re version de WordPress de 2022 !\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2022\/01\/whats-new-in-wordpress-5-9.jpg\" \/>\n<meta name=\"twitter:creator\" content=\"@carlodaniele\" \/>\n<meta name=\"twitter:site\" content=\"@kinsta_fr\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"Carlo Daniele\" \/>\n\t<meta name=\"twitter:label2\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data2\" content=\"43 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/\"},\"author\":{\"name\":\"Carlo Daniele\",\"@id\":\"https:\/\/kinsta.com\/fr\/#\/schema\/person\/962dde02ea6f5df089b5d8d0853bbc63\"},\"headline\":\"Nouveaut\u00e9s de WordPress 5.9 &#8211; Modification compl\u00e8te du site, styles globaux, blocs, mod\u00e8les, API, am\u00e9liorations de l&rsquo;interface utilisateur et bien plus encore\",\"datePublished\":\"2022-01-18T12:47:33+00:00\",\"dateModified\":\"2024-10-08T12:24:23+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/\"},\"wordCount\":7717,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/fr\/#organization\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2022\/01\/whats-new-in-wordpress-5-9.jpg\",\"keywords\":[\"CMS\",\"editing\",\"updates\",\"webdev\",\"WordPress\"],\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/\",\"url\":\"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/\",\"name\":\"Nouveaut\u00e9s de WordPress 5.9 - Modification compl\u00e8te du site, styles globaux, blocs, mod\u00e8les, API, am\u00e9liorations de l'interface utilisateur et bien plus encore\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/fr\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2022\/01\/whats-new-in-wordpress-5-9.jpg\",\"datePublished\":\"2022-01-18T12:47:33+00:00\",\"dateModified\":\"2024-10-08T12:24:23+00:00\",\"description\":\"Consultez notre revue approfondie de WordPress 5.9 et d\u00e9couvrez toutes les fonctionnalit\u00e9s majeures introduites dans la premi\u00e8re version de WordPress de 2022 !\",\"breadcrumb\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/#primaryimage\",\"url\":\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2022\/01\/whats-new-in-wordpress-5-9.jpg\",\"contentUrl\":\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2022\/01\/whats-new-in-wordpress-5-9.jpg\",\"width\":1460,\"height\":730,\"caption\":\"Nouveaut\u00e9s de WordPress 5.9 - Modification compl\u00e8te du site, styles globaux, blocs, mod\u00e8les, API, am\u00e9liorations de l'interface utilisateur et bien plus encore\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/kinsta.com\/fr\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Mises \u00e0 jour WordPress\",\"item\":\"https:\/\/kinsta.com\/fr\/sujets\/mises-a-jour-wordpress\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Nouveaut\u00e9s de WordPress 5.9 &#8211; Modification compl\u00e8te du site, styles globaux, blocs, mod\u00e8les, API, am\u00e9liorations de l&#8217;interface utilisateur et bien plus encore\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/kinsta.com\/fr\/#website\",\"url\":\"https:\/\/kinsta.com\/fr\/\",\"name\":\"Kinsta\u00ae\",\"description\":\"Solutions d&#039;h\u00e9bergement premium, rapides et s\u00e9curis\u00e9es\",\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/fr\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/kinsta.com\/fr\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/kinsta.com\/fr\/#organization\",\"name\":\"Kinsta\",\"url\":\"https:\/\/kinsta.com\/fr\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/kinsta.com\/fr\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/12\/kinsta-logo.jpeg\",\"contentUrl\":\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/12\/kinsta-logo.jpeg\",\"width\":500,\"height\":500,\"caption\":\"Kinsta\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/fr\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/kinstafrance\/\",\"https:\/\/x.com\/kinsta_fr\",\"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\/fr\/#\/schema\/person\/962dde02ea6f5df089b5d8d0853bbc63\",\"name\":\"Carlo Daniele\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/kinsta.com\/fr\/#\/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\/fr\/blog\/author\/carlodaniele\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Nouveaut\u00e9s de WordPress 5.9 - Modification compl\u00e8te du site, styles globaux, blocs, mod\u00e8les, API, am\u00e9liorations de l'interface utilisateur et bien plus encore","description":"Consultez notre revue approfondie de WordPress 5.9 et d\u00e9couvrez toutes les fonctionnalit\u00e9s majeures introduites dans la premi\u00e8re version 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\/fr\/blog\/wordpress-5-9\/","og_locale":"fr_FR","og_type":"article","og_title":"Nouveaut\u00e9s de WordPress 5.9 - Modification compl\u00e8te du site, styles globaux, blocs, mod\u00e8les, API, am\u00e9liorations de l'interface utilisateur et bien plus encore","og_description":"Consultez notre revue approfondie de WordPress 5.9 et d\u00e9couvrez toutes les fonctionnalit\u00e9s majeures introduites dans la premi\u00e8re version de WordPress de 2022 !","og_url":"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/","og_site_name":"Kinsta\u00ae","article_publisher":"https:\/\/www.facebook.com\/kinstafrance\/","article_published_time":"2022-01-18T12:47:33+00:00","article_modified_time":"2024-10-08T12:24:23+00:00","og_image":[{"width":1460,"height":730,"url":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2022\/01\/whats-new-in-wordpress-5-9.jpg","type":"image\/jpeg"}],"author":"Carlo Daniele","twitter_card":"summary_large_image","twitter_description":"Consultez notre revue approfondie de WordPress 5.9 et d\u00e9couvrez toutes les fonctionnalit\u00e9s majeures introduites dans la premi\u00e8re version de WordPress de 2022 !","twitter_image":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2022\/01\/whats-new-in-wordpress-5-9.jpg","twitter_creator":"@carlodaniele","twitter_site":"@kinsta_fr","twitter_misc":{"\u00c9crit par":"Carlo Daniele","Dur\u00e9e de lecture estim\u00e9e":"43 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/#article","isPartOf":{"@id":"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/"},"author":{"name":"Carlo Daniele","@id":"https:\/\/kinsta.com\/fr\/#\/schema\/person\/962dde02ea6f5df089b5d8d0853bbc63"},"headline":"Nouveaut\u00e9s de WordPress 5.9 &#8211; Modification compl\u00e8te du site, styles globaux, blocs, mod\u00e8les, API, am\u00e9liorations de l&rsquo;interface utilisateur et bien plus encore","datePublished":"2022-01-18T12:47:33+00:00","dateModified":"2024-10-08T12:24:23+00:00","mainEntityOfPage":{"@id":"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/"},"wordCount":7717,"commentCount":0,"publisher":{"@id":"https:\/\/kinsta.com\/fr\/#organization"},"image":{"@id":"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2022\/01\/whats-new-in-wordpress-5-9.jpg","keywords":["CMS","editing","updates","webdev","WordPress"],"inLanguage":"fr-FR","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/","url":"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/","name":"Nouveaut\u00e9s de WordPress 5.9 - Modification compl\u00e8te du site, styles globaux, blocs, mod\u00e8les, API, am\u00e9liorations de l'interface utilisateur et bien plus encore","isPartOf":{"@id":"https:\/\/kinsta.com\/fr\/#website"},"primaryImageOfPage":{"@id":"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/#primaryimage"},"image":{"@id":"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2022\/01\/whats-new-in-wordpress-5-9.jpg","datePublished":"2022-01-18T12:47:33+00:00","dateModified":"2024-10-08T12:24:23+00:00","description":"Consultez notre revue approfondie de WordPress 5.9 et d\u00e9couvrez toutes les fonctionnalit\u00e9s majeures introduites dans la premi\u00e8re version de WordPress de 2022 !","breadcrumb":{"@id":"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/#primaryimage","url":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2022\/01\/whats-new-in-wordpress-5-9.jpg","contentUrl":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2022\/01\/whats-new-in-wordpress-5-9.jpg","width":1460,"height":730,"caption":"Nouveaut\u00e9s de WordPress 5.9 - Modification compl\u00e8te du site, styles globaux, blocs, mod\u00e8les, API, am\u00e9liorations de l'interface utilisateur et bien plus encore"},{"@type":"BreadcrumbList","@id":"https:\/\/kinsta.com\/fr\/blog\/wordpress-5-9\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kinsta.com\/fr\/"},{"@type":"ListItem","position":2,"name":"Mises \u00e0 jour WordPress","item":"https:\/\/kinsta.com\/fr\/sujets\/mises-a-jour-wordpress\/"},{"@type":"ListItem","position":3,"name":"Nouveaut\u00e9s de WordPress 5.9 &#8211; Modification compl\u00e8te du site, styles globaux, blocs, mod\u00e8les, API, am\u00e9liorations de l&#8217;interface utilisateur et bien plus encore"}]},{"@type":"WebSite","@id":"https:\/\/kinsta.com\/fr\/#website","url":"https:\/\/kinsta.com\/fr\/","name":"Kinsta\u00ae","description":"Solutions d&#039;h\u00e9bergement premium, rapides et s\u00e9curis\u00e9es","publisher":{"@id":"https:\/\/kinsta.com\/fr\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/kinsta.com\/fr\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"},{"@type":"Organization","@id":"https:\/\/kinsta.com\/fr\/#organization","name":"Kinsta","url":"https:\/\/kinsta.com\/fr\/","logo":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/kinsta.com\/fr\/#\/schema\/logo\/image\/","url":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/12\/kinsta-logo.jpeg","contentUrl":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/12\/kinsta-logo.jpeg","width":500,"height":500,"caption":"Kinsta"},"image":{"@id":"https:\/\/kinsta.com\/fr\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/kinstafrance\/","https:\/\/x.com\/kinsta_fr","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\/fr\/#\/schema\/person\/962dde02ea6f5df089b5d8d0853bbc63","name":"Carlo Daniele","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/kinsta.com\/fr\/#\/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\/fr\/blog\/author\/carlodaniele\/"}]}},"acf":[],"_links":{"self":[{"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/posts\/52245","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/users\/36"}],"replies":[{"embeddable":true,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/comments?post=52245"}],"version-history":[{"count":12,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/posts\/52245\/revisions"}],"predecessor-version":[{"id":53801,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/posts\/52245\/revisions\/53801"}],"alternate":[{"embeddable":true,"hreflang":"en","title":"English","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/52245\/translations\/en"},{"embeddable":true,"hreflang":"de","title":"German","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/52245\/translations\/de"},{"embeddable":true,"hreflang":"it","title":"Italian","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/52245\/translations\/it"},{"embeddable":true,"hreflang":"fr","title":"French","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/52245\/translations\/fr"},{"embeddable":true,"hreflang":"pt","title":"Portuguese","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/52245\/translations\/pt"},{"embeddable":true,"hreflang":"es","title":"Spanish","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/52245\/translations\/es"},{"embeddable":true,"hreflang":"nl","title":"Dutch","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/52245\/translations\/nl"},{"embeddable":true,"hreflang":"sv","title":"Swedish","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/52245\/translations\/se"},{"embeddable":true,"hreflang":"da","title":"Danish","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/52245\/translations\/dk"},{"embeddable":true,"hreflang":"ja","title":"Japanese","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/52245\/translations\/jp"},{"href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/52245\/tree"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/media\/52246"}],"wp:attachment":[{"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/media?parent=52245"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/tags?post=52245"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/topic?post=52245"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}