bloggerselite logo

Comment créer et enregistrer des modèles de blocs dans WordPress

Comment créer et enregistrer des modèles de blocs dans WordPress

L’éditeur de blocs WordPress, également connu sous le nom de Gutenberg, a été publié en 2018. Les nouvelles fonctionnalités ajoutées à cette mise à jour révolutionnaire ont facilité plus que jamais la création de pages Web dynamiques avec un minimum d’effort.

Depuis son lancement, de nombreuses nouvelles fonctionnalités ont été ajoutées à Gutenberg pour prendre en charge encore plus de personnalisation.

Plugin WordPress Gutenberg

Avec la version 5.5, WordPress a ajouté l’utilisation de collections de blocs organisées appelées Gutenberg Block Patterns.

Dans cet article, nous abordons les modèles de blocs, en quoi ils sont différents des blocs normaux et comment enregistrer des blocs personnalisés.

Que sont les modèles de blocs de Gutenberg ?

Les modèles de blocs Gutenberg sont des mises en page prédéfinies construites à partir de plusieurs blocs Gutenberg. Ils sont similaires aux blocs réguliers, car vous pouvez les modifier une fois insérés, tout comme les blocs réguliers.

Cependant, il existe une différence significative entre les modèles de blocs et les blocs réutilisables standard dans Gutenberg.

Lorsque vous ajoutez un bloc réutilisable, il reste le même sur l’ensemble du site Web. Si vous utilisez le même bloc dans d’autres pages et essayez de le modifier, cela modifiera les blocs sur l’ensemble du site.

Avec les modèles de blocs, vous pouvez modifier la conception et les fonctionnalités avec une disposition cohérente sans affecter les autres blocs.

Pourquoi les modèles de blocs de Gutenberg sont-ils si utiles ?

Les mises en page de blocs vous aident à créer de belles pages et les modèles de blocs font de même. Les modèles de blocs vous permettent de personnaliser chaque instance de la mise en page utilisée.

Ainsi, vous pouvez créer des pages plus attrayantes, plus rapidement.

Une toile vierge peut souvent fournir son propre défi. Mais avec les modèles de blocs, cela devient beaucoup plus facile.

Vous pouvez simplement récupérer un modèle que vous voulez dans le répertoire WordPress Block Pattern et l’utiliser sur votre site Web.

Bibliothèque de modèles de blocs

Cela vous permet d’économiser beaucoup de temps et d’efforts dans la conception de tout à partir de zéro!

Les modèles de blocs sont-ils meilleurs que les constructeurs de pages ?

Construire un site Web ne consiste pas seulement à le rendre beau. Vous devez également examiner les performances du site Web, les mises en page, les mises en page prédéfinies et d’autres éléments.

Voici quelques-uns des principes fondamentaux sur lesquels nous comparons les modèles de blocs de Gutenberg avec d’autres constructeurs de pages.

Performance du site Web

Si vous recherchez des performances optimales, les modèles de blocs Gutenberg ont une longueur d’avance sur les constructeurs de pages. C’est le plus grand avantage de l’utilisation de Gutenberg par rapport à n’importe quel constructeur de page.

Les constructeurs de pages offrent de nombreuses fonctionnalités pour aider à créer de belles pages. Mais ces fonctionnalités s’accompagnent souvent d’une surcharge de performances qui peut ralentir les performances de la page.

Un site Web rapide aide à l’optimisation des moteurs de recherche et contribue à améliorer l’expérience utilisateur. Les gens n’aiment pas les sites Web lents, alors plus vite c’est, mieux c’est.

Gutenberg s’est avéré plus rapide que les autres constructeurs de pages parce qu’il fait partie de WordPress, c’est pourquoi nous l’aimons tant.

Santé et sécurité du site

En ce qui concerne la santé et la sécurité du site, les modèles de blocs de Gutenberg sont beaucoup plus fiables que les constructeurs de pages. En effet, les blocs font partie de WordPress et sont conçus pour fonctionner de manière transparente avec WordPress.

