Comment créer un bloc réutilisable dans l'éditeur de blocs WordPress (Gutenberg)

Les blocs réutilisables, désormais appelés modèles, vous permettent d'enregistrer n'importe quel bloc de contenu et de le réutiliser dans d'autres articles et pages de votre site web.

Qu'il s'agisse d'une section d'appel à l'action, d'un formulaire d'abonnement ou d'une bannière magnifiquement conçue, vous pouvez la créer une fois, l'enregistrer en tant que modèle et l'insérer partout où vous en avez besoin en quelques clics.

Cela permet non seulement d'économiser du temps et des efforts, mais aussi d'assurer la cohérence du design sur l'ensemble de votre site.

Chez WPBeginner, nous utilisons des modèles pour ajouter le même appel à l'action à chaque article de notre site web. Cela rationalise notre flux de travail, car nos rédacteurs n'ont pas à passer du temps à réfléchir à la manière de conclure leurs articles. Ils peuvent simplement insérer le bloc d'appel à l'action réutilisable et passer à la tâche suivante.

Dans cet article, nous allons vous montrer comment créer facilement un bloc réutilisable dans l'éditeur de blocs WordPress, étape par étape.

Qu'est-ce qu'un bloc réutilisable (modèle) dans WordPress ?

Les modèles, précédemment appelés blocs réutilisables, sont des fonctionnalités puissantes de l'éditeur de blocs WordPress qui vous permettent d'enregistrer une collection de blocs pour une réutilisation facile sur l'ensemble d'un site web.

De nombreux blogueurs ajoutent souvent les mêmes extraits de contenu dans plusieurs articles, tels que des appels à l'action à la fin de l'article de blog ou des liens pour suivre le blog WordPress sur les réseaux sociaux.

Beaucoup d'utilisateurs enregistrent simplement leurs extraits de contenu réutilisables sous forme de fichiers texte sur leur ordinateur, puis les copient et les collent lorsque nécessaire.

Cependant, l'éditeur de blocs Gutenberg résout ce problème avec la fonctionnalité de modèles.

Vous pouvez facilement créer un modèle à l'aide d'un bloc et l'enregistrer dans l'éditeur de publication. Ce bloc peut ensuite être inséré dans n'importe quelle publication ou page WordPress sans avoir à recréer le contenu à partir de zéro.

Cela permet de gagner du temps et vous permet également de maintenir un design ou un style cohérent sur les pages ou les publications. Voici quelques scénarios où un bloc réutilisable (modèle) peut vous aider à travailler plus efficacement :

• Demander aux utilisateurs de vous suivre sur les réseaux sociaux à la fin de chaque article
• Ajouter des boutons d'appel à l'action dans vos publications et pages WordPress
• Enregistrer et réutiliser des tableaux
• Ajouter rapidement des formulaires de commentaires à vos pages
• Ajouter manuellement des bannières d'affiliation en ligne
• Enregistrer et réutiliser des blocs imbriqués

Cela dit, examinons comment créer facilement un bloc réutilisable dans l'éditeur de blocs WordPress.

Comment créer un modèle (bloc réutilisable) dans l'éditeur Gutenberg de WordPress

Tous les blocs Gutenberg sont des éléments de contenu individuels dans l'éditeur WordPress qui peuvent également être enregistrés sous forme de modèles. Tout d'abord, vous devez ouvrir une publication existante ou nouvelle pour commencer à créer un bloc réutilisable.

Une fois que vous avez fait cela, cliquez sur le bouton « Ajouter un bloc » (+) dans le coin supérieur gauche de l'écran.

Cela ouvrira le menu des blocs, où vous pourrez ajouter un bloc que vous souhaitez réutiliser sur plusieurs pages ou publications. Ensuite, ajoutez le contenu au bloc selon vos préférences.

Pour ce tutoriel, nous choisirons le bloc Paragraphe pour créer un modèle pour un extrait de contenu d'appel à l'action (CTA).

Vous pouvez styliser davantage votre bloc en utilisant différentes options de la barre d'outils du bloc en haut ou du panneau du bloc à droite.

