Que sont les modèles de blocs WordPress et comment les utiliser ?

Publié: 2022-05-20

Préface
Pourquoi devriez-vous vous soucier des modèles de blocs ?
Que sont les Block Patterns dans WordPress ?
Quels sont les avantages des Block Patterns ?
- Rapidité de développement
- Design unique
- Base de code fiable
- Réutilisabilité
- Liberté créative
Comment utiliser les modèles de bloc
- Utilisation de la bibliothèque de modèles de blocs de l'éditeur Gutenberg
- Utilisation du répertoire de blocs WordPress
- Utilisation de modèles de blocs basés sur un thème
Comment créer des motifs de bloc
Conclusion

Il y a quelques années, WordPress a introduit une nouvelle façon de créer des pages Web. Cette innovation est connue sous le nom de Gutenberg , également connu sous le nom d' éditeur de blocs WordPress ou simplement d' éditeur WordPress. Gutenberg offre à chacun un moyen simple de créer facilement un contenu riche. Il le fait avec WordPress Blocks et WordPress Block Patterns.

Les blocs sont la pierre angulaire du pouvoir de Gutenberg. Comme le jouet bien-aimé des enfants, les blocs WordPress vous permettent de créer une page en les empilant comme bon vous semble. Vous pouvez supprimer ceux que vous ne voulez pas et il est facile de recommencer si vous n'aimez pas ce que vous avez construit.

Vous pouvez utiliser des blocs pour ajouter des vidéos, des images et des conceptions créatives à votre site sans compétences techniques ou de codage. Plus simple encore, vous pouvez utiliser une collection de blocs, appelés modèles de blocs, pour donner à votre site une mise en page prête à l'emploi. Personnalisez ces modèles de blocs avec votre contenu et vous êtes prêt !

Aujourd'hui, le projet Gutenberg a évolué à un tout autre niveau. Au fur et à mesure de son évolution, il fait place au prochain éditeur de site complet, qui viendra avec la mise à jour WordPress 6.0 plus tard ce mois-ci, vous permettant d'appliquer des blocs à toutes les parties de votre site plutôt qu'aux publications et aux pages. Construire des sites incroyables et les éditer au fil du temps sera bientôt encore plus facile ! Nous en reparlerons dans un prochain post.

Pour l'instant cependant, parlons des modèles de blocs WordPress, de ce qu'ils font et pourquoi ils sont importants pour vous…

Pourquoi devriez-vous vous soucier des modèles de blocs ?

Même les sites les plus beaux ont besoin de mises à jour de temps en temps, mais suivre les demandes toujours croissantes des affaires en ligne vous pose un problème. Vous devez apporter les modifications rapidement, même si vous ne savez pas coder.

Si vous partez de zéro, vous vous retrouvez dans une situation similaire. Vous devez créer votre site rapidement. En tant que propriétaire de site, vous souhaitez vous concentrer sur la création de contenu et gagner de l'argent, et vous ne voulez certainement pas perdre de temps à lutter avec du code. Pourtant, créer un nouveau design peut prendre des jours voire des semaines.

C'est là qu'interviennent les modèles de blocs : ils vous permettent de créer votre site de manière rapide et élégante. Vous pouvez essayer différentes combinaisons de blocs pour voir ce qui vous convient le mieux. Comme vous le découvrirez, des centaines d'idées s'offrent à vous.

D'un autre côté, si vous n'utilisez pas de modèles de blocs, vous pourriez être obligé d'apprendre à coder. Même si vous utilisez un thème WordPress premium, vous devrez modifier le code backend en fonction de vos besoins. Le temps nécessaire pour effectuer les modifications peut être supérieur à ce que vous pouvez vous permettre et votre budget augmentera si vous engagez un professionnel pour s'en charger à votre place.

Les modèles de blocs éliminent une grande partie de cette douleur - l'édition de votre site devient (osons-nous le dire) très amusante. Vous pouvez choisir plusieurs modèles, essayer diverses combinaisons et avoir rapidement un site Web fonctionnel qui impressionne vos visiteurs.

