Et pour ceux qui pr\u00e9f\u00e8rent le contenu vid\u00e9o, nous avons \u00e9galement un cours vid\u00e9o gratuit : D\u00e9veloppement de blocs personnalis\u00e9s pour Gutenberg<\/a>.<\/p>\n Et oui, vous pouvez booster vos attentes professionnelles avec des comp\u00e9tences en d\u00e9veloppement Gutenberg, mais vous n’avez pas n\u00e9cessairement besoin d’\u00eatre un d\u00e9veloppeur pour cr\u00e9er des mises en page avanc\u00e9es sur votre site WordPress.<\/p>\n Les utilisateurs de WordPress peuvent profiter de puissantes fonctionnalit\u00e9s qui leur permettent de cr\u00e9er facilement des mises en page de blocs avanc\u00e9s sans aucun probl\u00e8me. Dans cet article, nous allons concentrer notre attention sur les compositions de blocs<\/strong>.<\/p>\n Les compositions blocs<\/a> sont des groupes de blocs pr\u00e9-construits que vous pouvez ajouter \u00e0 votre contenu et personnaliser en utilisant les m\u00eames outils de conception que ceux disponibles pour les blocs inclus.<\/p>\n Elles ont \u00e9t\u00e9 introduites pour la premi\u00e8re fois avec WordPress 5.5<\/a> pour permettre aux administrateurs de sites et aux cr\u00e9ateurs de contenu d’inclure des structures complexes pr\u00eates \u00e0 l’emploi de blocs imbriqu\u00e9s<\/strong> dans leur contenu en quelques clics seulement.<\/p>\n Les th\u00e8mes de blocs fournissent g\u00e9n\u00e9ralement quelques mod\u00e8les de blocs que vous pouvez ajouter \u00e0 votre contenu directement \u00e0 partir de l’insertion de blocs. Le nouveau th\u00e8me par d\u00e9faut fourni avec WordPress 6.7<\/a>, Twenty Twenty-Five<\/a>, comprend plus de 70 compositions de blocs.<\/p>\n Et vous n’\u00eates pas limit\u00e9 aux compositions fournies par votre th\u00e8me.<\/p>\n Tout d’abord, vous trouverez des tonnes de compositions de blocs pr\u00eates \u00e0 l’emploi dans la galerie<\/a> officielle des compositions\u00a0 <\/a>de WordPress.<\/p>\n De plus, vous pouvez cr\u00e9er un nombre illimit\u00e9 de compositions en utilisant l’API des compositions ou les outils d’\u00e9dition disponibles dans l’\u00e9diteur de blocs. Vous pouvez utiliser les compositions personnalis\u00e9es en interne sur votre site web, les exporter vers d’autres sites web ou les partager publiquement sur la galerie de compositions.<\/p>\n Depuis WordPress 6.3<\/a>, un tout nouveau syst\u00e8me de compositions rend le processus de cr\u00e9ation de mod\u00e8les plus flexible et plus simple. Il est d\u00e9sormais plus facile de savoir quel type de mise en page vous construisez et quel effet vos personnalisations ont sur votre site web.<\/p>\n Il existe deux types principaux de compositions de blocs :<\/p>\n La principale diff\u00e9rence entre les deux types est que toutes les modifications apport\u00e9es \u00e0 une composition synchronis\u00e9e s’appliquent \u00e0 toutes les occurrences de la composition sur l’ensemble de votre site web. En revanche, les modifications apport\u00e9es \u00e0 une composition de bloc standard n’affectent qu’une instance sp\u00e9cifique de la composition.<\/p>\n Mais il y a bien d’autres choses \u00e0 dire sur les blocs de compositions. Vous vous demandez comment fonctionne ce syst\u00e8me et comment tirer parti des nouvelles fonctionnalit\u00e9s d’\u00e9dition ajout\u00e9es dans les versions les plus r\u00e9centes de WordPress ? Nous allons nous plonger dans le vif du sujet.<\/p>\n Les compositions pr\u00e9-construits sont des compositions de blocs \u00ab non synchronis\u00e9es \u00bb, ce qui signifie que les modifications que vous apportez \u00e0 une composition de bloc n’affecteront que l’instance sp\u00e9cifique que vous \u00eates en train d’\u00e9diter et ne s’appliqueront pas aux autres instances que vous avez pu ajouter \u00e0 d’autres articles ou pages de votre site web.<\/strong><\/p>\n Vous pouvez utiliser des compositions pr\u00e9-construites pour inclure des mises en page de blocs que vous pouvez personnaliser sur place, en modifiant les images, le texte, les styles ou en ajoutant\/supprimant des \u00e9l\u00e9ments.<\/p>\n Une fois que vous avez cr\u00e9\u00e9 une composition de bloc personnalis\u00e9, vous pouvez l’ajouter n’importe o\u00f9 sur votre site web et la personnaliser en quelques clics \u00e0 l’aide des commandes int\u00e9gr\u00e9es de l’\u00e9diteur.<\/p>\n Vous pouvez parcourir et ins\u00e9rer des mod\u00e8les de blocs pr\u00e9d\u00e9finis \u00e0 partir de l’onglet Mod\u00e8les<\/strong> dans l’Ins\u00e9reur de blocs<\/a> ou naviguer vers la section d’administration des Mod\u00e8les<\/a> dans l’\u00c9diteur de site. Vous pouvez \u00e9galement d\u00e9couvrir de nouveaux mod\u00e8les dans la Galerie des mod\u00e8les<\/a>.<\/p>\n Dans la galerie, vous pouvez choisir une composition, cliquer sur le bouton Copier la composition<\/strong> et le coller directement dans votre contenu.<\/p>\n Vous \u00eates libre de personnaliser le groupe de blocs inclus dans la composition sans affecter la composition enregistr\u00e9e ou toute autre instance sur votre site web.<\/p>\n\n Comme mentionn\u00e9 ci-dessus, avec WordPress 6.3, le syst\u00e8me de compositions a \u00e9t\u00e9 rationalis\u00e9 et est devenu plus coh\u00e9rent.<\/p>\n Il est d\u00e9sormais plus facile pour l’utilisateur de cr\u00e9er des compositions personnalis\u00e9es directement \u00e0 partir de l’\u00e9diteur de blocs et de les g\u00e9rer \u00e0 partir du tableau de bord de WordPress sans avoir \u00e0 s’occuper du code.<\/p>\n Vous pouvez maintenant construire :<\/p>\n La diff\u00e9rence entre les deux types de compositions est que toutes les modifications apport\u00e9es \u00e0 une composition synchronis\u00e9e seront appliqu\u00e9es \u00e0 toutes les occurrences de ce bloc sur l’ensemble de votre site web.<\/strong><\/p>\n \u00c0 l’inverse, les modifications apport\u00e9es \u00e0 une composition de bloc non synchronis\u00e9e n’affecteront que cette instance sp\u00e9cifique de la& composition et ne s’appliqueront pas aux autres instances que vous avez pu ajouter \u00e0 d’autres articles ou pages de votre site web.<\/strong><\/p>\n Du point de vue du d\u00e9veloppeur, les compositions de blocs personnalis\u00e9es sont enregistr\u00e9es dans la base de donn\u00e9es de WordPress en tant que types de publication personnalis\u00e9s Gr\u00e2ce au nouveau syst\u00e8me de gestion des compositions, vous pouvez d\u00e9sormais cr\u00e9er des compositions de blocs synchronis\u00e9es et non synchronis\u00e9es directement \u00e0 partir de l’\u00e9diteur du site ou de l’article. Il vous suffit de concevoir votre disposition de bloc, de s\u00e9lectionner les blocs et de cliquer sur l’ic\u00f4ne \u00e0 trois points dans la barre d’outils des blocs. Choisissez ensuite Cr\u00e9er une composition<\/strong> dans le menu d\u00e9roulant.<\/p>\n Dans l’exemple ci-dessous, nous cr\u00e9ons une composition synchronis\u00e9e \u00e0 partir d’un bloc Groupe, d’un titre, d’un paragraphe et d’un bouton.<\/p>\n Lorsque vous cliquez sur Cr\u00e9er une composition<\/strong>, vous \u00eates invit\u00e9 \u00e0 indiquer le nom et les cat\u00e9gories de votre composition et \u00e0 d\u00e9cider si elle est synchronis\u00e9e ou non.<\/p>\n Et c’est tout. Votre composition synchronis\u00e9e est d\u00e9sormais r\u00e9pertori\u00e9e dans la section d’administration des compositions <\/strong>de l’\u00e9diteur de site, sous Mes compositions.<\/strong><\/p>\n Ici, vous pouvez pr\u00e9visualiser vos compositions et v\u00e9rifier l’\u00e9tat de la synchronisation des compositions.<\/p>\n Vous pouvez ensuite lancer l’\u00e9diteur de compositions et personnaliser votre bloc de compositions.<\/p>\n Une fois encore, les modifications apport\u00e9es aux compositions synchronis\u00e9es ont une incidence sur toutes les occurrences de cette composition sur votre site web. Les modifications apport\u00e9es aux compositions standard n’affecteront que les instances futures de la composition.<\/p>\n Ceci est possible parce que WordPress g\u00e8re les deux types de compositions diff\u00e9remment. Pour comprendre la diff\u00e9rence, cr\u00e9ez une copie non synchronis\u00e9e de votre composition personnalis\u00e9e, puis cr\u00e9ez un nouvel article ou une nouvelle page et ajoutez les deux compositions. Une fois cela fait, allez dans l’\u00e9diteur de code et v\u00e9rifiez le code.<\/p>\n Le bloc synchronis\u00e9 est g\u00e9n\u00e9r\u00e9 par le code suivant :<\/p>\n Cela signifie que WordPress va chercher l’article avec l’ID Le deuxi\u00e8me bloc n’est pas identifi\u00e9 par un identifiant. L’\u00e9diteur de code contient l’ensemble des balises qui composent la composition.<\/p>\n Les compositions synchronis\u00e9es sont particuli\u00e8rement utiles pour construire des \u00e9l\u00e9ments que vous souhaitez inclure sur plusieurs pages de votre site web et\/ou sur diff\u00e9rents sites web. Pensez aux appels \u00e0 l’action, aux banni\u00e8res promotionnelles, aux tableaux de prix, etc.<\/p>\n Comme nous l’avons mentionn\u00e9, WordPress consid\u00e8re les compositions de blocs personnalis\u00e9es comme des types de publication Une fois que vous avez cr\u00e9\u00e9 vos compositions, vous pouvez les g\u00e9rer \u00e0 partir de l’\u00e9cran d’administration des compositions<\/strong>. Vous pouvez acc\u00e9der \u00e0 cette page de plusieurs fa\u00e7ons :<\/p>\n Dans l’\u00e9cran Compositions, vous pouvez<\/p>\n Dans l’\u00e9diteur de site, vous pouvez \u00e9galement dupliquer et renommer vos compositions.<\/p>\n Introduit avec WordPress 6.6<\/a>, le remplacement de compositions synchronis\u00e9es est un troisi\u00e8me type de pattern qui tire parti de l’API Block Bindings<\/a> pour obtenir les caract\u00e9ristiques des deux types de compositions.<\/p>\n Les surcharges de compositions synchronis\u00e9es vous permettent de construire des compositions de blocs qui conservent la m\u00eame structure partout sur votre site web et qui changent en synchronisation avec les personnalisations apport\u00e9es \u00e0 la structure et au style de la composition dans l’\u00e9diteur de site. En cela, les remplacements de compositions sont similaires aux compositions synchronis\u00e9es.<\/p>\n Cependant, les d\u00e9rogations sont \u00e9galement similaires aux compositions non synchronis\u00e9es car vous pouvez modifier le contenu de blocs sp\u00e9cifiques inclus dans la composition sans affecter les autres instances de la m\u00eame composition sur le site.<\/p>\n Les substitutions de compositions sont donc des compositions synchronis\u00e9es avec des \u00e9l\u00e9ments individuels non synchronis\u00e9s.<\/strong><\/p>\n Voyons maintenant comment cr\u00e9er une surcharge de composition.<\/p>\n \u00c9tape 1 :<\/strong> Allez dans Compositions<\/strong> et dupliquez l’une des compositions existantes, comme la composition Pricing, 2 colonnes<\/strong> du th\u00e8me par d\u00e9faut Twenty Twenty-Five. Ajoutez un nom et d\u00e9finissez la copie comme \u00e9tant une composition synchronis\u00e9e.<\/p>\n \u00c9tape 2 :<\/strong> Ouvrez Mes compositions<\/strong> et trouvez votre nouveau composition synchronis\u00e9e. Ouvrez-la et s\u00e9lectionnez l’un des blocs que vous devez remplacer, comme le bloc Heading.<\/p>\n Allez dans la colonne lat\u00e9rale des r\u00e9glages des blocs et descendez jusqu’\u00e0 la section Avanc\u00e9<\/strong>. Vous y trouverez Activer les remplacements.<\/strong><\/p>\n Lorsque vous cliquez sur le bouton, vous \u00eates invit\u00e9 \u00e0 ajouter un nom pour la d\u00e9rogation.<\/p>\n \u00c9tape 3 :<\/strong> r\u00e9p\u00e9tez le m\u00eame processus pour chaque bloc que vous souhaitez remplacer. Lorsque vous avez termin\u00e9, cr\u00e9ez un nouvel article ou une nouvelle page et incluez votre composition personnalis\u00e9e.<\/p>\n \u00c9tape 4 :<\/strong> Dans l’\u00e9diteur d’articles, modifiez le contenu des blocs \u00e0 remplacer, enregistrez l’article et v\u00e9rifiez le r\u00e9sultat sur le site.<\/p>\n Vous avez peut-\u00eatre remarqu\u00e9 que lorsque vous modifiez une instance d’une composition de remplacement dans l’\u00e9diteur d’articles, la colonne lat\u00e9rale des r\u00e9glages du bloc affiche les champs qui peuvent \u00eatre modifi\u00e9s. Dans l’exemple ci-dessus, nous avons rendu l’en-t\u00eate et certains paragraphes modifiables.<\/p>\n Vous pouvez ajouter n’importe quel nombre de substitutions de compositions n’importe o\u00f9 sur votre site web, et chaque instance affichera la m\u00eame structure d’origine, mais sera pr\u00eate pour votre personnalisation.<\/p>\n Ouvrez maintenant votre composition dans l’\u00e9diteur de site et passez \u00e0 l’\u00e9diteur de code. Le code doit ressembler \u00e0 ce qui suit :<\/p>\n Dans le d\u00e9limiteur de bloc, vous remarquerez la propri\u00e9t\u00e9 Maintenant, dans l’\u00e9diteur d’articles, passez \u00e0 l’\u00e9diteur de code<\/strong>. Le code doit \u00eatre similaire \u00e0 ce qui suit :<\/p>\n Ici, vous verrez une r\u00e9f\u00e9rence \u00e0 la composition de bloc et un ensemble de propri\u00e9t\u00e9s pour chaque bloc d\u00e9fini comme modifiable.<\/p>\n Notez que, comme les remplacements de compositions sont une impl\u00e9mentation de l’API Block Bindings, vous ne pouvez remplacer que les blocs pris en charge. \u00c0 l’heure o\u00f9 nous \u00e9crivons ces lignes, les substitutions de composition prennent en charge les blocs d’en-t\u00eate<\/strong>, de paragraphe<\/strong>, d’image<\/strong> et de bouton<\/strong>.<\/p>\n Avant l’\u00e8re Gutenberg<\/a>, les th\u00e8mes<\/a> et les mod\u00e8les WordPress<\/a> \u00e9taient principalement construits en PHP. Une solide connaissance des th\u00e8mes enfants<\/a>, de la hi\u00e9rarchie des mod\u00e8les<\/a> et des principaux langages de d\u00e9veloppement frontaux<\/a> \u00e9taient des exigences de base pour cr\u00e9er ou personnaliser les mod\u00e8les. Mais les choses ont chang\u00e9 avec l’introduction des th\u00e8mes de blocs<\/a>.<\/p>\n Dans les th\u00e8mes en bloc et les th\u00e8mes classiques qui ont opt\u00e9 pour cette fonctionnalit\u00e9, vous pouvez facilement cr\u00e9er ou personnaliser une composition ou une partie de composition dans l’interface de l’\u00e9diteur de site. Aucune comp\u00e9tence en mati\u00e8re de d\u00e9veloppement n’est requise, \u00e0 moins, bien s\u00fbr, que vous ne d\u00e9cidiez de devenir d\u00e9veloppeur de th\u00e8mes.<\/p>\n Un mod\u00e8le de bloc<\/a> est une liste d’\u00e9l\u00e9ments de bloc<\/strong>. Le titre du site, le logo et la navigation sont des exemples d’\u00e9l\u00e9ments de bloc.<\/p>\n Les parties de composition<\/strong> sont des sections sp\u00e9cifiques d’une page qui peuvent \u00eatre visualis\u00e9es \u00e0 plusieurs endroits, comme un en-t\u00eate et un pied de page, et qui peuvent \u00eatre affich\u00e9es sur chaque page de votre site web WordPress.<\/p>\n Vous pouvez cr\u00e9er et modifier les parties de composition via l’interface de l’\u00e9diteur de site, o\u00f9 vous pouvez utiliser tous les outils d’\u00e9dition disponibles pour les blocs.<\/p>\n Cependant, contrairement aux compositions de blocs, les parties de mod\u00e8les sont destin\u00e9es \u00e0 des zones du site qui ne changent pas fr\u00e9quemment.<\/p>\n Pour r\u00e9sumer, voici les principales diff\u00e9rences entre ces trois types de mod\u00e8les :<\/p>\n Comme nous l’avons mentionn\u00e9 pr\u00e9c\u00e9demment, WordPress 6.3 a introduit un nouveau syst\u00e8me de gestion des compositions de mod\u00e8les. Il est d\u00e9sormais plus facile de cr\u00e9er des compositions de blocs synchronis\u00e9es ou non synchronis\u00e9es sans quitter l’interface de l’\u00e9diteur. Vous pouvez \u00e9galement importer et exporter des compositions personnalis\u00e9es en quelques clics depuis votre tableau de bord WordPress.<\/p>\n Cependant, WordPress propose \u00e9galement d’autres moyens de cr\u00e9er des blocs de compositions pour les d\u00e9veloppeurs de th\u00e8mes et d’extensions.<\/p>\n En plus des compositions de blocs, WordPress 5.5<\/a> a introduit une nouvelle API permettant aux d\u00e9veloppeurs de \u00ab cr\u00e9er des blocs de contenu pr\u00e9con\u00e7us qui peuvent \u00eatre facilement ins\u00e9r\u00e9s dans les articles, les pages, les types d’articles personnalis\u00e9s et les mod\u00e8les \u00bb La nouvelle API propose les fonctions \u00c0 partir de WordPress 6.0<\/a>, vous pouvez \u00e9galement enregistrer des blocs de contenu dans un fichier PHP.<\/p>\n Ainsi, \u00e0 l’heure o\u00f9 nous \u00e9crivons ces lignes, vous avez deux fa\u00e7ons de cr\u00e9er une composition de bloc.<\/p>\n La premi\u00e8re m\u00e9thode est principalement destin\u00e9e aux d\u00e9veloppeurs WordPress, mais elle est suffisamment simple pour \u00eatre utilis\u00e9e par des d\u00e9veloppeurs non avanc\u00e9s.<\/p>\n Si vous optez pour la premi\u00e8re m\u00e9thode, vous pouvez cr\u00e9er une composition de bloc en utilisant les deux nouvelles fonctions Tout d’abord, choisissez une cat\u00e9gorie pour votre composition. Avec les derni\u00e8res versions de WordPress, de nouvelles cat\u00e9gories de compositions ont \u00e9t\u00e9 ajout\u00e9es et certaines cat\u00e9gories existantes ont \u00e9t\u00e9 modifi\u00e9es.<\/p>\n Pour obtenir la liste de toutes les cat\u00e9gories enregistr\u00e9es, ouvrez l’\u00e9diteur Post et collez le code suivant dans la console du navigateur :<\/p>\n Dans WordPress 6.7 avec le th\u00e8me Twenty Twenty-Five actif, vous obtiendrez la liste suivante de cat\u00e9gories de compositions :<\/p>\n Si votre composition de bloc n’entre dans aucune des cat\u00e9gories par d\u00e9faut, vous pouvez \u00e9galement enregistrer une nouvelle cat\u00e9gorie \u00e0 l’aide de la fonction Cette fonction accepte deux arguments :<\/p>\n Un exemple vous aidera \u00e0 mieux comprendre comment enregistrer une nouvelle cat\u00e9gorie de composition :<\/p>\n Une fois la cat\u00e9gorie de composition enregistr\u00e9e, l’\u00e9tape suivante consiste \u00e0 enregistrer la composition de bloc ellei-m\u00eame. Vous enregistrerez la composition de bloc \u00e0 l’aide de la fonction d’aide Cette fonction prend deux arguments :<\/p>\n Voici une liste des propri\u00e9t\u00e9s actuellement disponibles pour la composition :<\/p>\n Voici un exemple d’utilisation de Dans ce code, nous avons utilis\u00e9 la propri\u00e9t\u00e9 Qu’est-ce qu’une composition mod\u00e8le de bloc ?<\/h2>\n
![\"Compositions](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/10\/block-patterns-in-ttf.jpg\")
\n
Compositions de blocs pr\u00e9-construites<\/h3>\n
![\"L'insertion](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/10\/block-inserter-with-patterns.jpg\")
![\"Exploring](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/10\/pattern-directory.jpg\")
![\"Copier](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/10\/copy-pattern.jpg\")
![\"Collez](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/10\/paste-pattern.jpg\")
Compositions de blocs synchronis\u00e9es et non synchronis\u00e9es<\/h3>\n
\n
wp_block<\/code>, et un champ m\u00e9ta wp_pattern_sync_status<\/code> stocke l’\u00e9tat de synchronisation d’une composition.<\/p>\n![\"Le](\"https:\/\/kinsta.com\/wp-content\/uploads\/2023\/07\/wp-block-sync-status.png\")
wp_pattern_sync_status<\/code> est utilis\u00e9 pour stocker l’\u00e9tat de synchronisation d’une composition de bloc<\/figcaption><\/figure>\n![\"Cr\u00e9er](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/10\/create-pattern.png\")
![\"Cr\u00e9er](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/10\/add-new-pattern.png\")
![\"Compositions](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/10\/my-patterns.png\")
![\"Aper\u00e7u](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/10\/preview-my-pattern.png\")
![\"Une](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/10\/my-pattern.png\")
![\"Comparaison](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/10\/patterns-in-code-editor.png\")
<\/code><\/pre>\n512<\/code> pour g\u00e9n\u00e9rer le HTML \u00e0 afficher \u00e0 l’\u00e9cran.<\/p>\nwp_block<\/code> et, en tant que tels, les stocke dans la table wp_posts<\/code>.<\/p>\n\n
![\"\u00c9cran](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/10\/patterns-admin-screen.png\")
\n
Remplacements de compositions synchronis\u00e9es<\/h3>\n
![\"Dupliquer](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/10\/duplicate-pattern.jpg\")
![\"Activer](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/10\/enable-overrides.jpg\")
![\"Une](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/10\/disable-overrides-button.jpg\")
![\"S\u00e9lectionnez](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/10\/adding-pattern.jpg\")
![\"Une](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/10\/edit-pattern-overrides.jpg\")
<!-- wp:heading \n{\n\t\"textAlign\":\"center\",\n\t\"metadata\":{\n\t\t\"name\":\"Heading\",\n\t\t\"bindings\":{\n\t\t\t\"__default\":{\n\t\t\t\t\"source\":\"core\/pattern-overrides\"\n\t\t\t}\n\t\t}\n\t},\n\t\"align\":\"wide\"\n} \n-->\n<h2 class=\"wp-block-heading alignwide has-text-align-center\">Pricing<\/h2>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph \n{\n\t\"align\":\"center\",\n\t\"metadata\":{\n\t\t\"name\":\"Subtitle\",\n\t\t\"bindings\":{\n\t\t\t\"__default\":{\n\t\t\t\t\"source\":\"core\/pattern-overrides\"\n\t\t\t}\n\t\t}\n\t}\n} \n-->\n<p class=\"has-text-align-center\">Cancel or pause anytime.<\/p>\n<!-- \/wp:paragraph -->\n<\/code><\/pre>\nmetadata.bindings<\/code>. Celle-ci rend les blocs Titre<\/strong> et Paragraphe<\/strong> modifiables. La propri\u00e9t\u00e9 __default<\/code> indique \u00e0 WordPress de connecter tous les attributs pris en charge<\/a> \u00e0 une source sp\u00e9cifique, \u00e0 savoir \"core\/pattern-overrides\"<\/code>.<\/p>\n<!-- wp:block \n{\n\t\"ref\":518,\n\t\"content\":{\n\t\t\"Heading\":{\n\t\t\t\"content\":\"Choose your plan\"\n\t\t},\n\t\t\"Subtitle\":{\n\t\t\t\"content\":\"Try our services with no risk thanks to our 30-day guarantee\"\n\t\t},\n\t\t\"Plan 1 title\":{\n\t\t\t\"content\":\"Starter\"\n\t\t},\n\t\t\"Plan 2 title\":{\n\t\t\t\"content\":\"Business\"\n\t\t}\n\t}\n} \n\/--><\/code><\/pre>\nParties de la composition<\/h3>\n
![\"Ajouter](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/10\/add-new-template-part.png\")
![\"Ajouter](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/10\/add-new-template-part-modal.png\")
![\"\u00c9dition](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/10\/edit-template-part.png\")
Diff\u00e9rences entre les compositions et les parties de mod\u00e8le<\/h3>\n
Compositions de blocs pr\u00e9-construites<\/h4>\n
\n
Compositions de blocs personnalis\u00e9es<\/h4>\n
\n
wp_posts<\/code> en tant que type de publication wp_block<\/code>.<\/li>\nParties du mod\u00e8le<\/h4>\n
\n
Comment cr\u00e9er des compositions de blocs pour les th\u00e8mes et les plugins<\/h2>\n
register_block_pattern<\/code> et register_block_pattern_category<\/code> pour enregistrer des compositions de blocs et des cat\u00e9gories de mod\u00e8les.<\/p>\n\n
register_block_pattern<\/code>,<\/li>\nCr\u00e9er une composition de bloc avec un plugin<\/h3>\n
register_block_pattern<\/code> et register_block_pattern_category<\/code> dans le fichier PHP d’une extension<\/a> ou dans le fichier<\/a> functions.php<\/a> de votre th\u00e8me.<\/p>\nS\u00e9lectionnez ou enregistrez une cat\u00e9gorie de composition<\/h4>\n
wp.data.select('core').getBlockPatternCategories()<\/code><\/pre>\n![\"Cat\u00e9gories](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/10\/pattern-categories-wp-67.jpg\")
register_block_pattern_category<\/code> <\/a>.<\/p>\n\n
$category_name<\/code>: Le nom de la cat\u00e9gorie de la composition, y compris l’espace de noms.<\/li>\n$category_properties<\/code>: Un tableau de propri\u00e9t\u00e9s de la cat\u00e9gorie.<\/li>\n<\/ul>\nif ( function_exists( 'register_block_pattern_category' ) ) {\n\tfunction my_plugin_register_pattern_category() {\n\t\tregister_block_pattern_category( \n\t\t\t'my-pattern-category', \n\t\t\tarray(\n\t\t\t\t'label' => __( 'My Pattern Category', 'my-plugin-text-domain' ),\n\t\t\t\t'description' => __( 'Simple call to action with a header, an image, a paragraph, and a button.' ),\n\t\t\t)\n\t\t);\n\t}\n\tadd_action( 'init', 'my_plugin_register_pattern_category' );\n}<\/code><\/pre>\n\nEnregistrer une composition de bloc<\/h4>\n
register_block_pattern<\/code> <\/a> en proc\u00e9dant comme suit :<\/p>\nfunction my_plugin_register_block_pattern() {\n\tregister_block_pattern( 'prefix\/pattern-name', $props );\n}\nadd_action( 'init', 'my_plugin_register_block_pattern' );<\/code><\/pre>\n\n
$pattern_name<\/code>: Un nom lisible par une machine<\/strong> sous la forme de namespace\/pattern-name<\/code>.<\/li>\n$pattern_properties<\/code>: Un tableau de propri\u00e9t\u00e9s pour a composition.<\/li>\n<\/ul>\n\n
title<\/code> (obligatoire) : Un titre lisible par l’homme<\/strong> pour la composition.<\/li>\ncontent<\/code> (obligatoire) : Un titre lisible par l’homme pour la composition : Le balisage HTML de la composition.<\/li>\ndescription<\/code>: Un texte d\u00e9crivant la composition dans l’outil d’insertion. Une description est facultative mais recommand\u00e9e car elle aide les utilisateurs \u00e0 trouver la composition.<\/li>\ncategories<\/code>: Un tableau d’une ou plusieurs cat\u00e9gories de compositions enregistr\u00e9es. Vous devez enregistrer une cat\u00e9gorie avant de pouvoir l’utiliser ici (voir la section pr\u00e9c\u00e9dente).<\/li>\nkeywords<\/code>: Un tableau de mots-cl\u00e9s qui aident les utilisateurs \u00e0 trouver la composition.<\/li>\nviewportWidth<\/code>: Un nombre entier sp\u00e9cifiant la largeur de la composition dans l’aper\u00e7u.<\/li>\nblockTypes<\/code>: Un tableau facultatif de types de blocs qui seront utilis\u00e9s avec la composition.<\/li>\npostTypes<\/code>: Un tableau de types de publications qui seront autoris\u00e9s \u00e0 utiliser la composition.<\/li>\ntemplateTypes<\/code>: Un tableau des types de compositions pour lesquels le mod\u00e8le a un sens (disponible depuis WordPress 6.2<\/a>).<\/li>\ninserter<\/code>: Un bool\u00e9en pour d\u00e9terminer si la composition doit \u00eatre visible dans l’insertion de blocs. Mettez la valeur \u00e0 false<\/code> pour cacher la composition. Par d\u00e9faut, toutes les composition apparaissent dans l’insertion de blocs.<\/li>\nsource<\/code> (facultatif) : Une cha\u00eene qui identifie la source de la composition. Passez la cha\u00eene plugin<\/code> si vous enregistrez la composition \u00e0 partir d’une extension. Pour un th\u00e8me, passez la cha\u00eene theme<\/code>.<\/li>\n<\/ul>\nregister_block_pattern<\/code>:<\/p>\nif ( function_exists( 'register_block_pattern' ) ) {\n\tfunction my_plugin_register_block_pattern() {\n\t\tregister_block_pattern( \n\t\t\t'my-plugin\/my-block-pattern', \n\t\t\tarray(\n\t\t\t\t'title'\t\t\t=> _x( 'My awesome pattern', 'Block pattern title', 'my-plugin-text-domain' ),\n\t\t\t\t'categories'\t=> array( 'my-pattern-category' ),\n\t\t\t\t'postTypes'\t\t=> array( 'post' ),\n\t\t\t\t'content'\t\t=> '<p>My awesome block pattern<\/p>'\n\t\t\t) \n\t\t);\n\t}\n\tadd_action( 'init', 'my_plugin_register_block_pattern' );\n}<\/code><\/pre>\npostTypes<\/code> pour limiter la disponibilit\u00e9 de la composition aux articles de blog ordinaires. Cependant, vous avez la possibilit\u00e9 de d\u00e9finir une valeur diff\u00e9rente pour