Explication des types de blocs courants de l'éditeur Gutenberg et de leurs fonctions

Éditeur GutenbergCela peut se faire par "motte (de terre)"(bloc) pour créer le contenu et la mise en page d'un site web, en fournissant les éléments suivantsPlus de souplesse et de personnalisation. Qu'il s'agisse de créer un simple article de blog ou de concevoir une mise en page complexe, l'éditeur Gutenberg aide les utilisateurs à atteindre leurs objectifs en toute simplicité. Cet article détaillera comment ajouter, utiliser et personnaliser différents blocs dans l'éditeur Gutenberg et quels types de blocs sont disponibles.

1. ajouter des blocs dans l'éditeur Gutenberg

Dans l'éditeur Gutenberg, les blocs sont les éléments de base pour créer le contenu des pages et des articles.Chaque bloc représente un élément de contenuLes informations sur l'état d'avancement du projet, telles que les paragraphes, les images, etc,boutonsetc. Voici les étapes à suivre pour ajouter des blocs dans Gutenberg :

Ouvrez l'éditeur d'articles/de pages

• Connectez-vous au backend de WordPress.
• Dans le menu de gauche, sélectionnez "carte"ou"page web".
• Cliquez "Ajouter un nouveau message"ou"compilateur"Posts/Pages existants.

Ajout de blocs

• Utilisation de l'icône plusDans l'interface de l'éditeur, cliquez sur le haut de la zone de contenu de la page ou de l'article.+L'icône " Block Inserter " apparaît, ce qui vous permet de parcourir et de sélectionner différents types de blocs.

• Utilisation de la commande Slash: Tapez la barre oblique ("/"), puis saisissez le nom du bloc et l'éditeur affichera une liste rapide des blocs disponibles. Il vous suffit d'appuyer sur la touche Entrée pour insérer rapidement le bloc sélectionné.

Sélection et insertion de blocs

• Inséreur de blocsPour ce faire, il fautblocage du navigateurdans l'outil d'insertion pour sélectionner le bloc désiré, ou en utilisant le bouton supérieur de l'outil d'insertion.terme de rechercheRecherchez directement un bloc spécifique. Lorsque vous cliquez sur un bloc, il est automatiquement inséré dans la zone de contenu.

2. comment personnaliser les blocs Gutenberg

Dans l'éditeur Gutenberg, vous pouvez non seulement insérer des blocs, mais aussi des blocs à la demande.personnalisationLe système. Les paramètres et options personnalisés varient selon le type de bloc, mais la plupart des blocs peuvent ajuster les éléments suivants :

Barre d'outils de blocage

Chaque bloc affiche une barre d'outils contextuelle lorsqu'il est sélectionné. Cette barre d'outils est située au-dessus du bloc et permet d'accéder rapidement aux options de configuration courantes :

• options d'alignementAlignement : définit l'alignement du bloc (justifié à gauche, centré, justifié à droite, pleine largeur).
• FormatageLes informations sur le contenu de la page : par exemple, les caractères gras, les italiques, l'insertion de liens, etc.
• Options d'insertionLes blocs peuvent être séparés par d'autres contenus, tels queintégrationetcode courtetc.

Panneau de configuration des blocs

Sur le côté droit de l'éditeur, vous trouverez d'autres options de personnalisation des blocs. Ces options se distinguent par deux onglets principaux :

• Onglet BlocsOptions de personnalisation : Affiche les options de personnalisation associées au bloc sélectionné. Par exemple.passage passageVous pouvez modifier la couleur du texte, la couleur d'arrière-plan, la police, l'espacement des lignes, etc.

• Onglet Documentations'applique à l'ensemble du document (par exemple, une page ou un article) et comprend les paramètres relatifs aux catégories, aux balises, aux images vedettes, etc.

Blocs réutilisables

Si vous devez utiliser le même bloc plusieurs fois, vous pouvez l'enregistrer sous la forme d'un fichierBlocs réutilisables. Cela permet d'insérer facilement le même bloc de contenu dans différents articles ou pages :

• Sélectionnez le bloc souhaité et cliquez surblocsdans la barre d'outilsmenu en trois points(plus d'options).
• Sélectionnez "Ajouter aux blocs réutilisables"Options.

• Nommez le bloc et sauvegardez-le pour l'identifier et l'utiliser ultérieurement.

3. les types de blocs dans l'éditeur Gutenberg

L'éditeur Gutenberg fournitPlusieurs types de blocsVous pouvez choisir de les utiliser en fonction de vos besoins. Voici les types de blocs les plus courants et leurs fonctions :

Blocs communs