Que sont les Block Patterns dans WordPress ?

Les modèles de blocs WordPress sont des combinaisons prédéfinies de blocs que vous pouvez modifier à votre guise. Vous pouvez avoir un modèle qui représente une page Web complète ou vous pouvez en sélectionner un qui représente une section de votre site, comme un menu d'icônes sociales. Vous n'avez pas besoin de savoir coder pour les utiliser, et grâce aux fonctionnalités d'édition de Gutenberg, vous avez le contrôle sur l'apparence finale du motif.

Quels sont les avantages des Block Patterns ?

Les modèles de Gutenberg et de bloc sont des concepts relativement nouveaux. Traditionnellement, les sites WordPress sont créés avec des constructeurs de sites ou en créant un modèle à partir de rien. Bien que ces approches fonctionnent très bien, elles nécessitent souvent une formation approfondie ou une expérience de codage pour obtenir les meilleurs résultats. De nombreux utilisateurs de WordPress se plaignent également que les constructeurs de sites créent des pages maladroites qui prennent beaucoup de temps à charger.

Les modèles de blocs s'accompagnent d'une nouvelle approche et d'avantages uniques. Ils sont un atout pour les concepteurs de sites Web débutants et expérimentés. Examinons les avantages les plus critiques.

Rapidité de développement

L'avantage le plus important est la vitesse à laquelle vous pouvez créer un site sans connaissances en codage. Étant donné que les modèles de blocs sont prédéfinis, vous n'avez qu'à choisir ceux que vous voulez. Placez-les sur la page et réorganisez-les jusqu'à ce que vous soyez satisfait de l'apparence de votre site.

Les modèles de blocs permettent une personnalisation facile. Vous pouvez utiliser vos images préférées et appliquer des couleurs qui correspondent à votre marque. Vous aurez un site Web opérationnel prêt à propulser votre entreprise en quelques jours, voire quelques heures !

Design unique

Cet avantage est important pour tout propriétaire de site qui ne souhaite pas une conception de site Web à l'emporte-pièce. Vous pouvez réorganiser les modèles de blocs en fonction de vos besoins spécifiques. Choisissez, mélangez et réorganisez les motifs de blocs jusqu'à ce que vous trouviez la combinaison que vous aimez. Vous vous retrouverez facilement avec un site unique qui se démarque de la concurrence.

Base de code fiable

Il y a de fortes chances que vous ne vouliez pas passer votre temps à coder. Pourtant, vous voulez être sûr que votre site est robuste. Votre site doit avoir fière allure sur tous les appareils, avec différentes tailles d'écran. Les modèles de blocs résolvent ce problème par conception.

La plupart des modèles proviennent de développeurs passionnés par leur travail. Ces professionnels tiennent à leur réputation. Ainsi, lorsque vous choisissez un modèle de bloc, vous pouvez vous détendre en sachant qu'il est bien codé et testé.

Vous constaterez que les modèles ont également des avantages en termes de vitesse et de performances. Le temps de chargement de votre site affecte votre référencement, ce qui peut avoir un impact sur votre trafic. En particulier, les modèles de blocs ont tendance à être plus légers et mieux optimisés que de nombreux thèmes créés avec des constructeurs de sites populaires.

Réutilisabilité

Un autre aspect amusant de l'utilisation de modèles de blocs est que vous pouvez les réutiliser. Si vous avez différents sites Web, cette fonctionnalité est très pratique. Vous pouvez également réutiliser vos modèles sur différentes pages de votre site.

Si vous créez des sites pour d'autres, l'utilisation de modèles de blocs peut faire la différence entre respecter une échéance et perdre un client. Enregistrez vos modèles préférés, puis personnalisez-les pour chaque site que vous créez.

Liberté créative

