{"id":76570,"date":"2024-03-18T10:52:45","date_gmt":"2024-03-18T09:52:45","guid":{"rendered":"https:\/\/kinsta.com\/fr\/?p=76570&#038;preview=true&#038;preview_id=76570"},"modified":"2024-04-04T10:19:14","modified_gmt":"2024-04-04T09:19:14","slug":"wordpress-6-5","status":"publish","type":"post","link":"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/","title":{"rendered":"Nouveaut\u00e9s de WordPress 6.5 : Biblioth\u00e8que de polices, DataViews, Block Bindings, API d&rsquo;interactivit\u00e9, et bien plus encore !"},"content":{"rendered":"<p>WordPress 6.5 \u00ab Regina \u00bb a \u00e9t\u00e9 <a href=\"https:\/\/wordpress.org\/news\/2024\/04\/regina\/\">publi\u00e9 le 2 avril<\/a>, et nous sommes ici pour vous montrer les fonctionnalit\u00e9s fantastiques qui l&rsquo;accompagnent.<\/p>\n<p>La version 6.5 introduit de nouvelles API puissantes, amenant l&rsquo;exp\u00e9rience de d\u00e9veloppement de WordPress \u00e0 un niveau sup\u00e9rieur. Mais cela apporte aussi des tonnes de changements qui vous rendront heureux quand il s&rsquo;agit de la construction de sites et de la cr\u00e9ation de contenu.<\/p>\n<p>Gr\u00e2ce \u00e0 la nouvelle biblioth\u00e8que de polices, vous pourrez injecter des valeurs de champs personnalis\u00e9s dans le contenu des blocs principaux et t\u00e9l\u00e9charger et installer des polices Google directement depuis l&rsquo;\u00e9diteur de site. De nouveaux outils de conception et plusieurs am\u00e9liorations de l&rsquo;interface utilisateur permettront d&rsquo;am\u00e9liorer l&rsquo;exp\u00e9rience globale d&rsquo;\u00e9dition.<\/p>\n<p>Mais il ne s&rsquo;agit l\u00e0 que de quelques mises \u00e0 jour de WordPress 6.5. La nouvelle version rassemble tellement d&rsquo;am\u00e9liorations et de mises \u00e0 jour qu&rsquo;il serait impossible de les mentionner toutes dans un seul article de blog. Nous avons donc rassembl\u00e9 les plus perturbatrices et les plus excitantes dans ce long article d\u00e9taill\u00e9.<\/p>\n<p>Commen\u00e7ons notre voyage \u00e0 la d\u00e9couverte de WordPress 6.5.<\/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>La nouvelle biblioth\u00e8que de polices de WordPress<\/h2>\n<p>Avant toute chose, WordPress 6.5 introduit une nouvelle fonctionnalit\u00e9 qui permet de g\u00e9rer les polices de caract\u00e8res depuis l&rsquo;interface Styles.<\/p>\n<p>La nouvelle <a href=\"https:\/\/core.trac.wordpress.org\/ticket\/59166\" target=\"_blank\" rel=\"noopener noreferrer\">biblioth\u00e8que de polices<\/a> de WordPress vous permet de g\u00e9rer les polices d&rsquo;une mani\u00e8re qui ressemble \u00e0 la gestion des m\u00e9dias dans la m\u00e9diath\u00e8que, mais pour les polices.<\/p>\n<p>Gr\u00e2ce \u00e0 la biblioth\u00e8que de polices, vous pouvez facilement installer\/d\u00e9sinstaller les <a href=\"https:\/\/kinsta.com\/fr\/blog\/polices-local\/\">polices locales<\/a> et les <a href=\"https:\/\/kinsta.com\/fr\/blog\/meilleures-polices-google-fonts\/\">polices Google<\/a> et choisir celles que vous voulez activer\/d\u00e9sactiver quel que soit votre th\u00e8me actif.<\/p>\n<p>\u00c7a a l&rsquo;air g\u00e9nial, non ? Nous avons maintenant beaucoup plus de contr\u00f4le sur un aspect essentiel de chaque site web : la typographie. Pour utiliser des polices personnalis\u00e9es dans votre site web WordPress, vous n&rsquo;aurez plus besoin de compter sur les polices de votre th\u00e8me ou de jouer avec le CSS.<\/p>\n<p>L&rsquo;utilisation est assez simple. Dans l&rsquo;interface de l&rsquo;\u00e9diteur de site, ouvrez la colonne lat\u00e9rale Styles globaux et s\u00e9lectionnez <strong>Typographie<\/strong>.<\/p>\n<figure id=\"attachment_175339\" aria-describedby=\"caption-attachment-175339\" style=\"width: 2126px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175339 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-typography-panel.jpg\" alt=\"Le nouveau panneau Typographie dans WordPress 6.5\" width=\"2126\" height=\"1392\"><figcaption id=\"caption-attachment-175339\" class=\"wp-caption-text\">Le nouveau panneau Typographie dans WordPress 6.5<\/figcaption><\/figure>\n<p>Ici, vous devriez voir une liste des polices et des \u00e9l\u00e9ments disponibles. Cliquez sur le bouton <strong>G\u00e9rer les polices<\/strong> \u00e0 droite, et une fen\u00eatre contextuelle avec trois onglets apparaitra.<\/p>\n<figure id=\"attachment_175521\" aria-describedby=\"caption-attachment-175521\" style=\"width: 2028px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175521 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-font-library.jpg\" alt=\"L'interface de la biblioth\u00e8que de polices dans WordPress 6.5\" width=\"2028\" height=\"1198\"><figcaption id=\"caption-attachment-175521\" class=\"wp-caption-text\">L&rsquo;interface de la biblioth\u00e8que de polices dans WordPress 6.5<\/figcaption><\/figure>\n<p>L&rsquo;onglet <strong>Biblioth\u00e8que<\/strong> fournit un aper\u00e7u des polices disponibles, l&rsquo;onglet <strong>T\u00e9l\u00e9chargement<\/strong> comprend une zone de glisser-d\u00e9poser pour t\u00e9l\u00e9vers des ressources de polices depuis votre ordinateur, et l&rsquo;onglet <strong>Installer des polices<\/strong> vous permet d&rsquo;installer des polices \u00e0 partir de <a href=\"https:\/\/kinsta.com\/fr\/blog\/meilleures-polices-google-fonts\/\">Google Fonts<\/a>.<\/p>\n<figure id=\"attachment_175523\" aria-describedby=\"caption-attachment-175523\" style=\"width: 2026px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175523 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-connect-to-google-fonts.jpg\" alt=\"Dans l'onglet Installer des polices, vous pouvez vous connecter \u00e0 Google Fonts.\" width=\"2026\" height=\"1200\"><figcaption id=\"caption-attachment-175523\" class=\"wp-caption-text\">Dans l&rsquo;onglet Installer des polices, vous pouvez vous connecter \u00e0 Google Fonts.<\/figcaption><\/figure>\n<p>Une fois connect\u00e9 \u00e0 Google Fonts, une liste de toutes les polices disponibles apparaitra dans le m\u00eame panneau.<\/p>\n<figure id=\"attachment_175525\" aria-describedby=\"caption-attachment-175525\" style=\"width: 2030px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-175525\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-google-fonts.jpg\" alt=\"Google Fonts\" width=\"2030\" height=\"1200\"><figcaption id=\"caption-attachment-175525\" class=\"wp-caption-text\">Google Fonts<\/figcaption><\/figure>\n<p>Vous pouvez aussi rechercher des polices par leur nom.<\/p>\n<figure id=\"attachment_175526\" aria-describedby=\"caption-attachment-175526\" style=\"width: 2026px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175526 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-searching-fonts.jpg\" alt=\"Recherche de polices par nom dans WordPress 6.5\" width=\"2026\" height=\"1194\"><figcaption id=\"caption-attachment-175526\" class=\"wp-caption-text\">Recherche de polices par nom dans WordPress 6.5<\/figcaption><\/figure>\n<p>Choisissez les variantes de polices dont vous avez besoin, cliquez sur <strong>Installer<\/strong>, et vous avez termin\u00e9.<\/p>\n<figure id=\"attachment_175527\" aria-describedby=\"caption-attachment-175527\" style=\"width: 2028px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175527 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-font-variants.jpg\" alt=\"Variantes de polices Ubuntu sur Google Fonts\" width=\"2028\" height=\"1198\"><figcaption id=\"caption-attachment-175527\" class=\"wp-caption-text\">Variantes de polices Ubuntu sur Google Fonts<\/figcaption><\/figure>\n<p>Quand vous installez une nouvelle police, la biblioth\u00e8que de polices ajoute la d\u00e9finition de la famille de polices aux polices install\u00e9es et t\u00e9l\u00e9charge la ressource dans le dossier <strong>wp-content\/uploads\/fonts<\/strong>.<\/p>\n<aside role=\"note\" class=\"wp-block-kinsta-notice is-style-info\">\n            <h3>Info<\/h3>\n        <p>Google Fonts n&rsquo;est sollicit\u00e9 que lorsque vous installez des polices. Une fois que vous avez ajout\u00e9 une police \u00e0 votre biblioth\u00e8que de polices, aucune demande suppl\u00e9mentaire n&rsquo;est envoy\u00e9e \u00e0 Google car les polices sont h\u00e9berg\u00e9es localement (voir aussi notre Guide approfondi sur l&rsquo;<a href=\"https:\/\/kinsta.com\/fr\/blog\/polices-local\/\">h\u00e9bergement des polices locales dans WordPress<\/a>.<\/p>\n<\/aside>\n\n<h3>D\u00e9sactiver la biblioth\u00e8que de polices<\/h3>\n<p>Les d\u00e9veloppeurs d&rsquo;extensions et de th\u00e8mes peuvent <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/57818\" target=\"_blank\" rel=\"noopener noreferrer\">d\u00e9sactiver la biblioth\u00e8que de polices<\/a> \u00e0 l&rsquo;aide du nouveau filtre PHP <code>fontLibraryEnabled<\/code>:<\/p>\n<pre><code class=\"language-php\">function disable_font_library_ui( $editor_settings ) { \n\t$editor_settings['fontLibraryEnabled'] = false;\n\treturn $editor_settings; \n}\nadd_filter( \"block_editor_settings_all\", \"disable_font_library_ui\" );<\/code><\/pre>\n<h2>Vues de donn\u00e9es<\/h2>\n<p><a href=\"https:\/\/developer.wordpress.org\/block-editor\/reference-guides\/packages\/packages-dataviews\/\" target=\"_blank\" rel=\"noopener noreferrer\">Les vues de donn\u00e9es<\/a> sont un composant permettant de rendre des ensembles de donn\u00e9es \u00e0 l&rsquo;aide de diff\u00e9rents types de mises en page, tels que tableau, grille, liste, et plus encore.<\/p>\n<p>Avec cette it\u00e9ration, de <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/55083\" target=\"_blank\" rel=\"noopener noreferrer\">nouvelles vues et des fonctionnalit\u00e9s connexes<\/a> pour la gestion des pages, des compositions et des mod\u00e8les viennent s&rsquo;ajouter au c\u0153ur, et nous pouvons nous attendre \u00e0 des am\u00e9liorations suppl\u00e9mentaires avec les prochaines versions de WordPress.<\/p>\n<p>Pour l&rsquo;instant, WordPress 6.5 introduit les vues suivantes dans l&rsquo;\u00e9diteur de site :<\/p>\n<ul>\n<li>Mod\u00e8les &gt; G\u00e9rer tous les mod\u00e8les : Table et Grille.<\/li>\n<li>Compositions &gt; Parties du mod\u00e8le &gt; G\u00e9rer toutes les parties du mod\u00e8le : Table et Grille.<\/li>\n<li>Compositions : Disposition en grille.<\/li>\n<li>Pages &gt; G\u00e9rer toutes les pages : Mises en pages de tableau et de grille.<\/li>\n<\/ul>\n<figure id=\"attachment_175543\" aria-describedby=\"caption-attachment-175543\" style=\"width: 2310px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175543 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-grid-data-view.jpg\" alt=\"R\u00e9glage de mise en page en grille pour les mod\u00e8les\" width=\"2310\" height=\"1458\"><figcaption id=\"caption-attachment-175543\" class=\"wp-caption-text\">R\u00e9glage de mise en page en grille pour les mod\u00e8les<\/figcaption><\/figure>\n<p>Outre les mises en page, les vues de donn\u00e9es ajoutent plusieurs fonctions de visualisation, notamment les filtres, la recherche, la pagination, le tri, le masquage et l&rsquo;affichage des champs.<\/p>\n<figure id=\"attachment_175545\" aria-describedby=\"caption-attachment-175545\" style=\"width: 1556px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175545 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-fields-data-view.jpg\" alt=\"R\u00e9glage des champs pour la vue Mod\u00e8les\" width=\"1556\" height=\"990\"><figcaption id=\"caption-attachment-175545\" class=\"wp-caption-text\">R\u00e9glage des champs pour la vue Mod\u00e8les<\/figcaption><\/figure>\n<p>Un bouton de <strong>modification group\u00e9e<\/strong> vous permet d&rsquo;effectuer <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/58144\" target=\"_blank\" rel=\"noopener noreferrer\">plusieurs actions group\u00e9es<\/a> en fonction de l&rsquo;ensemble de donn\u00e9es actuel. Pour les pages, vous pouvez <strong>d\u00e9placer vers la corbeille<\/strong>, <strong>restaurer<\/strong> et <strong>supprimer d\u00e9finitivement<\/strong>.<\/p>\n<figure id=\"attachment_175546\" aria-describedby=\"caption-attachment-175546\" style=\"width: 2174px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175546 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-bulk-edit.jpg\" alt=\"Modifier des pages de fa\u00e7on group\u00e9e dans WordPress 6.5\" width=\"2174\" height=\"772\"><figcaption id=\"caption-attachment-175546\" class=\"wp-caption-text\">Modifier des pages de fa\u00e7on group\u00e9e dans WordPress 6.5<\/figcaption><\/figure>\n<p>Les vues de donn\u00e9es sont \u00e9galement accompagn\u00e9es d&rsquo;une nouvelle <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/58427\" target=\"_blank\" rel=\"noopener noreferrer\">API de filtre primaire<\/a> visant \u00e0 ajouter un type de filtre sp\u00e9cial &#8211; toujours visible \u00e0 l&rsquo;\u00e9cran &#8211; aux vues de donn\u00e9es. L&rsquo;image ci-dessous montre le nouveau filtre primaire de l&rsquo;<strong>\u00e9tat de la synchronisation<\/strong> dans la section d&rsquo;administration des compositions.<\/p>\n<figure id=\"attachment_175547\" aria-describedby=\"caption-attachment-175547\" style=\"width: 2314px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175547 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-sync-status-primary-filter.jpg\" alt=\"Le filtre primaire \u00e9tat de la synchronisation pour les compositions\" width=\"2314\" height=\"954\"><figcaption id=\"caption-attachment-175547\" class=\"wp-caption-text\">Le filtre primaire \u00e9tat de la synchronisation pour les compositions<\/figcaption><\/figure>\n<p>L&rsquo;<a href=\"https:\/\/github.com\/WordPress\/gutenberg\/blob\/trunk\/packages\/dataviews\/README.md\" target=\"_blank\" rel=\"noopener noreferrer\">API DataViews<\/a> est fournie avec le nouveau paquet <code>@wordpress\/dataviews<\/code> npm qui permet aux d\u00e9veloppeurs d&rsquo;exp\u00e9rimenter avec les vues de donn\u00e9es.<\/p>\n<h2>API Block Bindings<\/h2>\n<p>L&rsquo;<a href=\"https:\/\/make.wordpress.org\/core\/2024\/03\/06\/new-feature-the-block-bindings-api\/\">API Block Bindings<\/a> est une nouvelle API qui vise \u00e0 connecter les attributs des blocs \u00e0 des valeurs provenant de diff\u00e9rentes sources de donn\u00e9es. Ces valeurs peuvent varier en fonction du contexte. Un exemple simple serait un titre contenant le nom de l&rsquo;auteur qui changerait en fonction de la valeur <code>post_author<\/code>.<\/p>\n<p>Il s&rsquo;agit d&rsquo;une am\u00e9lioration remarquable car elle \u00e9tend les capacit\u00e9s de plusieurs blocs de base. Gr\u00e2ce \u00e0 la nouvelle API, vous pouvez lier des donn\u00e9es dynamiques provenant de n&rsquo;importe quelle source \u00e0 un attribut de bloc.<\/p>\n<p>Les sources de donn\u00e9es peuvent \u00eatre les plus diverses : Donn\u00e9es du site, champs personnalis\u00e9s, donn\u00e9es utilisateur, mod\u00e8les, codes courts, autres blocs, et m\u00eame outils externes utilisant Gutenberg. Un exemple de cela pourrait \u00eatre un site web Drupal avec Gutenberg.<\/p>\n<p>D&rsquo;un point de vue technique, nous pouvons d\u00e9crire le fonctionnement de l&rsquo;API Block Bindings comme un <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/54536\" target=\"_blank\" rel=\"noopener noreferrer\">processus en trois \u00e9tapes<\/a>:<\/p>\n<ol>\n<li>Premi\u00e8rement, vous cr\u00e9ez une liaison entre les attributs du bloc et une source de donn\u00e9es \u00e0 l&rsquo;aide d&rsquo;un objet <code>bindings<\/code>.<\/li>\n<li>L&rsquo;API obtient la valeur de la source de donn\u00e9es d\u00e9finie dans la liaison.<\/li>\n<li>Ensuite, elle met \u00e0 jour le code HTML du bloc \u00e0 l&rsquo;aide des valeurs re\u00e7ues de la source de donn\u00e9es.<\/li>\n<\/ol>\n<p>La premi\u00e8re impl\u00e9mentation de l&rsquo;API Block Bindings qui arrive avec WordPress 6.5 permet de <a href=\"#connecting-custom-fields-to-blocks\">connecter les attributs des blocs et les champs personnalis\u00e9s<\/a>. Une deuxi\u00e8me impl\u00e9mentation annonc\u00e9e, Synced Patterns Overrides, a \u00e9t\u00e9 <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/53705#issuecomment-1972969046\" target=\"_blank\" rel=\"noopener noreferrer\">report\u00e9e \u00e0 une prochaine version<\/a>.<\/p>\n<p>Dans un premier temps, seul un nombre limit\u00e9 de blocs, tels que les titres, les paragraphes, les images et les boutons, prendront en charge l&rsquo;API Block Bindings. Avec les it\u00e9rations futures, d&rsquo;autres blocs, m\u00eame des blocs personnalis\u00e9s, seront ajout\u00e9s \u00e0 la liste.<\/p>\n<p>Cette premi\u00e8re mise en \u0153uvre de l&rsquo;API permet \u00e9galement aux d\u00e9veloppeurs d&rsquo;extensions d&rsquo;enregistrer leurs sources de la m\u00eame mani\u00e8re que Gutenberg enregistre la source de donn\u00e9es <code>core\/post-meta<\/code>. En te basant sur l&rsquo;<a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/53300#issuecomment-1938463648\" target=\"_blank\" rel=\"noopener noreferrer\">exemple de Santos Guillamot<\/a>, vous pouvez enregistrer la source de donn\u00e9es de votre extension de cette fa\u00e7on :<\/p>\n<pre><code class=\"language-php\">register_block_bindings_source(\n\t'myplugin\/plugin-data',\n\tarray(\n\t\t'label'              =&gt; _x( 'Plugin Data', 'block bindings source' ),\n\t\t'get_value_callback' =&gt; 'myplugin_block_bindings_post_meta_callback',\n\t)\n);<\/code><\/pre>\n<p>Puis ajouter un objet bindings \u00e0 votre bloc :<\/p>\n<pre><code class=\"language-json\">&lt;!-- wp:paragraph \n{\n\t\"metadata\": {\n\t\t\"bindings\": {\n\t\t\t\"content\": {\n\t\t\t\t\"source\": \"myplugin\/plugin-data\",\n\t\t\t\t\"args\": {\n\t\t\t\t\t\"key\":\"plugin_key\"\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}\n--&gt;\n&lt;p&gt;Paragraph&lt;\/p&gt;\n&lt;!-- \/wp:paragraph --&gt;<\/code><\/pre>\n<p>Voici une description de chaque propri\u00e9t\u00e9 :<\/p>\n<ul>\n<li><code>metadata<\/code>: Un objet de m\u00e9tadonn\u00e9es de bloc.<\/li>\n<li><code>bindings<\/code>: Un objet contenant une ou plusieurs liaisons.<\/li>\n<li><code>content<\/code>: L&rsquo;attribut du bloc \u00e0 lier \u00e0 une source de donn\u00e9es. Dans cet exemple, l&rsquo;attribut <code>content<\/code> d&rsquo;un bloc Paragraphe.<\/li>\n<li><code>source<\/code>: La source des liaisons.<\/li>\n<li><code>args<\/code>: Un objet d&rsquo;arguments \u00e0 transmettre \u00e0 la source de liaisons du bloc.<\/li>\n<\/ul>\n<p>Les prochaines it\u00e9rations ajouteront d&rsquo;autres fonctionnalit\u00e9s \u00e0 l&rsquo;API des liaisons de blocs. En outre, nous devrions bient\u00f4t pouvoir cr\u00e9er des liaisons \u00e0 partir de l&rsquo;\u00e9diteur visuel, connecter les attributs des blocs \u00e0 davantage de sources de donn\u00e9es, telles que les donn\u00e9es du site ou de la taxonomie, et utiliser cette fonctionnalit\u00e9 avec davantage de blocs.<\/p>\n<p>Ceci \u00e9tant dit, plongeons plus profond\u00e9ment dans les premi\u00e8res impl\u00e9mentations de l&rsquo;API Block Bindings.<\/p>\n<h2>Connecter des champs personnalis\u00e9s \u00e0 des blocs<\/h2>\n<p>Avant WordPress 6.5, il n&rsquo;y avait aucun moyen d&rsquo;injecter des valeurs de champs personnalis\u00e9s dans le contenu des blocs principaux. Les d\u00e9veloppeurs pouvaient seulement <a href=\"https:\/\/kinsta.com\/fr\/blog\/ajouter-boite-meta-champ-personnalise-wordpress\/\">cr\u00e9er des blocs personnalis\u00e9s pour afficher les champs personnalis\u00e9s<\/a> sur l&rsquo;interface publique.<\/p>\n<p>Depuis WordPress 6.5, vous pouvez afficher les donn\u00e9es stock\u00e9es dans les <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/51373\" target=\"_blank\" rel=\"noopener noreferrer\">champs personnalis\u00e9s dans les blocs principaux<\/a>, y compris les boutons, les en-t\u00eates, les images et les paragraphes.<\/p>\n<p>Comme nous l&rsquo;avons d\u00e9j\u00e0 mentionn\u00e9, l&rsquo;<a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/54536\" target=\"_blank\" rel=\"noopener noreferrer\">API Block Bindings<\/a> vous permet de connecter les attributs des blocs et diff\u00e9rentes sources de donn\u00e9es, y compris la source \u00ab meta_fields \u00bb. Pour utiliser cette fonctionnalit\u00e9, vous devez d&rsquo;abord activer les champs personnalis\u00e9s dans l&rsquo;\u00e9diteur \u00e0 partir de Options -&gt; Pr\u00e9f\u00e9rences -&gt; G\u00e9n\u00e9ral -&gt; Avanc\u00e9.<\/p>\n<figure id=\"attachment_175444\" aria-describedby=\"caption-attachment-175444\" style=\"width: 1492px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175444 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-preferences-panel.png\" alt=\"La fen\u00eatre modale des pr\u00e9f\u00e9rences dans l'\u00e9diteur de publications\" width=\"1492\" height=\"1012\"><figcaption id=\"caption-attachment-175444\" class=\"wp-caption-text\">La fen\u00eatre modale des pr\u00e9f\u00e9rences dans l&rsquo;\u00e9diteur de publications<\/figcaption><\/figure>\n<p>Notez que, depuis WordPress 6.5, vous n&rsquo;avez pas de contr\u00f4le d&rsquo;interface utilisateur pour lier la valeur d&rsquo;un champ personnalis\u00e9 \u00e0 un attribut de bloc.<\/p>\n<p>Ainsi, une fois que vous avez ajout\u00e9 la cl\u00e9 et la valeur de votre champ personnalis\u00e9, vous devez passer \u00e0 l&rsquo;\u00e9diteur de code et ajouter un objet \u00ab bindings \u00bb \u00e0 l&rsquo;int\u00e9rieur du d\u00e9limiteur de bloc, comme le montre le code ci-dessous :<\/p>\n<pre><code class=\"language-json\">&lt;!-- wp:paragraph \n\t{\n\t\t\"metadata\": {\n\t\t\t\"bindings\": {\n\t\t\t\t\"content\": {\n\t\t\t\t\t\"source\":\"core\/post-meta\",\n\t\t\t\t\t\"args\": {\n\t\t\t\t\t\t\"key\":\"my_custom_field\"\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t} --&gt;\n\t&lt;p&gt;Paragraph&lt;\/p&gt;\n&lt;!-- \/wp:paragraph --&gt;<\/code><\/pre>\n<p>L&rsquo;ajout d&rsquo;un champ personnalis\u00e9 \u00e0 un bloc verrouille les contr\u00f4les appropri\u00e9s, ce qui rend le contenu du bloc non modifiable.<\/p>\n<p>Voyons maintenant comment cela fonctionne avec un bloc Image. Ajoute deux champs personnalis\u00e9s pour les attributs <code>alt<\/code> et <code>src<\/code>.<\/p>\n<figure id=\"attachment_175445\" aria-describedby=\"caption-attachment-175445\" style=\"width: 1798px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175445 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-custom-fields.png\" alt=\"Deux champs personnalis\u00e9s pour stocker les valeurs alt et src\" width=\"1798\" height=\"498\"><figcaption id=\"caption-attachment-175445\" class=\"wp-caption-text\">Deux champs personnalis\u00e9s pour stocker les valeurs alt et src<\/figcaption><\/figure>\n<p>Ajoutez ensuite un bloc Image, passez \u00e0 l&rsquo;\u00e9diteur de code et ajoutez un objet <code>bindings<\/code> au bloc, comme dans l&rsquo;exemple suivant :<\/p>\n<pre><code class=\"language-json\">&lt;!-- wp:image {\n\t\"metadata\":{\n\t\t\"bindings\":{\n\t\t\t\"url\":{\n\t\t\t\t\"source\":\"core\/post-meta\",\n\t\t\t\t\"args\":{\n\t\t\t\t\t\"key\":\"img_src\"\n\t\t\t\t}\n\t\t\t},\n\t\t\t\"alt\":{\n\t\t\t\t\"source\":\"core\/post-meta\",\n\t\t\t\t\"args\":{\n\t\t\t\t\t\"key\":\"img_alt\"\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}\n--&gt;\n&lt;figure class=\"wp-block-image\"&gt;&lt;img src=\"\" alt=\"\" \/&gt;&lt;\/figure&gt;\n&lt;!-- \/wp:image --&gt;<\/code><\/pre>\n<p>Vous remarquerez que vous ne pourrez pas remplacer la source de l&rsquo;image en utilisant les contr\u00f4les de l&rsquo;\u00e9diteur.<\/p>\n<figure id=\"attachment_175347\" aria-describedby=\"caption-attachment-175347\" style=\"width: 1326px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175347 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-image-placeholder-with-custom-fields.png\" alt=\"L'espace r\u00e9serv\u00e9 de l'image sans les contr\u00f4les des m\u00e9dias\" width=\"1326\" height=\"590\"><figcaption id=\"caption-attachment-175347\" class=\"wp-caption-text\">L&rsquo;espace r\u00e9serv\u00e9 de l&rsquo;image sans les contr\u00f4les des m\u00e9dias<\/figcaption><\/figure>\n<p>Avec <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/53300#issuecomment-1938463648\" target=\"_blank\" rel=\"noopener noreferrer\">cette premi\u00e8re it\u00e9ration<\/a>, seuls les attributs de bloc suivants peuvent \u00eatre connect\u00e9s aux champs personnalis\u00e9s :<\/p>\n<ul>\n<li>Paragraphe : contenu.<\/li>\n<li>Titre : contenu.<\/li>\n<li>Image : URL, alt et titre.<\/li>\n<li>Bouton : texte, URL, linkTarget, rel.<\/li>\n<\/ul>\n<p>Pour un aper\u00e7u plus complet de la connexion des champs personnalis\u00e9s avec les attributs de bloc, voir cette <a href=\"https:\/\/developer.wordpress.org\/news\/2024\/02\/20\/introducing-block-bindings-part-1-connecting-custom-fields\/\">introduction compl\u00e8te aux Block Bindings<\/a>.<\/p>\n<h2>Syst\u00e8me de r\u00e9vision am\u00e9lior\u00e9<\/h2>\n<p>Les r\u00e9visions vous donnent l&rsquo;assurance que vous pouvez annuler tout changement en r\u00e9tablissant une version ant\u00e9rieure de l&rsquo;apparence du site \u00e0 n&rsquo;importe quel moment. En raison de l&rsquo;importance d&rsquo;un <a href=\"https:\/\/make.wordpress.org\/core\/2023\/07\/05\/revisions\/\" target=\"_blank\" rel=\"noopener noreferrer\">syst\u00e8me de r\u00e9vision fiable<\/a> sur les sites web collaboratifs, les r\u00e9visions de style occupent une place pr\u00e9pond\u00e9rante dans la <a href=\"https:\/\/make.wordpress.org\/core\/2023\/03\/24\/phase-3-collaboration\/\">phase actuelle<\/a> de d\u00e9veloppement de WordPress. WordPress 6.5 apporte plusieurs <a href=\"https:\/\/make.wordpress.org\/core\/2024\/01\/22\/core-editor-improvement-robust-revisions-in-the-site-editor\/\" target=\"_blank\" rel=\"noopener noreferrer\">am\u00e9liorations significatives<\/a> au syst\u00e8me de r\u00e9vision.<\/p>\n<p>Voici ce \u00e0 quoi vous pouvez vous t&rsquo;attendre avec les r\u00e9visions dans WordPress 6.5.<\/p>\n<h3>Description des changements<\/h3>\n<p>Dans la version pr\u00e9c\u00e9dente de WordPress, seuls la date, l&rsquo;heure et l&rsquo;auteur de chaque r\u00e9vision \u00e9taient visibles. \u00c0 partir de WordPress 6.5, en plus de ces d\u00e9tails, vous verrez \u00e9galement un <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/56577\" target=\"_blank\" rel=\"noopener noreferrer\">bref r\u00e9sum\u00e9<\/a> et d&rsquo;<a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/56577\" target=\"_blank\" rel=\"noopener noreferrer\">autres d\u00e9tails<\/a> de cette version.<\/p>\n<figure id=\"attachment_175345\" aria-describedby=\"caption-attachment-175345\" style=\"width: 1162px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175345 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-revisions-panel-1.jpg\" alt=\"R\u00e9sum\u00e9 des r\u00e9visions dans WordPress 6.5\" width=\"1162\" height=\"1030\"><figcaption id=\"caption-attachment-175345\" class=\"wp-caption-text\">R\u00e9sum\u00e9 des r\u00e9visions dans WordPress 6.5<\/figcaption><\/figure>\n<h3>R\u00e9visions et pagination illimit\u00e9es<\/h3>\n<p>Avant la version 6.5, en raison de la limite de l&rsquo;API Rest, il n&rsquo;\u00e9tait possible d&rsquo;afficher qu&rsquo;un maximum de 100 r\u00e9visions dans un seul panneau de la colonne lat\u00e9rale.<\/p>\n<p>Gr\u00e2ce aux <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/54046\" target=\"_blank\" rel=\"noopener noreferrer\">deux nouveaux s\u00e9lecteurs<\/a> <code>getRevisions<\/code> et <code>getRevision<\/code>, introduits avec <a href=\"https:\/\/make.wordpress.org\/core\/2023\/12\/06\/whats-new-in-gutenberg-17-2-6-december\/\" target=\"_blank\" rel=\"noopener noreferrer\">Gutenberg 17.2<\/a> et d\u00e9sormais fusionn\u00e9s dans le c\u0153ur avec WordPress 6.5, la limite de 100 r\u00e9visions n&rsquo;existe plus. De plus, vous pouvez parcourir toutes les r\u00e9visions existantes divis\u00e9es en <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/56799\" target=\"_blank\" rel=\"noopener noreferrer\">pages de 10 \u00e9l\u00e9ments<\/a> chacune.<\/p>\n<h3>Int\u00e9gration du livre de style des r\u00e9visions<\/h3>\n<p>Un autre changement fait que le panneau des r\u00e9visions est \u00e9galement <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/56800\" target=\"_blank\" rel=\"noopener noreferrer\">disponible avec le livre de style<\/a>. Cela vous permet de v\u00e9rifier les modifications que vous avez apport\u00e9 \u00e0 vos styles sur les compositions et les blocs qui ne sont pas inclus dans le mod\u00e8le actuel.<\/p>\n<figure id=\"attachment_175343\" aria-describedby=\"caption-attachment-175343\" style=\"width: 2126px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175343 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-revisions-style-book.jpg\" alt=\"Le livre de style prend d\u00e9sormais en charge les r\u00e9visions\" width=\"2126\" height=\"1398\"><figcaption id=\"caption-attachment-175343\" class=\"wp-caption-text\">Le livre de style prend d\u00e9sormais en charge les r\u00e9visions<\/figcaption><\/figure>\n<h3>R\u00e9visions des mod\u00e8les et des parties de mod\u00e8les<\/h3>\n<p>Les r\u00e9visions de mod\u00e8les et de parties de mod\u00e8les sont \u00e9galement disponibles pour que vous puissiez passer \u00e0 une version pr\u00e9c\u00e9dente de votre projet de conception, ce qui ajoute une couche de s\u00e9curit\u00e9 suppl\u00e9mentaire \u00e0 votre flux de travail.<\/p>\n<h2>API d&rsquo;interactivit\u00e9<\/h2>\n<p>Avant WordPress 6.5, pour ajouter de l&rsquo;interactivit\u00e9 \u00e0 leurs pages, les d\u00e9veloppeurs auraient d\u00fb impl\u00e9menter eux-m\u00eames leurs <a href=\"https:\/\/kinsta.com\/fr\/blog\/bibliotheques-javascript\/\">biblioth\u00e8ques JavaScript<\/a> pr\u00e9f\u00e9r\u00e9es. Malheureusement, cela a conduit \u00e0 un manque de coh\u00e9rence dans le d\u00e9veloppement JavaScript dans l&rsquo;interface publique.<\/p>\n<p>\u00c0 <a href=\"https:\/\/make.wordpress.org\/core\/2024\/02\/19\/merge-announcement-interactivity-api\/\" target=\"_blank\" rel=\"noopener noreferrer\">partir de WordPress 6.5<\/a>, une nouvelle <a href=\"https:\/\/make.wordpress.org\/core\/2024\/03\/04\/interactivity-api-dev-note\/\" target=\"_blank\" rel=\"noopener noreferrer\">API d&rsquo;interactivit\u00e9<\/a> fournit un moyen moderne et standardis\u00e9 d&rsquo;ajouter de l&rsquo;interactivit\u00e9 \u00e0 l&rsquo;interface publique de vos sites WordPress.<\/p>\n<p>Si vous vous demandez <a href=\"https:\/\/make.wordpress.org\/core\/2023\/03\/30\/proposal-the-interactivity-api-a-better-developer-experience-in-building-interactive-blocks\/\" target=\"_blank\" rel=\"noopener noreferrer\">ce que fait cette nouvelle API<\/a>, nous en avons eu un avant-gout plus t\u00f4t dans <a href=\"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-4\/\">WordPress 6.4<\/a> puisque les blocs principaux Image, Recherche, Fichier, Navigation et Requ\u00eate ont \u00e9t\u00e9 remani\u00e9s \u00e0 l&rsquo;aide de la version priv\u00e9e de l&rsquo;API. L&rsquo;<a href=\"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-4\/#lightbox-effect-on-images\">effet lightbox<\/a> sur les images est un autre bon exemple.<\/p>\n<p>La pagination dynamique, la recherche instantan\u00e9e et l&rsquo;interaction en temps r\u00e9el entre les blocs ne sont que quelques exemples de ce que vous pourrez mettre en \u0153uvre sur vos sites web en utilisant l&rsquo;API Interactivit\u00e9 :<\/p>\n<blockquote><p>Les blocs peuvent partager des donn\u00e9es, des actions et des rappels entre eux. Cela rend la communication entre les blocs plus simple et moins sujette aux erreurs. Par exemple, un clic sur un bloc \u00ab ajouter au panier \u00bb peut mettre \u00e0 jour de fa\u00e7on transparente un bloc \u00ab panier \u00bb s\u00e9par\u00e9.<\/p><\/blockquote>\n<p>Et c&rsquo;est incroyablement rapide. Tous les scripts n\u00e9cessaires pour ajouter de l&rsquo;interactivit\u00e9 ne seront charg\u00e9s sur l&rsquo;interface publique que si vous avez au moins un bloc interactif sur la page.<\/p>\n<p>L&rsquo;API Interactivit\u00e9 adopte une approche moderne du d\u00e9veloppement frontend qui exploite la puissance des attributs HTML personnalis\u00e9s pour r\u00e9duire la quantit\u00e9 de JavaScript n\u00e9cessaire pour ajouter de l&rsquo;interactivit\u00e9 \u00e0 vos pages.<\/p>\n<p>Si vous connaissez les biblioth\u00e8ques frontend telles que HTMX et Alpine.js, vous serez heureux de voir la m\u00eame logique mise en \u0153uvre dans WordPress avec l&rsquo;API d&rsquo;interactivit\u00e9. Alors, de quoi s&rsquo;agit-il ? Allons-y plus en profondeur.<\/p>\n<h3>Qu&rsquo;est-ce que l&rsquo;API d&rsquo;interactivit\u00e9 ?<\/h3>\n<p><strong>L&rsquo;API d&rsquo;interactivit\u00e9 est un nouveau syst\u00e8me standard de directives pour la cr\u00e9ation de blocs interactifs<\/strong> qui permettra aux d\u00e9veloppeurs d&rsquo;ajouter facilement de l&rsquo;interactivit\u00e9 \u00e0 la partie frontend de leurs blocs afin que les visiteurs du site puissent interagir avec votre contenu sans avoir \u00e0 recharger la page. Pensez \u00e0 des choses comme la recherche instantan\u00e9e, l&rsquo;ajout de commentaires, l&rsquo;ajout \u00e0 un panier et la pagination dynamique.<\/p>\n<p>La nouvelle API r\u00e9pond \u00e0 un certain nombre d&rsquo;exigences qui en font un outil de d\u00e9veloppement moderne, notamment :<\/p>\n<ul>\n<li>Elle prend en charge le <strong>rendu c\u00f4t\u00e9 serveur<\/strong> et le <strong>HTML hydrat\u00e9 par le client<\/strong>.<\/li>\n<li>Elle fonctionne bien avec PHP et le syst\u00e8me de blocs actuel.<\/li>\n<li>Elle est r\u00e9trocompatible avec les crochets WordPress et les biblioth\u00e8ques JavaScript existantes.<\/li>\n<li>Elle suit une <strong>approche d\u00e9clarative<\/strong> au lieu d&rsquo;une approche imp\u00e9rative.<\/li>\n<li>Elle est performante et extensible.<\/li>\n<li>Elle est <strong>atomique et composable<\/strong>: Chaque directive contr\u00f4le une petite partie du DOM, et plusieurs directives peuvent \u00eatre combin\u00e9es pour cr\u00e9er des applications complexes.<\/li>\n<li>Elle est compatible avec les outils de d\u00e9veloppement WordPress existants.<\/li>\n<\/ul>\n<p>Comme mentionn\u00e9 ci-dessus, l&rsquo;API Interactivit\u00e9 est bas\u00e9e sur des directives, qui sont des attributs HTML sp\u00e9ciaux qui vous permettent d&rsquo;attacher un comportement sp\u00e9cifique aux \u00e9l\u00e9ments du DOM. Voici un exemple de bloc interactif :<\/p>\n<pre><code class=\"language-html\">&lt;div\n\t&lt;?php echo get_block_wrapper_attributes(); ?&gt;\n\tdata-wp-interactive='{ \"namespace\": \"create-block\" }'\n\tdata-wp-context='{ \"isOpen\": false }'\n\tdata-wp-watch=\"callbacks.logIsOpen\"\n&gt;\n\t&lt;button\n\t\tdata-wp-on--click=\"actions.toggle\"\n\t\tdata-wp-bind--aria-expanded=\"context.isOpen\"\n\t\taria-controls=\"&lt;?php echo esc_attr( $unique_id ); ?&gt;\"\n\t&gt;\n\t\t&lt;?php esc_html_e( 'Toggle', 'inter-block' ); ?&gt;\n\t&lt;\/button&gt;\n\n\t&lt;p\n\t\tid=\"&lt;?php echo esc_attr( $unique_id ); ?&gt;\"\n\t\tdata-wp-bind--hidden=\"!context.isOpen\"\n\t&gt;\n\t\t&lt;?php\n\t\t\tesc_html_e( 'Inter Block - hello from an interactive block!', 'inter-block' );\n\t\t?&gt;\n\t&lt;\/p&gt;\n&lt;\/div&gt;<\/code><\/pre>\n<p>WordPress traite ces directives sur le serveur et g\u00e9n\u00e8re le balisage correspondant.<\/p>\n<h3>Comment commencer avec l&rsquo;API d&rsquo;interactivit\u00e9<\/h3>\n<p>La mise en \u0153uvre de l&rsquo;API d&rsquo;interactivit\u00e9 n&rsquo;affectera pas le flux de travail de cr\u00e9ation des blocs. Vous pouvez mettre en place une extension qui enregistre un bloc interactif \u00e0 l&rsquo;aide de la commande <code>@wordpress\/create-block<\/code> et d&rsquo;un mod\u00e8le interactif sp\u00e9cifique.<\/p>\n<aside role=\"note\" class=\"wp-block-kinsta-notice is-style-info\">\n            <h3>Info<\/h3>\n        <p>Si vous \u00eates novice en mati\u00e8re de d\u00e9veloppement de blocs WordPress, ne manquez pas les guides suivants :<\/p>\n<ul>\n<li><a href=\"https:\/\/kinsta.com\/fr\/blog\/blocs-gutenberg\/\">Construire des blocs Gutenberg personnalis\u00e9s<\/a><\/li>\n<li><a href=\"https:\/\/kinsta.com\/fr\/blog\/blocs-dynamiques-gutenberg\/\">Comment cr\u00e9er des blocs dynamiques pour Gutenberg<\/a><\/li>\n<\/ul>\n<p><\/p>\n<\/aside>\n\n<p>Lancez votre outil de ligne de commande pr\u00e9f\u00e9r\u00e9, naviguez jusqu&rsquo;\u00e0 votre r\u00e9pertoire <strong>plugins<\/strong>, et <a href=\"https:\/\/developer.wordpress.org\/block-editor\/reference-guides\/packages\/packages-interactivity\/\" target=\"_blank\" rel=\"noopener noreferrer\">ex\u00e9cutez la commande suivante<\/a> :<\/p>\n<pre><code class=\"language-bash\">npx @wordpress\/create-block@latest my-interactive-block --template @wordpress\/create-block-interactive-template<\/code><\/pre>\n<p>Ceci g\u00e9n\u00e8re un bloc interactif \u00e0 partir d&rsquo;un mod\u00e8le qui utilise le champ de m\u00e9tadonn\u00e9es <code>viewScriptModule<\/code>. Le module de script d\u00e9clar\u00e9 dans <code>viewScriptModule<\/code> sera mis en file d&rsquo;attente lorsqu&rsquo;un bloc sera rendu sur l&rsquo;interface publique. (Voir aussi les notes <a href=\"https:\/\/make.wordpress.org\/core\/2024\/03\/04\/block-metadata-viewscriptmodule-field-in-6-5\/\" target=\"_blank\" rel=\"noopener noreferrer\">viewScriptModule<\/a> et <a href=\"https:\/\/make.wordpress.org\/core\/2024\/03\/04\/script-modules-in-6-5\/\" target=\"_blank\" rel=\"noopener noreferrer\">Script Modules<\/a>).<\/p>\n<figure id=\"attachment_175888\" aria-describedby=\"caption-attachment-175888\" style=\"width: 1768px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175888 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/03\/wp-65-interactive-block-project.jpg\" alt=\"Un projet de bloc interactif dans Visual Studio Code\" width=\"1768\" height=\"790\"><figcaption id=\"caption-attachment-175888\" class=\"wp-caption-text\">Un projet de bloc interactif dans Visual Studio Code<\/figcaption><\/figure>\n<p>Une fois le processus d&rsquo;installation termin\u00e9, vous trouverez une nouvelle extension dans votre tableau de bord WordPress. Activez-la, puis retournez \u00e0 la ligne de commande, naviguez jusqu&rsquo;au r\u00e9pertoire de la nouvelle extension, et d\u00e9marrez le service :<\/p>\n<pre><code class=\"language-bash\">cd my-interactive-block && npm start<\/code><\/pre>\n<p>Maintenant, cr\u00e9ez un nouvel article ou une nouvelle page, ouvrez l&rsquo;insertion de blocs et descendez jusqu&rsquo;\u00e0 la section Widgets. Vous y trouverez un nouveau bloc appel\u00e9 <strong>My Interactive Block<\/strong> que vous pourrez utiliser comme mod\u00e8le pour de nouvelles cr\u00e9ations passionnantes et interactives :<\/p>\n<figure id=\"attachment_175639\" aria-describedby=\"caption-attachment-175639\" style=\"width: 1620px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175639 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-my-interactive-block.png\" alt=\"Un bloc de d\u00e9veloppement interactif\" width=\"1620\" height=\"976\"><figcaption id=\"caption-attachment-175639\" class=\"wp-caption-text\">Un bloc de d\u00e9veloppement interactif<\/figcaption><\/figure>\n<p>Ajoutez le bloc \u00e0 votre contenu et enregistrez l&rsquo;article. L&rsquo;aper\u00e7u de l&rsquo;article affichera une bascule qui cache\/affiche un texte factice. Et c&rsquo;est tout. Maintenant, vous pouvez commencer \u00e0 construire des blocs interactifs.<\/p>\n<p>Vous pouvez en savoir plus sur la <a href=\"https:\/\/make.wordpress.org\/core\/2023\/03\/30\/proposal-the-interactivity-api-a-better-developer-experience-in-building-interactive-blocks\/#how-to-create-interactive-blocks\" target=\"_blank\" rel=\"noopener noreferrer\">fa\u00e7on de cr\u00e9er des blocs interactifs \u00e0 l&rsquo;aide de l&rsquo;API d&rsquo;interactivit\u00e9<\/a> sur le blog WordPress Core, la <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/tree\/trunk\/packages\/interactivity\/docs\" target=\"_blank\" rel=\"noopener noreferrer\">documentation de GitHub<\/a> et la <a href=\"https:\/\/make.wordpress.org\/core\/2024\/03\/04\/interactivity-api-dev-note\/\" target=\"_blank\" rel=\"noopener noreferrer\">note de d\u00e9veloppement de l&rsquo;API d&rsquo;interactivit\u00e9<\/a>.<\/p>\n<p>Le site de d\u00e9monstration <a href=\"https:\/\/wpmovies.dev\/\" target=\"_blank\" rel=\"noopener noreferrer\">wpmovies.dev<\/a> est un excellent exemple de l&rsquo;API d&rsquo;interactivit\u00e9 \u00e0 l&rsquo;\u0153uvre.<\/p>\n<h2>Nouveaux outils de conception<\/h2>\n<p>WordPress 6.5 introduit \u00e9galement de nouveaux outils de conception qui vous permettent de personnaliser davantage votre design sans avoir recours \u00e0 un code CSS personnalis\u00e9.<\/p>\n<h3>Prise en charge de la taille et de la r\u00e9p\u00e9tition de l&rsquo;image d&rsquo;arri\u00e8re-plan pour le bloc Groupe<\/h3>\n<p>Le bloc Groupe prend d\u00e9sormais en charge les <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/57005\" target=\"_blank\" rel=\"noopener noreferrer\">fonctions de taille et de r\u00e9p\u00e9tition<\/a> pour les images d&rsquo;arri\u00e8re-plan. Cela vous permet \u00e9galement de d\u00e9finir la taille de l&rsquo;image d&rsquo;arri\u00e8re-plan pour couvrir ou contenir, en conservant le m\u00eame rapport d&rsquo;aspect.<\/p>\n<figure id=\"attachment_175596\" aria-describedby=\"caption-attachment-175596\" style=\"width: 2112px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175596 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-background-image-size.jpg\" alt=\"Contr\u00f4le de la taille de l'image d'arri\u00e8re-plan pour un bloc Groupe\" width=\"2112\" height=\"1162\"><figcaption id=\"caption-attachment-175596\" class=\"wp-caption-text\">Contr\u00f4le de la taille de l&rsquo;image d&rsquo;arri\u00e8re-plan pour un bloc Groupe<\/figcaption><\/figure>\n<p>De plus, lorsque vous d\u00e9finissez la <strong>taille de l&rsquo;arri\u00e8re-plan<\/strong> sur <strong>Fixe<\/strong>, une bascule <strong>R\u00e9p\u00e9ter<\/strong> s&rsquo;affiche pour vous permettre d&rsquo;activer ou de d\u00e9sactiver la r\u00e9p\u00e9tition de l&rsquo;arri\u00e8re-plan.<\/p>\n<h3>Prise en charge des proportions pour le bloc Couverture<\/h3>\n<p>Le bloc Couverture prend d\u00e9sormais <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/56897\" target=\"_blank\" rel=\"noopener noreferrer\">en charge le ration d&rsquo;aspect<\/a>. Vous pouvez contr\u00f4ler le rapport d&rsquo;aspect du bloc au niveau global \u00e0 partir de l&rsquo;interface Style global ou l&rsquo;ajuster individuellement dans votre contenu.<\/p>\n<figure id=\"attachment_175597\" aria-describedby=\"caption-attachment-175597\" style=\"width: 2140px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175597 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-aspect-ration-control.jpg\" alt=\"Le contr\u00f4le du rapport d'aspect pour le bloc Couverture\" width=\"2140\" height=\"1242\"><figcaption id=\"caption-attachment-175597\" class=\"wp-caption-text\">Le contr\u00f4le du rapport d&rsquo;aspect pour le bloc Couverture<\/figcaption><\/figure>\n<h3>Prise en charge de l&rsquo;ombre pour d&rsquo;autres blocs<\/h3>\n<p>Jusqu&rsquo;\u00e0 pr\u00e9sent, le bloc Bouton \u00e9tait le seul bloc \u00e0 prendre en charge les ombres. WordPress 5.6 ajoute la <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/57103\" target=\"_blank\" rel=\"noopener noreferrer\">prise en charge des ombres<\/a> aux blocs Colonne et Colonne et Image.<\/p>\n<p>Vous pouvez ajouter des ombres \u00e0 ces blocs \u00e0 partir de l&rsquo;onglet Styles du bloc dans les r\u00e9glages du bloc.<\/p>\n<figure id=\"attachment_175598\" aria-describedby=\"caption-attachment-175598\" style=\"width: 2016px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175598 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-drop-shadow.jpg\" alt=\"Le bloc Image prend d\u00e9sormais en charge les ombres\" width=\"2016\" height=\"994\"><figcaption id=\"caption-attachment-175598\" class=\"wp-caption-text\">Le bloc Image prend d\u00e9sormais en charge les ombres<\/figcaption><\/figure>\n<h2>Mises \u00e0 jour de l&rsquo;\u00e9diteur de site<\/h2>\n<p>Plusieurs am\u00e9liorations apport\u00e9es \u00e0 l&rsquo;\u00e9diteur de site devraient consid\u00e9rablement am\u00e9liorer votre exp\u00e9rience d&rsquo;\u00e9dition et rationaliser votre flux de travail.<\/p>\n<h3>Am\u00e9liorations de l&rsquo;affichage des listes<\/h3>\n<p>La vue en liste est un \u00e9l\u00e9ment central du flux de travail de conception, et WordPress 6.5 apporte quelques am\u00e9liorations.<\/p>\n<p>Tout d&rsquo;abord, vous pouvez maintenant <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/50273\" target=\"_blank\" rel=\"noopener noreferrer\">faire un clic droit sur la vue en liste<\/a> pour acc\u00e9der \u00e0 la liste d\u00e9roulante des r\u00e9glages du bloc. Il s&rsquo;agit d&rsquo;une petite am\u00e9lioration utile qui devrait rationaliser votre processus de cr\u00e9ation, car elle facilite l&rsquo;acc\u00e8s aux r\u00e9glages des blocs \u00e0 partir de la vue en liste.<\/p>\n<p>Une deuxi\u00e8me am\u00e9lioration vous permet de <a href=\"https:\/\/make.wordpress.org\/core\/2023\/10\/25\/whats-new-in-gutenberg-16-9-25-october-2\/#rename-almost-all-blocks-from-the-editor\" target=\"_blank\" rel=\"noopener noreferrer\">renommer presque tous les blocs<\/a> de la vue en liste, \u00e0 l&rsquo;exception des blocs suivants :<\/p>\n<ul>\n<li>core\/block<\/li>\n<li>core\/template-part<\/li>\n<li>core\/pattern<\/li>\n<li>core\/navigation<\/li>\n<\/ul>\n<p>La vue en liste a \u00e9galement \u00e9t\u00e9 am\u00e9lior\u00e9e gr\u00e2ce \u00e0 un raccourci clavier. Vous pouvez maintenant <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/54899\" target=\"_blank\" rel=\"noopener noreferrer\">s\u00e9lectionner tous les blocs<\/a> de la vue Liste en cliquant sur <strong>CTRL + A<\/strong> sous Windows et <strong>CMD + A<\/strong> sous Mac. Cela vous permet d&rsquo;effectuer facilement des actions group\u00e9es.<\/p>\n<h3>Dupliquer et renommer les compositions<\/h3>\n<p>Les compositions fournies par les th\u00e8mes ne sont pas modifiables, vous ne pouvez donc pas les utiliser pour cr\u00e9er vos propres compositions ou simplement changer quelque chose dans la composition. WordPress 6.5 ajoute une <a href=\"https:\/\/make.wordpress.org\/core\/2023\/10\/25\/whats-new-in-gutenberg-16-9-25-october-2\/#duplicate-and-rename-patterns-and-more\" target=\"_blank\" rel=\"noopener noreferrer\">petite fonction tr\u00e8s utile<\/a> permettant de <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/55292\" target=\"_blank\" rel=\"noopener noreferrer\">dupliquer<\/a> et de <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/55188\" target=\"_blank\" rel=\"noopener noreferrer\">renommer<\/a> les compositions, ce qui vous permet de changer les r\u00e9glages de synchronisation et de modifier les compositions selon vos besoins.<\/p>\n<figure id=\"attachment_175698\" aria-describedby=\"caption-attachment-175698\" style=\"width: 1808px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175698 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-rename-delete-patterns.jpg\" alt=\"Il est d\u00e9sormais possible de renommer et de supprimer des compositions\" width=\"1808\" height=\"1224\"><figcaption id=\"caption-attachment-175698\" class=\"wp-caption-text\">Il est d\u00e9sormais possible de renommer et de supprimer des compositions<\/figcaption><\/figure>\n<p>En outre, deux nouvelles cat\u00e9gories de compositions ont \u00e9t\u00e9 ajout\u00e9es : <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/55236\" target=\"_blank\" rel=\"noopener noreferrer\">Audio et Vid\u00e9o<\/a>.<\/p>\n<figure id=\"attachment_175699\" aria-describedby=\"caption-attachment-175699\" style=\"width: 2146px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175699 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-pattern-categories.jpg\" alt=\"Le panneau des cat\u00e9gories de compositions dans WordPress 6.5\" width=\"2146\" height=\"932\"><figcaption id=\"caption-attachment-175699\" class=\"wp-caption-text\">Le panneau des cat\u00e9gories de compositions dans WordPress 6.5<\/figcaption><\/figure>\n<h3>Un panneau de pr\u00e9f\u00e9rences am\u00e9lior\u00e9<\/h3>\n<p>Avec WordPress 6.5, le panneau des pr\u00e9f\u00e9rences a <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/56510\" target=\"_blank\" rel=\"noopener noreferrer\">\u00e9t\u00e9 mis \u00e0 jour<\/a>, et les r\u00e9glages existants ont \u00e9t\u00e9 r\u00e9organis\u00e9s. Les <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/56481\" target=\"_blank\" rel=\"noopener noreferrer\">principaux changements<\/a> comprennent :<\/p>\n<ul>\n<li>De nouveaux panneaux \u00ab Apparence \u00bb et \u00ab Accessibilit\u00e9 \u00bb.<\/li>\n<li>Un nouveau r\u00e9glage de la <strong>barre d&rsquo;outils sup\u00e9rieure<\/strong> sous <strong>Apparence<\/strong>.<\/li>\n<\/ul>\n<p>L&rsquo;activation de la <strong>barre d&rsquo;outils sup\u00e9rieure<\/strong> d\u00e9place tous les outils de bloc et de document dans une seule barre d&rsquo;outils en haut de l&rsquo;\u00e9diteur.<\/p>\n<figure id=\"attachment_175700\" aria-describedby=\"caption-attachment-175700\" style=\"width: 1948px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175700 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-preferences.jpg\" alt=\"L'interface des pr\u00e9f\u00e9rences remani\u00e9e avec la barre d'outils sup\u00e9rieure activ\u00e9e\" width=\"1948\" height=\"872\"><figcaption id=\"caption-attachment-175700\" class=\"wp-caption-text\">L&rsquo;interface des pr\u00e9f\u00e9rences remani\u00e9e avec la barre d&rsquo;outils sup\u00e9rieure activ\u00e9e<\/figcaption><\/figure>\n<h3>Barre d&rsquo;outils de bloc en mode sans distraction<\/h3>\n<p>Avant WordPress 6.5, l&rsquo;acc\u00e8s \u00e0 la barre d&rsquo;outils de bloc n&rsquo;\u00e9tait pas possible en mode sans distraction, et vous \u00e9tiez oblig\u00e9 de l&rsquo;activer et de la d\u00e9sactiver \u00e0 chaque changement. Depuis WordPress 6.5, le passage du curseur sur la zone sup\u00e9rieure de l&rsquo;\u00e9diteur permet d&rsquo;<a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/56295\" target=\"_blank\" rel=\"noopener noreferrer\">afficher la barre d&rsquo;outils bloc<\/a> pour vos personnalisations.<\/p>\n<figure id=\"attachment_175701\" aria-describedby=\"caption-attachment-175701\" style=\"width: 2386px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175701 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-block-toolbar-distraction-free-mode.jpg\" alt=\"La barre d'outils des blocs en mode sans distraction\" width=\"2386\" height=\"856\"><figcaption id=\"caption-attachment-175701\" class=\"wp-caption-text\">La barre d&rsquo;outils des blocs en mode sans distraction<\/figcaption><\/figure>\n<h3>Composant LinkControl am\u00e9lior\u00e9<\/h3>\n<p>Le composant LinkControl a \u00e9t\u00e9 am\u00e9lior\u00e9 et il est d\u00e9sormais plus facile d&rsquo;ajouter des liens. L&rsquo;image suivante montre le nouveau panneau qui apparait lorsque vous cliquez sur un lien \u00e0 modifier.<\/p>\n<figure id=\"attachment_175763\" aria-describedby=\"caption-attachment-175763\" style=\"width: 1276px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175763 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-edit-link.jpg\" alt=\"\u00c9dition d'un lien dans WordPress 6.5\" width=\"1276\" height=\"804\"><figcaption id=\"caption-attachment-175763\" class=\"wp-caption-text\">\u00c9dition d&rsquo;un lien dans WordPress 6.5<\/figcaption><\/figure>\n<p>Pour une liste compl\u00e8te des modifications apport\u00e9es au composant <code>LinkControl<\/code>, voir PR <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/50891\" target=\"_blank\" rel=\"noopener noreferrer\">#50891<\/a>.<\/p>\n<h3>Am\u00e9liorations du glisser-d\u00e9poser<\/h3>\n<p>Le glisser-d\u00e9poser a \u00e9t\u00e9 am\u00e9lior\u00e9 dans plusieurs zones de l&rsquo;\u00e9diteur.<\/p>\n<p>Dans la vue en liste :<\/p>\n<ul>\n<li>Lorsque vous d\u00e9posez un bloc dans un bloc r\u00e9duit, ce dernier s&rsquo;agrandit.<\/li>\n<li>Un curseur de d\u00e9placement apparait lorsque vous faites glisser des \u00e9l\u00e9ments.<\/li>\n<\/ul>\n<p>Dans le canevas de l&rsquo;\u00e9diteur :<\/p>\n<ul>\n<li>Vous pouvez maintenant faire glisser et d\u00e9poser des \u00e9l\u00e9ments au d\u00e9but ou \u00e0 la fin de votre contenu.<\/li>\n<li>Le glisser-d\u00e9poser d&rsquo;\u00e9l\u00e9ments entre blocs conteneurs fr\u00e8res a \u00e9t\u00e9 am\u00e9lior\u00e9.<\/li>\n<li>Il est \u00e9galement possible de faire glisser des blocs dans des parties de mod\u00e8les.<\/li>\n<li>Une nouvelle indication visuelle vous informe d\u00e9sormais qu&rsquo;un bloc n&rsquo;est pas \u00ab glissable \u00bb.<\/li>\n<li>Vous pouvez faire glisser et d\u00e9poser des \u00e9l\u00e9ments au d\u00e9but ou \u00e0 la fin d&rsquo;un document.<\/li>\n<li>Vous pouvez cr\u00e9er des rang\u00e9es ou des galeries en faisant simplement glisser et en d\u00e9posant des blocs pr\u00e8s d&rsquo;autres blocs. Par exemple, l&rsquo;ajout d&rsquo;une image \u00e0 c\u00f4t\u00e9 d&rsquo;une autre image convertira le bloc Image existant en bloc Galerie.<\/li>\n<\/ul>\n<figure id=\"attachment_175764\" aria-describedby=\"caption-attachment-175764\" style=\"width: 1995px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175764 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-drag-and-drop.jpg\" alt=\"Glisser-d\u00e9poser une image pr\u00e8s d'un bloc Image\" width=\"1995\" height=\"894\"><figcaption id=\"caption-attachment-175764\" class=\"wp-caption-text\">Glisser-d\u00e9poser une image pr\u00e8s d&rsquo;un bloc Image<\/figcaption><\/figure>\n<figure id=\"attachment_175765\" aria-describedby=\"caption-attachment-175765\" style=\"width: 1995px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175765 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-gallery.jpg\" alt=\"Vous pouvez maintenant convertir un bloc Image en Galerie en faisant glisser et en d\u00e9posant des images\" width=\"1995\" height=\"591\"><figcaption id=\"caption-attachment-175765\" class=\"wp-caption-text\">Vous pouvez maintenant convertir un bloc Image en Galerie en faisant glisser et en d\u00e9posant des images<\/figcaption><\/figure>\n<p>Pour une liste plus compl\u00e8te des am\u00e9liorations apport\u00e9es au glisser-d\u00e9poser, consultez le <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/33683\" target=\"_blank\" rel=\"noopener noreferrer\">glisser-d\u00e9poser des blocs<\/a>.<\/p>\n<h2>Changements et am\u00e9liorations suppl\u00e9mentaires<\/h2>\n<p>Mais attendez, ce n&rsquo;est pas tout ! WordPress 6.5 apporte \u00e9galement un tas d&rsquo;autres changements et am\u00e9liorations qui m\u00e9ritent d&rsquo;\u00eatre mentionn\u00e9s.<\/p>\n<div><\/div><kinsta-auto-toc list-style=\"decimal\" selector=\"h3\" count-number=\"-1\" sub-toc=\"true\"><\/kinsta-auto-toc>\n<h3>Outils d&rsquo;apparence pour les th\u00e8mes classiques<\/h3>\n<p>Les th\u00e8mes classiques peuvent \u00e9galement profiter de certaines des fonctionnalit\u00e9s de conception introduites dans l&rsquo;\u00e9diteur de site, m\u00eame sans utiliser <strong>theme.json<\/strong>. <a href=\"https:\/\/core.trac.wordpress.org\/ticket\/60118\" target=\"_blank\" rel=\"noopener noreferrer\">\u00c0 partir de WordPress 6.5<\/a>, opter pour la prise en charge du th\u00e8me <code>appearanceTool<\/code> inclura les fonctionnalit\u00e9s de conception suivantes :<\/p>\n<ul>\n<li>Bordure<\/li>\n<li>Couleur<\/li>\n<li>Espacement<\/li>\n<li>Typographie<\/li>\n<\/ul>\n<p>Cela peut donner aux utilisateurs de th\u00e8mes classiques un aper\u00e7u des capacit\u00e9s de l&rsquo;\u00e9diteur de site et simplifier la transition entre les th\u00e8mes classiques et les th\u00e8mes en bloc.<\/p>\n<figure id=\"attachment_175870\" aria-describedby=\"caption-attachment-175870\" style=\"width: 1676px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175870 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-appearance-tools-in-tt1-theme.jpg\" alt=\"Outils d'apparence dans WordPress 6.5 avec le th\u00e8me Twenty Twenty-One\" width=\"1676\" height=\"1412\"><figcaption id=\"caption-attachment-175870\" class=\"wp-caption-text\">Outils d&rsquo;apparence dans WordPress 6.5 avec le th\u00e8me Twenty Twenty-One<\/figcaption><\/figure>\n<h3>Prise en charge de l&rsquo;AVIF<\/h3>\n<p>WordPress 6.5 <a href=\"https:\/\/make.wordpress.org\/core\/2024\/02\/23\/wordpress-6-5-adds-avif-support\/\">introduit \u00e9galement la prise en charge<\/a> du <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/Media\/Formats\/Image_types#avif_image\" target=\"_blank\" rel=\"noopener noreferrer\">format d&rsquo;image AVIF<\/a>, caract\u00e9ris\u00e9 par un algorithme de compression avanc\u00e9 permettant d&rsquo;obtenir une qualit\u00e9 d&rsquo;image sup\u00e9rieure avec un taux de compression \u00e9lev\u00e9. Par cons\u00e9quent, AVIF produit des fichiers d&rsquo;image plus petits que les formats conventionnels, y compris le <a href=\"https:\/\/kinsta.com\/fr\/blog\/webp\/\">format WebP<\/a>.<\/p>\n<p>Les utilisateurs peuvent d\u00e9sormais t\u00e9l\u00e9verser des fichiers AVIF de mani\u00e8re transparente via la <a href=\"https:\/\/kinsta.com\/fr\/blog\/bibliotheque-medias-wordpress\/\">m\u00e9diath\u00e8que de WordPress<\/a>, comme pour les autres formats d&rsquo;image. Cependant, v\u00e9rifie la compatibilit\u00e9 de ta plateforme d&rsquo;h\u00e9bergement avec le format de fichier AVIF.<\/p>\n<figure id=\"attachment_175871\" aria-describedby=\"caption-attachment-175871\" style=\"width: 2468px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175871 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/can-i-use-avif.jpg\" alt=\"Prise en charge par le navigateur du format d'image AVIF\" width=\"2468\" height=\"1034\"><figcaption id=\"caption-attachment-175871\" class=\"wp-caption-text\">Prise en charge par le navigateur du format d&rsquo;image AVIF (Source : <a href=\"https:\/\/caniuse.com\/avif\">Can I Use<\/a>)<\/figcaption><\/figure>\n<p>Vous pouvez v\u00e9rifier si votre h\u00e9bergeur prend en charge le format d&rsquo;image AVIF dans l&rsquo;\u00e9cran Sant\u00e9 du site de votre installation WordPress en cliquant sur l&rsquo;onglet <strong>Info<\/strong> et en d\u00e9veloppant la section <strong>Traitement des m\u00e9dias<\/strong>.<\/p>\n<h3>D\u00e9pendances des plugins<\/h3>\n<p>Certaines extensions ajoutent de nouvelles fonctionnalit\u00e9s par-dessus d&rsquo;autres extensions en tant qu&rsquo;extensions\/modules. Pour que ces extensions fonctionnent, vous devez d&rsquo;abord installer et activer leurs d\u00e9pendances &#8211; les extensions sur lesquels elles s&rsquo;appuient.<\/p>\n<p>Depuis WordPress 6.5, les d\u00e9veloppeurs d&rsquo;extensions peuvent utiliser un nouvel en-t\u00eate d&rsquo;extension \u00ab Requires Plugins \u00bb. Cet en-t\u00eate d\u00e9bloque une fonction puissante qui rationalise le processus d&rsquo;installation et d&rsquo;activation des d\u00e9pendances. Il contient une liste de slugs s\u00e9par\u00e9s par des virgules des d\u00e9pendances n\u00e9cessaires au fonctionnement d&rsquo;une extension d\u00e9pendante.<\/p>\n<p>Cela fournit des informations \u00e0 l&rsquo;utilisateur de l&rsquo;extension avec des liens vers le d\u00e9p\u00f4t d&rsquo;extensions de WordPress.org pour installer et activer les d\u00e9pendances.<\/p>\n<p>De plus, l&rsquo;extension de d\u00e9pendance fournit un d\u00e9tail \u00ab Required by \u00bb qui liste les extensions d\u00e9pendantes qui ont besoin d&rsquo;elle lui pour fonctionner. Vous remarquerez \u00e9galement que vous n&rsquo;\u00eates pas autoris\u00e9 \u00e0 supprimer l&rsquo;extension de d\u00e9pendance \u00e0 moins que vous ne supprimiez l&rsquo;extension d\u00e9pendante.<\/p>\n<figure id=\"attachment_175872\" aria-describedby=\"caption-attachment-175872\" style=\"width: 1946px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-175872 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/wp-65-required-plugin.jpg\" alt=\"Extensions n\u00e9cessaires dans WordPress 6.5\" width=\"1946\" height=\"1006\"><figcaption id=\"caption-attachment-175872\" class=\"wp-caption-text\">Extensions n\u00e9cessaires dans WordPress 6.5<\/figcaption><\/figure>\n<p>WordPress 6.5 introduit \u00e9galement un nouveau filtre <code>wp_plugin_dependencies_slug<\/code> qui vous permet de filtrer les extensions de d\u00e9pendance de mani\u00e8re programmatique.<\/p>\n<p>Voir la <a href=\"https:\/\/make.wordpress.org\/core\/2024\/03\/05\/introducing-plugin-dependencies-in-wordpress-6-5\/\" target=\"_blank\" rel=\"noopener noreferrer\">note de d\u00e9veloppement sur les d\u00e9pendances des extensions<\/a> pour une discussion plus approfondie.<\/p>\n<h3>Mises \u00e0 jour de l&rsquo;API HTML<\/h3>\n<p>Avec WordPress 6.5, le processeur de balises de l&rsquo;API HTML a re\u00e7u plusieurs am\u00e9liorations, et il <a href=\"https:\/\/core.trac.wordpress.org\/ticket\/60170\">analyse d\u00e9sormais tous les types de balises syntaxiques<\/a>, y compris les balises et les commentaires, les d\u00e9finitions de doctype et les n\u0153uds de texte.<\/p>\n<p>Cela permet de modifier le texte envelopp\u00e9 dans les limites du jeton, appel\u00e9 <strong>texte modifiable<\/strong>, sans affecter la structure d&rsquo;un document.<\/p>\n<p>Le texte modifiable est le contenu entier d&rsquo;un n\u0153ud de texte, le contenu d&rsquo;un commentaire HTML ou le contenu entre les balises d&rsquo;ouverture et de fermeture d&rsquo;\u00e9l\u00e9ments sp\u00e9ciaux, tels que les \u00e9l\u00e9ments <code>script<\/code> ou <code>style<\/code>.<\/p>\n<p>Un certain nombre de nouvelles m\u00e9thodes ont \u00e9t\u00e9 introduites :<\/p>\n<ul>\n<li><code>next_token()<\/code> &#8211; passe \u00e0 l&rsquo;\u00e9l\u00e9ment suivant dans le document<\/li>\n<li><code>get_token_type()<\/code> &#8211; obtient le type d&rsquo;\u00e9l\u00e9ment trouv\u00e9<\/li>\n<li><code>get_token_name()<\/code> &#8211; obtient le nom d&rsquo;un \u00e9l\u00e9ment<\/li>\n<li><code>get_modifiable_text()<\/code> &#8211; renvoie le contenu textuel correctement d\u00e9cod\u00e9 pour un \u00e9l\u00e9ment donn\u00e9.<\/li>\n<li><code>get_comment_type()<\/code> &#8211; obtient le type de commentaire<\/li>\n<li><code>paused_at_incomplete_token()<\/code> &#8211; retourne true si le Tag Processor atteint la fin d&rsquo;un document tronqu\u00e9 au milieu d&rsquo;un \u00e9l\u00e9ment.<\/li>\n<\/ul>\n<p>Pour un aper\u00e7u plus complet, consulte la note de d\u00e9veloppement sur les <a href=\"https:\/\/make.wordpress.org\/core\/2024\/03\/04\/updates-to-the-html-api-in-6-5\/\" target=\"_blank\" rel=\"noopener noreferrer\">mises \u00e0 jour de l&rsquo;API HTML dans la version 6.5<\/a>.<\/p>\n<h3>Unification des \u00e9diteurs de sites et d&rsquo;articles<\/h3>\n<p>Dans WordPress 6.5, les \u00e9diteurs re\u00e7oivent <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/52632\" target=\"_blank\" rel=\"noopener noreferrer\">plusieurs mises \u00e0 jour<\/a> visant \u00e0 <a href=\"https:\/\/make.wordpress.org\/core\/2024\/03\/05\/unification-of-the-site-and-post-editors-in-6-5\/\" target=\"_blank\" rel=\"noopener noreferrer\">unifier l&rsquo;interface utilisateur et le comportement<\/a>.<\/p>\n<p>Plusieurs panneaux de la colonne lat\u00e9rale ont \u00e9t\u00e9 d\u00e9plac\u00e9s du package edit-post au package <code>@wordpress\/editor<\/code> pour apporter les fonctionnalit\u00e9s correspondantes \u00e0 l&rsquo;\u00e9diteur de site :<\/p>\n<ul>\n<li>Attributs de la page (PR <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/57151\" target=\"_blank\" rel=\"noopener noreferrer\">#57151<\/a>)<\/li>\n<li>Taxonomie des messages (PR <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/57049\" target=\"_blank\" rel=\"noopener noreferrer\">#57049<\/a>)<\/li>\n<li>Ajout d&rsquo;un lien Afficher dans l&rsquo;\u00e9diteur de site pour les types de publication (PR <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/57153\" target=\"_blank\" rel=\"noopener noreferrer\">#57153<\/a>)<\/li>\n<li>Ajout du panneau Discussion \u00e0 la colonne lat\u00e9rale de l&rsquo;\u00e9diteur de site pour les types de publication qui le prennent en charge (PR <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/57150\" target=\"_blank\" rel=\"noopener noreferrer\">#57150<\/a>)<\/li>\n<li>Ajout du panneau de l&rsquo;image mise en avant (PR <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/57053\" target=\"_blank\" rel=\"noopener noreferrer\">#57053<\/a>)<\/li>\n<li>Ajout du panneau de r\u00e9vision \u00e0 l&rsquo;\u00e9diteur de site (PR <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/57010\" target=\"_blank\" rel=\"noopener noreferrer\">#57010<\/a>)<\/li>\n<\/ul>\n<p>Un autre changement permet de pr\u00e9visualiser le mod\u00e8le lors de l&rsquo;\u00e9dition d&rsquo;une page dans l&rsquo;\u00e9diteur d&rsquo;articles, comme c&rsquo;\u00e9tait d\u00e9j\u00e0 possible dans l&rsquo;\u00e9diteur de site, et vous pouvez <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/52674\" target=\"_blank\" rel=\"noopener noreferrer\">activer\/d\u00e9sactiver la pr\u00e9visualisation du mod\u00e8le<\/a> \u00e0 partir de la colonne lat\u00e9rale de la page R\u00e9glages.<\/p>\n<h3>Am\u00e9liorations des performances<\/h3>\n<p>Plus de 110 <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/57935\" target=\"_blank\" rel=\"noopener noreferrer\">am\u00e9liorations des performances<\/a> ont permis d&rsquo;augmenter consid\u00e9rablement la vitesse et l&rsquo;efficacit\u00e9 de l&rsquo;\u00e9diteur d&rsquo;articles et de l&rsquo;\u00e9diteur de site. Les temps de chargement sont d\u00e9sormais deux fois plus rapides qu&rsquo;avec la version 6.4, et la vitesse de traitement des entr\u00e9es est presque quatre fois plus rapide. De plus, l&rsquo;int\u00e9gration de la biblioth\u00e8que i18 de <a href=\"https:\/\/make.wordpress.org\/core\/2023\/11\/08\/merging-performant-translations-into-core\/\" target=\"_blank\" rel=\"noopener noreferrer\">Performant Translations<\/a> contribue \u00e0 <a href=\"https:\/\/make.wordpress.org\/core\/2024\/02\/27\/i18n-improvements-6-5-performant-translations\/\" target=\"_blank\" rel=\"noopener noreferrer\">r\u00e9duire l&rsquo;utilisation de la m\u00e9moire et le temps de chargement<\/a> des sites web traduits.<\/p>\n<h3>Am\u00e9liorations de l&rsquo;accessibilit\u00e9<\/h3>\n<p>Avec la sortie de WordPress 6.5, plus de 65 mises \u00e0 jour seront fusionn\u00e9es dans le c\u0153ur afin d&rsquo;am\u00e9liorer l&rsquo;accessibilit\u00e9 dans l&rsquo;ensemble du panneau d&rsquo;administration. Ces am\u00e9liorations comprennent le <a href=\"https:\/\/core.trac.wordpress.org\/ticket\/51870\" target=\"_blank\" rel=\"noopener noreferrer\">style de mise au point<\/a>, le <a href=\"https:\/\/core.trac.wordpress.org\/ticket\/60140\" target=\"_blank\" rel=\"noopener noreferrer\">rapport de contraste<\/a>, l&rsquo;<a href=\"https:\/\/core.trac.wordpress.org\/ticket\/32728\" target=\"_blank\" rel=\"noopener noreferrer\">ordre des menus de la personnalisation<\/a>, et plus encore.<\/p>\n<h3>Mises \u00e0 jour des Block Hooks<\/h3>\n<p>Introduits pour la premi\u00e8re fois avec WordPress 6.4, les <a href=\"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-4\/#block-hooks\">Block Hooks<\/a> permettent de placer automatiquement un bloc dans une position sp\u00e9cifique lorsqu&rsquo;un autre bloc est ajout\u00e9 au contenu.<\/p>\n<p>Les Block Hooks \u00e9taient auparavant disponibles pour les mod\u00e8les, les parties de mod\u00e8les et les compositions qui n&rsquo;avaient pas \u00e9t\u00e9 modifi\u00e9s par l&rsquo;utilisateur. D\u00e9sormais, ils peuvent \u00e9galement \u00eatre utilis\u00e9s avec des mises en page modifi\u00e9es.<\/p>\n<p>Avant WordPress 6.5, un Block Hook ne pouvait \u00eatre ajout\u00e9 qu&rsquo;avant ou apr\u00e8s le bloc Navigation. Avec cette it\u00e9ration, les Blocs Hooks peuvent \u00e9galement \u00eatre ajout\u00e9s \u00e0 un bloc Navigation en tant que premier ou dernier enfant.<\/p>\n<p>De plus, cette it\u00e9ration introduit les nouveaux filtres <code>hooked_block<\/code> et <code>hooked_block_{$hooked_block_type}<\/code>.<\/p>\n<p>Pour un aper\u00e7u plus approfondi et des exemples d&rsquo;utilisation, voir la <a href=\"https:\/\/make.wordpress.org\/core\/2024\/03\/04\/updates-to-block-hooks-in-6-5\/\" target=\"_blank\" rel=\"noopener noreferrer\">note de d\u00e9veloppement<\/a> Block Hook.<\/p>\n<h2>R\u00e9sum\u00e9<\/h2>\n<p>WordPress 6.5 apporte des tonnes de changements qui vous rendront heureux quand il s&rsquo;agit de la construction de sites et de la cr\u00e9ation de contenu.<\/p>\n<p>La nouvelle biblioth\u00e8que de polices de WordPress vous permet de g\u00e9rer les polices d&rsquo;une mani\u00e8re qui ressemble \u00e0 la gestion des m\u00e9dias dans la m\u00e9diath\u00e8que, ce qui vous donne un plus grand contr\u00f4le sur la typographie. Avec les vues de donn\u00e9es, vous pouvez rendre vos ensembles de donn\u00e9es en utilisant diff\u00e9rentes mises en page, filtres et options de recherche, ce qui am\u00e9liore l&rsquo;exp\u00e9rience globale. Avec l&rsquo;API Block Bindings et l&rsquo;API d&rsquo;interactivit\u00e9, vous pouvez offrir une exp\u00e9rience plus dynamique et personnalis\u00e9e aux utilisateurs de votre site.<\/p>\n<p>Avec toutes ces mises \u00e0 jour passionnantes, WordPress 6.5 change la donne.<\/p>\n<p>Avez-vous la nouvelle version de WordPress dans votre <a href=\"https:\/\/kinsta.com\/fr\/devkinsta\/fonctionnalites\/\">environnement de d\u00e9veloppement<\/a> ? Quelles sont les fonctionnalit\u00e9s que vous pr\u00e9f\u00e9rez dans WordPress 6.5 ? Partagez vos r\u00e9flexions dans la section des commentaires.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>WordPress 6.5 \u00ab Regina \u00bb a \u00e9t\u00e9 publi\u00e9 le 2 avril, et nous sommes ici pour vous montrer les fonctionnalit\u00e9s fantastiques qui l&rsquo;accompagnent. La version 6.5 &#8230;<\/p>\n","protected":false},"author":36,"featured_media":76571,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_kinsta_gated_content":false,"_kinsta_gated_content_redirect":"","footnotes":""},"tags":[],"topic":[1040],"class_list":["post-76570","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","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 6.5 - Kinsta\u00ae<\/title>\n<meta name=\"description\" content=\"D\u00e9couvrez notre vue globale de WordPress 6.5 : Biblioth\u00e8que de polices, DataViews, Champs personnalis\u00e9s, nouvelles API, et bien plus encore !\" \/>\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-6-5\/\" \/>\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 6.5 : Biblioth\u00e8que de polices, DataViews, Block Bindings, API d&#039;interactivit\u00e9, et bien plus encore !\" \/>\n<meta property=\"og:description\" content=\"D\u00e9couvrez notre vue globale de WordPress 6.5 : Biblioth\u00e8que de polices, DataViews, Champs personnalis\u00e9s, nouvelles API, et bien plus encore !\" \/>\n<meta property=\"og:url\" content=\"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/\" \/>\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=\"2024-03-18T09:52:45+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-04-04T09:19:14+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2024\/03\/Wp-6.5-release.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"628\" \/>\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=\"D\u00e9couvrez notre vue globale de WordPress 6.5 : Biblioth\u00e8que de polices, DataViews, Champs personnalis\u00e9s, nouvelles API, et bien plus encore !\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2024\/03\/Wp-6.5-release.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=\"30 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-6-5\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/\"},\"author\":{\"name\":\"Carlo Daniele\",\"@id\":\"https:\/\/kinsta.com\/fr\/#\/schema\/person\/962dde02ea6f5df089b5d8d0853bbc63\"},\"headline\":\"Nouveaut\u00e9s de WordPress 6.5 : Biblioth\u00e8que de polices, DataViews, Block Bindings, API d&rsquo;interactivit\u00e9, et bien plus encore !\",\"datePublished\":\"2024-03-18T09:52:45+00:00\",\"dateModified\":\"2024-04-04T09:19:14+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/\"},\"wordCount\":5891,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/fr\/#organization\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2024\/03\/Wp-6.5-release.jpg\",\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/\",\"url\":\"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/\",\"name\":\"Nouveaut\u00e9s de WordPress 6.5 - Kinsta\u00ae\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/fr\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2024\/03\/Wp-6.5-release.jpg\",\"datePublished\":\"2024-03-18T09:52:45+00:00\",\"dateModified\":\"2024-04-04T09:19:14+00:00\",\"description\":\"D\u00e9couvrez notre vue globale de WordPress 6.5 : Biblioth\u00e8que de polices, DataViews, Champs personnalis\u00e9s, nouvelles API, et bien plus encore !\",\"breadcrumb\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/#primaryimage\",\"url\":\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2024\/03\/Wp-6.5-release.jpg\",\"contentUrl\":\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2024\/03\/Wp-6.5-release.jpg\",\"width\":1200,\"height\":628},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/#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 6.5 : Biblioth\u00e8que de polices, DataViews, Block Bindings, API d&rsquo;interactivit\u00e9, 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 6.5 - Kinsta\u00ae","description":"D\u00e9couvrez notre vue globale de WordPress 6.5 : Biblioth\u00e8que de polices, DataViews, Champs personnalis\u00e9s, nouvelles API, et bien plus encore !","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-6-5\/","og_locale":"fr_FR","og_type":"article","og_title":"Nouveaut\u00e9s de WordPress 6.5 : Biblioth\u00e8que de polices, DataViews, Block Bindings, API d'interactivit\u00e9, et bien plus encore !","og_description":"D\u00e9couvrez notre vue globale de WordPress 6.5 : Biblioth\u00e8que de polices, DataViews, Champs personnalis\u00e9s, nouvelles API, et bien plus encore !","og_url":"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/","og_site_name":"Kinsta\u00ae","article_publisher":"https:\/\/www.facebook.com\/kinstafrance\/","article_published_time":"2024-03-18T09:52:45+00:00","article_modified_time":"2024-04-04T09:19:14+00:00","og_image":[{"width":1200,"height":628,"url":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2024\/03\/Wp-6.5-release.jpg","type":"image\/jpeg"}],"author":"Carlo Daniele","twitter_card":"summary_large_image","twitter_description":"D\u00e9couvrez notre vue globale de WordPress 6.5 : Biblioth\u00e8que de polices, DataViews, Champs personnalis\u00e9s, nouvelles API, et bien plus encore !","twitter_image":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2024\/03\/Wp-6.5-release.jpg","twitter_creator":"@carlodaniele","twitter_site":"@kinsta_fr","twitter_misc":{"\u00c9crit par":"Carlo Daniele","Dur\u00e9e de lecture estim\u00e9e":"30 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/#article","isPartOf":{"@id":"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/"},"author":{"name":"Carlo Daniele","@id":"https:\/\/kinsta.com\/fr\/#\/schema\/person\/962dde02ea6f5df089b5d8d0853bbc63"},"headline":"Nouveaut\u00e9s de WordPress 6.5 : Biblioth\u00e8que de polices, DataViews, Block Bindings, API d&rsquo;interactivit\u00e9, et bien plus encore !","datePublished":"2024-03-18T09:52:45+00:00","dateModified":"2024-04-04T09:19:14+00:00","mainEntityOfPage":{"@id":"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/"},"wordCount":5891,"commentCount":0,"publisher":{"@id":"https:\/\/kinsta.com\/fr\/#organization"},"image":{"@id":"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2024\/03\/Wp-6.5-release.jpg","inLanguage":"fr-FR","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/","url":"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/","name":"Nouveaut\u00e9s de WordPress 6.5 - Kinsta\u00ae","isPartOf":{"@id":"https:\/\/kinsta.com\/fr\/#website"},"primaryImageOfPage":{"@id":"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/#primaryimage"},"image":{"@id":"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2024\/03\/Wp-6.5-release.jpg","datePublished":"2024-03-18T09:52:45+00:00","dateModified":"2024-04-04T09:19:14+00:00","description":"D\u00e9couvrez notre vue globale de WordPress 6.5 : Biblioth\u00e8que de polices, DataViews, Champs personnalis\u00e9s, nouvelles API, et bien plus encore !","breadcrumb":{"@id":"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/#primaryimage","url":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2024\/03\/Wp-6.5-release.jpg","contentUrl":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2024\/03\/Wp-6.5-release.jpg","width":1200,"height":628},{"@type":"BreadcrumbList","@id":"https:\/\/kinsta.com\/fr\/blog\/wordpress-6-5\/#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 6.5 : Biblioth\u00e8que de polices, DataViews, Block Bindings, API d&rsquo;interactivit\u00e9, 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\/76570","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=76570"}],"version-history":[{"count":8,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/posts\/76570\/revisions"}],"predecessor-version":[{"id":76691,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/posts\/76570\/revisions\/76691"}],"alternate":[{"embeddable":true,"hreflang":"en","title":"English","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/76570\/translations\/en"},{"embeddable":true,"hreflang":"it","title":"Italian","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/76570\/translations\/it"},{"embeddable":true,"hreflang":"pt","title":"Portuguese","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/76570\/translations\/pt"},{"embeddable":true,"hreflang":"fr","title":"French","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/76570\/translations\/fr"},{"embeddable":true,"hreflang":"de","title":"German","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/76570\/translations\/de"},{"embeddable":true,"hreflang":"ja","title":"Japanese","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/76570\/translations\/jp"},{"embeddable":true,"hreflang":"nl","title":"Dutch","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/76570\/translations\/nl"},{"embeddable":true,"hreflang":"es","title":"Spanish","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/76570\/translations\/es"},{"href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/76570\/tree"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/media\/76571"}],"wp:attachment":[{"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/media?parent=76570"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/tags?post=76570"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/topic?post=76570"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}