Cela ne veut pas dire que les constructeurs de pages sont mauvais, mais simplement qu’ils sont boulonnés sur WordPress plutôt que construits dans le cadre de celui-ci. Il y a forcément des faiblesses là-bas.

Modèles et mises en page

Gutenberg a beaucoup de modèles de blocs que vous pouvez utiliser sur votre site Web. Ce sont des blocs prêts à l’emploi qui vous aident à concevoir efficacement votre site Web.

Lorsque nous comparons les constructeurs de pages comme Divi, Elementor ou Beaver Builder, ils viennent avec des sites Web complets avec tout ce dont vous avez besoin, déjà conçus et prêts à l’emploi.

Ils ont donc le dessus ici.

Ni un constructeur de page ni des modèles de blocs n’ont besoin de codage. Cependant, les modèles de blocs n’ont pas la fonctionnalité glisser-déposer généralement vue dans les constructeurs de pages.

Coût

C’est un gros problème.

Gutenberg est emballé avec WordPress et est entièrement gratuit. Vous pouvez acheter des addons premium pour cela, mais ceux-ci sont complètement facultatifs.

Les constructeurs de pages ont des versions gratuites, qui sont suffisantes pour vous aider à démarrer. Si vous voulez aller plus loin, vous devrez payer.

Que signifie enregistrer un modèle de bloc ?

Comme nous en avons discuté, WordPress a son propre référentiel de modèles de blocs. Vous pouvez utiliser des modèles de ce référentiel et les utiliser sur votre site Web en les faisant glisser et en les déposant en place.

Mais que se passe-t-il si vous créez votre propre modèle ?

Dans ce tutoriel, nous utiliserons le thème Astra. Ne vous inquiétez pas si vous n’utilisez pas Astra, car cette méthode fonctionne avec presque tous les thèmes.

Comment enregistrer un modèle de bloc

Voici un guide étape par étape sur l’enregistrement d’un modèle de bloc.

Étape 1: Installer le plugin Custom Block Patterns

Installez et activez le plugin Custom Block Patterns de LOOS.

Plugin de modèle de bloc personnalisé

Le plugin Custom Block Patterns vous aide à créer votre propre modèle, comme vous le souhaitez.

Normalement, vous devriez créer un modèle, puis ajouter la fonction register_block_pattern() pour activer le modèle de bloc.

Avec ce plugin, vous pouvez contourner tout ce code et créer vos propres modèles directement dans l’éditeur de blocs WordPress.

Étape 2: Créez votre modèle de bloc

Vous pouvez utiliser les mises en page préexistantes et les personnaliser pour créer les vôtres.

Voici comment créer votre propre modèle de bloc :

Accédez au tableau de bord WordPress et sélectionnez Modèles de blocs > Ajouter nouveau.

Ajouter un nouveau modèle de bloc

Cliquez sur le bouton « + » pour trouver les blocs que vous devez ajouter. Vous pouvez également choisir de parcourir tout pour explorer tous les blocs et mises en page prédéfinies.

Créer un nouveau modèle de bloc

Faites glisser la mise en page de votre choix vers l’éditeur.

Importer un nouveau modèle de bloc

Étape 3: Personnaliser la mise en page

Personnalisez la mise en page selon vos besoins. Cette partie en relève complètement à votre créativité.

Vous pouvez ajouter un bouton, ou du texte, ou peut-être changer la couleur d’arrière-plan et l’image. C’est à vous de décider.

Publiez le modèle que vous avez créé en cliquant sur le bouton « Publier ».

Publier un nouveau modèle de bloc

Maintenant, votre modèle de bloc est prêt à être utilisé.

Étape 4: Utilisez le modèle dans d’autres publications et pages

Maintenant que le modèle est créé, vous pouvez commencer à l’utiliser de différentes manières. Vous pouvez l’ajouter à une page ou à un article.