L'un des avantages les plus attrayants des motifs de blocs est la liberté de création dont vous bénéficiez. Un site construit à partir d'un modèle vous oblige à rester dans un concept. Pour les personnes qui aiment s'exprimer, cela peut être ennuyeux. Mais, avec les modèles de blocs, vous pouvez facilement explorer différentes idées.

Tout ce que vous avez à faire est de faire défiler les nombreuses bibliothèques de modèles riches à votre disposition. Vous pouvez choisir parmi des options adaptées à tous les budgets ; de nombreux modèles sont gratuits. La meilleure partie est que vous n'avez pas à vous engager dans une combinaison. Si vous changez d'avis, vous pouvez explorer une nouvelle idée en quelques clics.

Vous pouvez trouver des modèles de blocs pour n'importe quelle section de votre site ; menus, articles en vedette, pieds de page et en-têtes, tableaux de prix, et plus encore ! Vous serez surpris par ce que vous pouvez faire par vous-même, sans avoir besoin de compétences techniques.

Comment utiliser les modèles de bloc

Utilisation de la bibliothèque de modèles de blocs de l'éditeur Gutenberg

Le moyen le plus simple consiste à accéder à la bibliothèque de modèles de blocs dans votre éditeur Gutenberg. Voici les étapes de base.

  • Cliquez sur le bouton bleu "plus" dans le coin supérieur droit de votre éditeur.
    Modèles de blocs WordPress Basculer l'insertion de blocs
  • Ensuite, cliquez sur l'onglet "Modèles". Vous verrez une sélection de motifs parmi lesquels vous pourrez choisir.
    Sélectionnez l'onglet Motifs
  • Cliquez sur le motif que vous voulez et il apparaîtra dans l'éditeur.
    Modifier le modèle de bloc
  • Vous pouvez maintenant personnaliser le motif en l'ajustant à vos besoins.
    Modifier le modèle de bloc

Utilisation du répertoire de blocs WordPress

Vous pouvez également visiter le répertoire de modèles de blocs WordPress sur wordpress.org/patterns. Ce répertoire contient une vaste collection de modèles que vous pouvez commencer à utiliser immédiatement.
Répertoire de modèles de blocs WordPress

Les modèles sont organisés en fonction des fonctionnalités qu'ils fournissent. Vous pouvez trouver des mises en page, des galeries, des conceptions basées sur des vidéos, etc. Vous pouvez voir lesquels sont les plus récents. Ou, si vous préférez, vous pouvez les trier par popularité.

Il existe également une liste organisée de modèles en vedette. C'est une sélection de certains des meilleurs designs que vous pouvez trouver. Tous sont gratuits et peuvent être utilisés sur des sites commerciaux.

Une fois que vous avez sélectionné un motif dans la bibliothèque, survolez l'image affichée. Vous verrez un bouton indiquant "Copier". Cliquez dessus, puis collez-le dans l'éditeur Gutenberg. Si vous avez de l'expérience avec le codage, vous pouvez également le coller dans votre éditeur de code préféré pour apporter des modifications.

Vous pouvez également cliquer sur la vignette pour prévisualiser le motif. Cela vous montrera à quoi ressemble le design sur une page Web. Vous verrez un bouton bleu qui vous permet de copier le motif à utiliser dans votre conception. Une fois que vous avez copié le motif, ouvrez votre éditeur Gutenberg. Cliquez pour indiquer où vous voulez que le motif apparaisse. Collez-le et vous pourrez le modifier à votre guise.

Utilisation de modèles de blocs basés sur un thème

Certains thèmes vous donnent accès à des collections exclusives de patrons. Ceux-ci peuvent être gratuits ou payants. Chaque thème diffère légèrement dans la façon dont les modèles sont ajoutés à votre site. En général, vous devriez voir une option pour parcourir les conceptions. Vous pouvez ensuite importer ce modèle que vous voulez dans votre page.

Comment créer des motifs de bloc

Si vous êtes à la hauteur de la tâche, créez un motif de bloc personnalisé. Une mise en page personnalisée est la meilleure approche si vous avez une idée unique qui n'est disponible dans aucune bibliothèque. Cette option a également du sens si vous aimez créer quelque chose qui vous est propre.