De plus, vous pouvez ajouter des liens vers vos profils de réseaux sociaux et ajouter différents éléments typographiques.

Une fois cela fait, cliquez sur le bouton du menu à trois points dans la barre d'outils du bloc.

Cela ouvrira un menu déroulant, où vous devrez sélectionner l'option « Créer un modèle ».

Ensuite, il vous sera demandé de saisir un nom pour le modèle. Nous vous recommandons d'utiliser un nom qui vous aide à identifier rapidement le bloc et ce qu'il fait.

Après cela, vous pouvez sélectionner l'une des catégories par défaut dans le menu déroulant. Cela vous aidera à organiser tous les blocs réutilisables si vous prévoyez de créer et d'utiliser de nombreux modèles sur votre site Web.

Ensuite, cliquez simplement sur le bouton « Créer » pour enregistrer vos modifications.

Votre modèle sera maintenant enregistré dans la base de données WordPress avec tous ses paramètres.

Comment ajouter des modèles WordPress dans les articles et les pages

Maintenant que nous avons appris à créer un modèle dans WordPress, voyons comment l'ajouter à vos articles et pages WordPress.

Encore une fois, vous devez ouvrir un article nouveau ou existant où vous souhaitez ajouter le bloc réutilisable dans l'éditeur Gutenberg. À partir de là, cliquez sur le bouton « Ajouter un bloc » (+) en haut à gauche de l'écran et basculez vers l'onglet « Modèles » en haut.

Ici, vous remarquerez une liste de toutes les catégories par défaut proposées par la fonctionnalité de modèle. Maintenant, vous devez cliquer sur la catégorie que vous avez sélectionnée pour votre bloc réutilisable.

Par exemple, nous avons choisi la catégorie « Appel à l'action » car nous créions un modèle réutilisable pour les CTA des articles.

Si vous n'avez sélectionné aucune catégorie pour votre bloc, votre modèle sera stocké dans l'onglet « Non catégorisé ».

Une fois que vous cliquez sur une catégorie, une nouvelle invite s'ouvre à côté du menu des blocs, listant tous les modèles enregistrés dans cette catégorie spécifique.

Ici, cliquez simplement sur le bloc réutilisable que vous avez créé, et il sera automatiquement ajouté à votre page ou article WordPress.

Si cela vous semble un peu compliqué, vous pouvez simplement taper un / dans l'éditeur de blocs et rechercher le modèle en utilisant le nom que vous lui avez donné.

Cela ouvrira instantanément une liste de blocs à partir de laquelle vous pourrez facilement choisir le modèle.

Vous pouvez également modifier le bloc réutilisable en cliquant sur l'option « Modifier l'original » dans la barre d'outils du bloc en haut.

Cependant, veuillez garder à l'esprit que la modification des paramètres du modèle les modifiera dans tous les emplacements où vous avez utilisé le modèle.

Cela vous dirigera vers un nouvel écran dans l'éditeur de blocs, où vous pourrez modifier et apporter des changements au contenu du modèle. Vous pouvez également ajouter d'autres blocs pour personnaliser le modèle.

Une fois que vous avez terminé, cliquez simplement sur le bouton « Mettre à jour » pour enregistrer vos modifications.

Vous pouvez maintenant rouvrir l'article, où vous verrez le modèle mis à jour en action.

Cependant, si vous souhaitez simplement apporter des modifications à un modèle dans un article spécifique, vous devrez cliquer sur l'icône à trois points dans la barre d'outils du bloc.

Cela ouvrira une invite, où vous devrez choisir l'option « Détacher ». Cela convertira le modèle en un bloc ordinaire et toutes les modifications que vous apporterez n'affecteront pas le modèle d'origine.

Gestion de tous les modèles dans l'éditeur WordPress

Après avoir utilisé des modèles pendant un certain temps, vous pourriez avoir des blocs que vous n'utilisez plus ou que vous souhaitez renommer.

WordPress vous permet de gérer facilement tous vos modèles depuis un seul écran. Si vous utilisez un ancien thème, visitez la page Apparence » Modèles depuis le tableau de bord WordPress.