Lorsqu’ils sont conçus d’une certaine manière, les modèles peuvent également être utilisés dans les barres latérales.

Maintenant, utilisons ce modèle dans d’autres endroits:

  1. Accédez à Tableau de bord >Pages Nouvelle page.
  2. Cliquez sur le bouton « + » pour trouver les blocs que vous devez ajouter. Vous pouvez également choisir de parcourir tout pour explorer tous les blocs et mises en page prédéfinies.
  3. Cliquez sur le menu déroulant dans l’onglet « Modèles ».
  4. Cliquez sur l’option « Modèles de blocs personnalisés » pour trouver les modèles de blocs que vous avez créés.
Comment ajouter un modèle de bloc personnalisé

Faites glisser le modèle de bloc souhaité et déposez-le sur la page.

Ajouter un modèle de bloc personnalisé

FAQ sur les modèles de blocs Gutenberg

Qu’est-ce que le modèle de Gutenberg?

Les modèles de blocs Gutenberg sont des mises en page prédéfinies composées de blocs Gutenberg réguliers. Ils agissent comme des blocs réguliers, mais ils peuvent être uniques à une certaine page ou publication par opposition aux blocs réguliers.

La conception standardisée facilite la création d’une page plus attrayante avec moins d’efforts, de temps et d’énergie que si vous conceviez tout vous-même.

Comment personnaliser les blocs Gutenberg ?

Une fois que vous ouvrez une page, vous pouvez y ajouter des blocs et commencer à la personnaliser.

Ajoutez une nouvelle page en accédant au tableau de bord WordPress > Pages Ajouter nouveau.

Ajoutez un bloc à l’aide du bouton Ajouter un nouveau bloc « + ».

Une fois que vous avez cliqué sur le bouton, vous verrez un certain nombre de blocs Gutenberg à ajouter à votre page actuelle.

Vous pouvez également cliquer sur le bouton « parcourir tout » pour voir tous les blocs et les mises en page des blocs.

Vous pouvez ajouter, supprimer ou modifier les attributs des blocs ajoutés au cours des mises en page pour personnaliser un bloc.

Comment fabriquez-vous des modèles de Gutenberg ?

Vous pouvez créer des modèles Gutenberg en utilisant des plugins comme Custom Block Patterns Plugin. Ce plugin vous aide à enregistrer directement les blocs avec votre installation WordPress.

Comment utilisez-vous les modèles de blocs?

Si vous avez une mise en page récurrente dans différentes pages de votre site Web et qu’elle contient différentes informations à afficher, les modèles de blocs sont la voie à suivre.

Cela crée une cohérence dans le modèle et les couleurs, même si les informations du bloc sont personnalisées pour la page particulière.

Créez votre modèle de bloc aujourd’hui!

WordPress est livré avec un large éventail d’options de personnalisation et de plugins qui facilitent plus que jamais la création de mises en page personnalisées. Vous pouvez même créer des pages personnalisées dans WordPress en utilisant des modèles.

Avec les modèles de blocs Gutenberg en place, vous pouvez créer un beau site Web professionnel rapidement et facilement.

Dans cet article, nous avons expliqué comment créer vos modèles de blocs sans avoir à modifier le code. Les plugins contrôlent les conceptions qui gardent vos mises en page en sécurité, même si vous changez de thème.

À l’avenir, Gutenberg s’améliorera et apportera plus d’options de personnalisation pour WordPress.

Avez-vous déjà créé votre modèle de bloc? Faites-le nous savoir dans les commentaires.

Partager cet Article :
Newsletter
Recevez des astuces et des ressources gratuites directement dans votre boîte de réception.
Derniers Articles
☰ Navigation Rapide
S’abonner
Notification pour
guest
0 Commentaires
Commentaires en ligne
Afficher tous les commentaires
0
J'adorerais vos pensées, veuillez commenter.x