La première étape de la création d'un motif de bloc consiste à décider de son objectif ou de sa fonction. Est-ce un modèle que vous utiliserez sur toutes vos pages ? Avez-vous besoin d'une mise en page que vous utiliserez pour afficher vos produits sur votre site ? Prenez le temps de comprendre cela et écrivez vos pensées.

Ensuite, vous voulez avoir un croquis de ce qui entrera dans le motif sur une feuille de papier. Ne vous souciez pas de son apparence. Vous n'êtes pas obligé de créer un chef-d'œuvre artistique. Une mise en page simple de ce que vous voulez est plus que suffisante. Ce qui compte, c'est que vous soyez clair sur ce que vous essayez de créer. Cette étape vous fera également gagner du temps.

Assistance WordPress 24h/24 et 7j/7

de vrais experts WordPress

APPRENDRE ENCORE PLUS

La dernière étape consiste à créer le code de votre modèle de bloc. La façon la plus simple de procéder est d'utiliser un plugin. Accédez au référentiel de plugins WordPress. Tapez le mot-clé « motifs de blocs » comme expression de recherche. Vous verrez plusieurs plugins qui vous permettent de créer des motifs. Essayez-en quelques-unes pour voir celle qui correspond à votre flux de travail préféré.

Si votre idée est trop compliquée à gérer pour un plugin, vous pouvez toujours créer votre modèle de bloc. Le défi est que si vous n'êtes pas familier avec le codage, vous devrez embaucher quelqu'un pour vous aider. Mais vous pouvez toujours proposer vos propres idées et indiquer à votre développeur ce que vous voulez. Le Codex WordPress fournit une documentation détaillée sur la façon de coder un modèle de bloc.

Une fois que vous avez terminé de créer votre modèle, vous pouvez le partager avec la communauté en l'intégrant à la bibliothèque de modèles de blocs WordPress. C'est une excellente façon de contribuer. Connectez-vous à votre compte WorPress.org et suivez les instructions si vous souhaitez partager votre modèle de blocage.

Conclusion

Les modèles de blocs dans WordPress ont rendu la création de sites accessible aux personnes de tous niveaux. Vous n'avez pas besoin de beaucoup d'argent pour avoir un site qui peut se démarquer de la concurrence. Votre site a un design unique plus rapidement que jamais. Vous aurez également la certitude que vous travaillez avec du code spécialement conçu pour l'écosystème WordPress. Les modèles de blocs continueront d'évoluer. Ainsi, lorsque vous les utilisez, vous participez au progrès naturel de cette technologie.

Grâce aux modèles de blocs WordPress, vous pouvez vous concentrer sur la création de contenu. Ne perdez plus de sommeil à vous soucier de la façon dont vous allez construire votre site !

Tout ce que vous avez à faire est de sélectionner un bon hébergeur WordPress, de configurer votre site, de sélectionner le thème et de commencer à créer les pages plus rapidement que jamais avec Block Patterns.

Comme prochaine étape, donnez-vous du temps pour expérimenter. Jouez avec les idées et voyez ce qui vous convient. Si vous n'êtes pas prêt à commencer à créer votre site, explorez certaines des bibliothèques de modèles de blocs. Faites défiler les modèles et voyez ce qui est disponible pour vous. Ce n'est qu'une question de temps jusqu'à ce que vous vous sentiez inspiré.

Bien sûr, il peut y avoir une courbe d'apprentissage si ce concept est nouveau pour vous. C'est parfaitement normal. La bonne nouvelle est qu'il n'y a pas de règles strictes. Vous décidez comment vous voulez utiliser les modèles de blocs d'une manière qui correspond à vos besoins et vous pouvez commencer dès aujourd'hui !

Performances Web

Le temps de chargement compte ! Savez-vous à quelle vitesse votre site est?

APPRENDRE ENCORE PLUS