• passages: Utilisé pour ajouter du contenu textuel, il prend en charge les fonctions d'édition de texte de base telles que la mise en gras, la mise en italique, l'ajout de liens, etc.
• légendepour l'ajout de titres aux pages ou aux articles, prend en chargeen-tête à plusieurs niveaux(H1, H2, H3, etc.).
• imagerie: Permet d'insérer des images et d'effectuer des réglages d'alignement, de taille et de légende.
• listes: Permet de créer des listes ordonnées ou non ordonnées.
• citation: Utilisé pour ajouter une citation, généralement pour citer une phrase ou un paragraphe.

bloc de formatage

• codification: pourCode d'affichageen conservant généralement le code formaté et en utilisant des polices de même largeur.
• reformater: pourInsérer du texte préformatéLe texte doit être clair et précis, en conservant les espaces et les sauts de ligne dans le texte.
• citationPour l'utilisation avecstyliséune façon d'afficher des citations ou un contenu important.
• tabulaire: pourCréation de formulairesLe nombre de lignes et de colonnes peut être personnalisé.

Éléments de mise en page

• boutons: Utilisé pour créer des liens entre lesBoutons personnalisésqui est généralement utilisé pour guider l'utilisateur dans une action (par exemple, "Acheter","Contactez nous"etc.)
• colonnes: Utilisé pour créer desmise en page multicolonneVous pouvez placer plusieurs blocs dans des colonnes différentes.
• formulaire: Utilisé pour convertir lesBlocs multiples combinésIl est facile à gérer et à organiser.
• intervalles: utilisé entre les blocsAjouter un espacementLe contenu doit être bien séparé visuellement.

widgets

• code courtPour l'insertioncode courtpour intégrer un contenu ou une fonctionnalité dynamique.
• archivesAffiche une archive des messages du site, qui peuvent être archivés par mois, par année, etc.
• formulaireCatégorie d'articles : Affiche une liste des catégories d'articles du site, ce qui permet aux visiteurs de parcourir facilement le contenu sur des sujets spécifiques.
• Derniers messages: Permet d'afficher les messages les plus récents sur le site.

bloc intégré

L'éditeur Gutenberg propose également une variété de blocs d'intégration pour intégrer du contenu externe dans les posts ou les pages :

• YouTubeLes vidéos YouTube : L'intégration de vidéos YouTube permet aux utilisateurs de les lire directement sur la page.
• TwitterLes tweets Twitter intégrés, montrant le contenu et les interactions des tweets.
• InstagramLes posts Instagram : intégrez des posts Instagram pour afficher du contenu image ou vidéo.
• SpotifyLes titres de Spotify ou les listes de lecture peuvent être intégrés pour le plus grand confort de ceux qui écoutent de la musique.

4) Personnalisation avancée et extensions

Pour les utilisateurs ayant des besoins de personnalisation plus importants, l'éditeur Gutenberg prend en charge des fonctionnalités de personnalisation supplémentaires, notamment les blocs personnalisés, les modes de blocs et l'utilisation de plugins tiers.

Blocs personnalisés

Les développeurs peuvent utiliser la fonction Blocs WordPress API Création de blocs personnalisés. Il s'agit de créer un bloc personnalisé à l'aide de la fonction JavaScript(Réagir) pour définir la fonctionnalité et le style du bloc. Les blocs personnalisés peuvent être présentés sous forme de plugins et partagés avec d'autres utilisateurs, ce qui permet d'améliorer encore les fonctionnalités de l'éditeur Gutenberg.

modèle de bloc

Les modèles de blocs sont des mises en page prédéfinies qui peuvent être rapidement insérées dans des conceptions complexes. Vous pouvez personnaliser ces modèles et les enregistrer pour les réutiliser sur d'autres pages ou articles.

Plug-ins tiers

De nombreux plugins tiers proposent de nouveaux blocs et fonctionnalités qui étendent encore les capacités de l'éditeur Gutenberg. Les plugins les plus populaires sont les suivants :

• Blocs Gutenberg avancésAjout de blocs communs tels que les témoignages, les tableaux de prix, etc.
• CoBlocksLe logiciel de gestion de contenu : Il fournit un ensemble riche de blocs permettant de créer des mises en page de contenu hautement personnalisables.
• Blocs KadenceLes blocs avancés : Plusieurs blocs avancés sont fournis pour vous aider à créer des mises en page et des designs complexes en toute simplicité.

CSS personnalisé

Pour ceux d'entre vous qui sont familiers avec le CSS, l'éditeur Gutenberg peut ajouter la baliseCSS personnalisé classe. Cela permet à l'utilisateur d'affiner le style du bloc pour mieux l'adapter à la conception de la page.

5. résumé

L'éditeur Gutenberg est un outil puissant et flexible pour tout, des simples articles de blog aux conceptions web complexes. Avec une variété de blocs intégrés et d'options de personnalisation, vous pouvez facilement créer, peaufiner et optimiser le contenu web. Pour les développeurs, Gutenberg offre également la possibilité de créer des blocs personnalisés, ce qui étend encore ses fonctionnalités.