Cela vous dirigera vers une nouvelle page où vous pourrez facilement gérer tous les modèles réutilisables de votre site Web WordPress.

Ici, vous pouvez modifier, supprimer, importer ou même exporter vos blocs vers un autre site Web.

Cependant, si vous utilisez un thème de blocs, cette option ne sera pas disponible pour vous. Dans ce cas, vous pouvez gérer tous vos modèles en visitant la page Apparence » Éditeur depuis la barre latérale d'administration de WordPress.

Cela ouvrira l'éditeur complet du site, où vous devrez cliquer sur l'onglet « Modèles » dans la colonne de gauche pour le développer. Maintenant, vous pouvez cliquer sur l'option « Gérer tous mes modèles ».

Vous serez maintenant redirigé vers la page « Modèles », où vous pourrez modifier ou supprimer des modèles.

Vous pouvez également cliquer sur le bouton « Ajouter un nouveau modèle » pour créer un nouveau bloc réutilisable.

Comment importer / exporter des blocs réutilisables (Modèles)

Les modèles ne sont pas seulement réutilisables sur le site web pour lequel ils ont été créés. Vous pouvez également les utiliser sur tout autre site WordPress.

Pour exporter les blocs réutilisables de la page Modèles, cliquez sur le lien « Exporter au format JSON » sous le bloc. WordPress vous enverra maintenant le bloc sous forme de fichier JSON qui pourra être enregistré sur votre ordinateur.

Vous pouvez maintenant passer à l'espace d'administration d'un autre site WordPress. De là, visitez l'écran de gestion des modèles et cliquez sur le bouton « Importer depuis JSON » en haut.

Cela affichera une boîte de téléchargement de fichiers où vous devrez cliquer sur le bouton « Choisir un fichier » pour sélectionner le bloc que vous avez téléchargé précédemment.

Après cela, cliquez sur le bouton « Importer ».

WordPress importera maintenant votre modèle et l'enregistrera dans sa base de données. Vous pouvez maintenant commencer à utiliser les blocs réutilisables nouvellement importés sur votre autre site WordPress.

Pour des instructions détaillées, consultez notre guide étape par étape sur comment importer/exporter vos blocs de contenu WordPress (avec captures d'écran).

Conseils bonus pour maîtriser l'éditeur de blocs WordPress

En plus d'ajouter des modèles pour améliorer votre flux éditorial, vous pouvez également utiliser d'autres conseils dans l'éditeur de blocs WordPress pour rationaliser votre processus de création de contenu.

Cela peut améliorer la productivité et vous aider à vous concentrer davantage sur le contenu de votre site.

Vous pouvez facilement maîtriser l'éditeur de blocs en mémorisant les blocs que vous utiliserez le plus sur votre site web, tels que les blocs de paragraphe, d'image, de titre ou de bouton.

Une fois que vous avez fait cela, vous pouvez réorganiser votre écran de modification pour afficher la barre d'outils des blocs en haut de la page. Vous pouvez même utiliser le mode sans distraction pour supprimer les distractions telles que le panneau de blocs, le menu de blocs, la barre latérale d'administration de WordPress, et plus encore.

Pour des instructions détaillées, consultez notre tutoriel sur comment utiliser l'éditeur plein écran sans distraction dans WordPress.

Une autre astuce incroyable est de commencer à utiliser le bloc de colonnes pour donner à votre contenu un aspect de magazine, ajouter des vidéos YouTube, ajouter des images de couverture, changer les couleurs des paragraphes, et bien plus encore.

Pour plus d'informations, consultez notre liste des meilleurs conseils pour maîtriser l'éditeur de contenu WordPress.

Nous espérons que cet article vous a aidé à apprendre comment créer un bloc réutilisable dans l'éditeur de blocs WordPress. Vous voudrez peut-être aussi consulter notre guide pour débutants sur comment personnaliser votre en-tête WordPress ou nos sélections d'experts pour les meilleurs thèmes WordPress compatibles Gutenberg.

Si cet article vous a plu, abonnez-vous à notre chaîne YouTube pour des tutoriels vidéo WordPress. Vous pouvez également nous retrouver sur Twitter et Facebook.