Le bloc de boucle de requête dans WordPress : guide, trucs et astuces

La boucle de requête est un bloc WordPress soigné qui vous permet d'afficher une liste d'articles de blog, de produits et de pages connexes. En tant que débutant, vous vous demandez peut-être comment tirer parti de cette fonctionnalité.

Heureusement, le bloc Query Loop est relativement facile à utiliser. Vous pouvez choisir votre mise en page prédéfinie préférée ou créer quelque chose à partir de zéro. De plus, vous pouvez configurer l'affichage de vos blocs imbriqués et personnaliser entièrement la conception.

Dans cet article, nous examinerons de plus près le bloc Query Loop dans WordPress. Ensuite, nous vous montrerons comment utiliser le bloc et parlerons de cas d'utilisation spécifiques.

Qu'est-ce que le bloc Query Loop dans WordPress ?

Le bloc Query Loop est un outil qui permet aux utilisateurs de WordPress d'afficher une liste dynamique de publications en fonction d'attributs spécifiques. Par exemple, il peut être configuré pour parcourir tous les messages d'une certaine catégorie, en affichant le titre du message et l'image de chacun.

Ce bloc peut être assez technique à configurer. En conséquence, les débutants ont tendance à éviter de l'utiliser et optent plutôt pour le bloc Post List, qui est une version plus simple de la boucle de requête.

Bien que le bloc Query Loop soit plus complexe, il permet également une plus grande flexibilité. Par exemple, vous pouvez créer une page complète de vos meilleures recettes ou présenter un portefeuille de projets.

Quand utiliser le bloc Query Loop dans WordPress

Le bloc Query Loop offre de multiples opportunités pour promouvoir votre contenu. Voici quelques-uns des résultats que vous pouvez obtenir avec :

• Créez une section d'articles connexes pour votre blog, avec le titre, l'extrait et l'image de l'article.
• Affichez le contenu de types de publication personnalisés, tels que des témoignages ou des éléments de portefeuille.
• Affichez les publications du même tag ou de la même catégorie.
• Afficher les produits WooCommerce associés.
• Affichez une grille de produits, regroupés par prix.
• Répertorier les entreprises par emplacement dans un répertoire d'entreprises.
• Répertoriez les critiques de livres en fonction d'un nombre d'étoiles spécifique.

Ce ne sont que quelques exemples. Il existe de nombreuses façons de configurer le bloc Query Loop.

Comment utiliser le bloc Query Loop dans WordPress

Pour commencer avec le bloc Query Loop, vous devez accéder à la publication ou à la page où vous souhaitez l'utiliser. Ensuite, cliquez sur le + pour ajouter un nouveau bloc et recherchez Query Loop .

Vous pouvez également insérer le bloc à l'aide du sélecteur de modèle de bloc. Basculez vers Patterns et sélectionnez Requête dans le menu déroulant. Ensuite, choisissez votre mise en page préférée.

Il existe de nombreuses dispositions de boucle de requête parmi lesquelles choisir. Par exemple, vous pouvez présenter vos publications dans une grille, avec une image à gauche, ou vous en tenir au format par défaut.

Vous pouvez également cliquer sur Start Blank pour créer votre boucle de requête à partir de zéro et obtenir un contrôle total sur la conception de votre contenu.

Vous devrez choisir une variante pour commencer. Vous voudrez peut-être montrer l'image, la date et le titre de votre message, ou simplement présenter le titre et l'extrait du message.

Que vous ayez créé votre bloc à partir de zéro ou utilisé un modèle, vous verrez un aperçu de votre bloc dans l'éditeur.

Votre bloc Query Loop se compose de plusieurs sous-blocs différents, tels que les titres des publications, les images en vedette, etc. Si vous cliquez sur l'icône Paramètres d'affichage dans la barre d'outils, vous pouvez configurer le nombre d'éléments par page.

Vous pouvez également utiliser les paramètres de bloc dans le panneau de droite pour personnaliser davantage la boucle de requête. Vous pouvez décider de modifier l'ordre de vos articles, de créer de nouvelles publications pour votre flux, d'appliquer des filtres, de modifier les couleurs, etc.

Quels sous-blocs se trouvent dans le bloc Query Loop ?

Dans le bloc Query Loop, vous trouverez plusieurs sous-blocs regroupés. Bien qu'ils contiennent le mot "post" dans leurs noms, ils peuvent également s'appliquer à d'autres contenus tels que des pages, des éléments de portefeuille ou des produits.

Examinons chaque sous-bloc.

1. Titre du message

Le bloc Titre de l'article affiche le titre de chaque article. Vous pouvez transformer le titre en lien et ajuster la police et la couleur dans les paramètres de bloc.

2. Date de publication

Avec ce bloc, vous pouvez afficher la date de publication de votre contenu. Vous pouvez modifier le format par défaut, afficher la date de la dernière modification et créer un lien vers une publication dans les paramètres.

3. Publier du contenu

Le bloc Post Content présente l'intégralité du contenu de votre publication ou de votre page dans le bloc Query Loop. Cela pourrait rendre votre bloc très long, ce qui peut être rebutant pour les visiteurs.

4. Publier un extrait

Post Extrait affiche un résumé de chaque élément de contenu. Les visiteurs pourront voir votre extrait et trouver un lien « En savoir plus ». Vous pouvez ajouter ce lien sur une nouvelle ligne ou à la fin de l'extrait. De plus, vous pouvez modifier le texte d'ancrage, changer la couleur du lien et sélectionner une nouvelle taille de police.

5. Publier une image en vedette

Si vous choisissez d'inclure ce bloc dans votre boucle de requête, vous afficherez l'image sélectionnée pour vos publications ou produits. De plus, vous pouvez activer un lien avec votre image pour diriger les visiteurs vers le contenu lorsqu'ils cliquent dessus.

6. Catégories de messages

En ajoutant un bloc Catégories de publication dans votre boucle de requête, vous pouvez afficher les catégories associées à ce contenu. C'est un excellent moyen d'afficher des articles de blog qui traitent d'un sujet similaire ou de produits de la même catégorie. Vous pouvez également modifier la couleur et les polices dans les paramètres.

7. Balises de publication

Le bloc Post Tags vous permet d'afficher les tags ajoutés à votre publication. C'est un autre moyen utile de présenter un contenu similaire.

8. Pagination (article précédent et article suivant)

La pagination est l'un des blocs les plus précieux à ajouter à votre boucle de requête car il affiche des liens vers vos publications précédentes ou suivantes. La pagination se compose de trois blocs distincts :

• Précédent
• Numéros de page
• Suivant

Pour l'utiliser, vous devez d'abord sélectionner le bloc Post Template à l'aide de la vue Liste. Ensuite, vous pouvez cliquer sur + pour ajouter le bloc Pagination.

9. Auteur du message

Comme son nom l'indique, Post Author présente les détails de l'auteur, comme le nom de l'auteur, l'avatar et la biographie. Si vous choisissez d'inclure ce bloc, vous devrez sélectionner l'utilisateur avec le menu déroulant dans les paramètres de bloc. Ici, vous pouvez également configurer la visibilité de l'avatar, modifier la taille de l'avatar, afficher/masquer la biographie de votre auteur et modifier la couleur et les dimensions.

10. Biographie de l'auteur de l'article

Si vous ne souhaitez pas inclure votre nom d'auteur et votre avatar dans votre boucle de requête, mais que vous souhaitez que la biographie de l'auteur soit visible, alors ce bloc est pour vous. Tout ce que vos visiteurs pourront voir, c'est la bio. De plus, vous pouvez personnaliser son apparence en ajustant la dimension, la police et la couleur.

Exemples de cas d'utilisation du bloc Query Loop

Maintenant que vous comprenez un peu mieux le bloc Query Loop, examinons trois façons de l'utiliser.

1. Créez une section "Messages récents"

Cette section peut rendre votre contenu récemment publié plus visible.

Pour commencer, vous devrez utiliser deux blocs Query Loop. Ajoutez votre premier, puis choisissez un motif ou recommencez à zéro. Pour les publications visuelles telles que les recettes, l'image, la date et le titre peuvent être un bon choix.

Si vous avez déjà configuré votre boucle de requête, vos publications s'afficheront ici. Si ce n'est pas le cas, cliquez sur Créer une nouvelle publication pour ce flux pour rédiger et publier les publications que vous souhaitez inclure.

Étant donné que c'est là que votre message le plus récent ira, vous ne voudrez afficher qu'un seul élément de contenu. Accédez aux paramètres d'affichage . À côté d'ÉLÉMENTS PAR PAGE , saisissez "1".

Désormais, vous ne devriez pouvoir voir que votre publication la plus récente répertoriée dans le bloc.

Vous pouvez ensuite ajouter un deuxième bloc Query Loop pour afficher d'autres publications récentes. Choisissez votre mise en page préférée. Ensuite, accédez à la barre d'outils et passez de la vue Liste à la vue Grille . De cette façon, le lecteur peut voir plusieurs de vos recettes à la fois.

Maintenant, cliquez sur les paramètres d'affichage et changez la valeur OFFSET sur "1". Cela éliminera votre publication la plus récente de votre deuxième bloc de boucle de requête.

De plus, vous pouvez personnaliser la disposition de votre bloc. Par exemple, vous pouvez réduire la taille de la police de vos titres pour améliorer la lisibilité du texte. Vous pouvez le faire à partir de la barre d'outils.

Vous pouvez également réduire la taille de la date. Vous pouvez apporter ces modifications dans les paramètres de blocage. Recherchez Typographie et sélectionnez une taille de police plus appropriée.

Vous pouvez également définir de nouvelles dimensions pour vos images vedettes et modifier l'alignement des titres de vos recettes. Lorsque vous êtes prêt, cliquez sur Enregistrer le brouillon ou Publier.

2. Ajouter le bloc Query Loop à un modèle d'index

Si vous utilisez un thème de bloc, vous pouvez ajouter le bloc Query Loop à un modèle. Cela peut être utile lors de la définition de styles globaux pour les boucles de requête et leurs sous-blocs.

Dans votre tableau de bord WordPress, allez dans Apparence → Éditeur .

Cliquez sur le menu déroulant actuellement défini sur Accueil ou Page (selon votre thème), et sélectionnez Parcourir tous les modèles .

Dans la liste des modèles, sélectionnez celui que vous souhaitez modifier. Le modèle d'index a tendance à être une bonne option, car c'est celui qui indexe et affiche les publications du site Web.

Si vous choisissez Index , vous constaterez que le modèle est déjà fourni avec un bloc Query Loop, mais vous pouvez le supprimer et ajouter le vôtre. Vous pouvez ensuite ajuster la mise en page en basculant entre l'affichage en liste et l'affichage en grille.

Vous pouvez également personnaliser votre texte "En savoir plus" en cliquant sur le sous-bloc et en tapant votre appel à l'action préféré.

Vous trouverez également tous les paramètres de blocage disponibles si vous accédez à la barre d'outils et cliquez sur Afficher plus de paramètres. Ici, vous pouvez modifier la taille et la couleur du texte et définir de nouvelles dimensions pour vos images.

3. Définissez des styles globaux pour vos blocs de boucle de requête

Si vous prévoyez d'utiliser fréquemment des blocs de boucle de requête sur votre site, cela peut prendre du temps de créer et de configurer votre boucle encore et encore. C'est pourquoi il est judicieux de définir des styles globaux pour vos boucles de requête et vos blocs imbriqués.

Pour accéder à l'éditeur de styles globaux, cliquez sur l'icône Styles dans le coin supérieur droit de votre écran :

Ensuite, sélectionnez Blocs en bas de la barre latérale :

Faites défiler la liste des blocs disponibles et recherchez Query Loop. Cliquez ensuite sur Couleurs :

Ici, vous pouvez gérer les schémas de couleurs des différents éléments et blocs de votre site. Si vous souhaitez ajouter plus de couleurs personnalisées à votre palette par défaut, cliquez sur Palette et recherchez CUSTOM .

Maintenant, cliquez sur le + pour ajouter de nouvelles couleurs à votre palette.

Ensuite, revenez aux couleurs de boucle de votre bloc de requête. Vous verrez une liste d'éléments tels que l'arrière-plan, les liens et les en-têtes.

Vous pouvez également définir des styles par défaut pour ces composants. Pour ce faire, sélectionnez l'élément que vous souhaitez modifier.

Par exemple, vous pouvez modifier la couleur d'arrière-plan de vos blocs de boucle de requête.

Si vous décidez de ne pas appliquer l'une des modifications que vous appliquez, cliquez simplement sur Effacer.

Vous pouvez également définir des styles globaux pour l'arrière-plan et la couleur du texte de vos en-têtes. De plus, vous pouvez attribuer des couleurs de survol à vos liens. Lorsque vous avez terminé, cliquez sur Enregistrer pour appliquer de nouveaux styles par défaut à vos blocs.

Étendre le bloc Query Loop

Bien que vous sachiez maintenant comment créer et personnaliser un bloc Query Loop dans WordPress, vous cherchez peut-être à étendre encore plus le bloc. À l'aide de l'API Block Variations, vous pouvez spécifier certains paramètres par défaut, désactiver les options de personnalisation, etc.

Par exemple, vous pourriez ne jamais utiliser l'attribut Sticky dans votre boucle de requête. Le champ Auteur peut également ne pas être pertinent pour vos publications. Par conséquent, vous pouvez désactiver ces contrôles afin qu'ils ne soient pas visibles.

Dans ce cas, le code de variation ressemblerait à ceci :

 { /** ...variation properties */ allowedControls: [ 'inherit', 'order', 'taxQuery', 'search' ], }

De cette façon, vos utilisateurs peuvent accéder aux fonctions inhérentes, d'ordre, de taxonomies et de recherche, mais les champs d'auteur et collants ne seront pas affichés.

Sinon, vous préférerez peut-être masquer l'option de recherche pour les utilisateurs, auquel cas votre propriété ressemblera à ceci :

 { /** ...variation properties */ allowedControls: [ 'inherit', 'postType', 'order', 'sticky', 'taxQuery', 'author', ], }

Si, pour une raison quelconque, vous souhaitez masquer tous les contrôles disponibles pour votre bloc Query Loop, vous pouvez définir un tableau vide à côté de allowControls.

Comme vous pouvez le constater, cette méthode nécessite quelques connaissances techniques. Si vous n'avez aucune compétence en matière de codage, vous voudrez peut-être vous en tenir aux options de personnalisation disponibles dans l'éditeur de blocs.

Questions fréquemment posées

Bien que nous ayons essayé de couvrir tous les aspects du bloc Query Loop, vous pouvez encore avoir des questions sur cette fonctionnalité. Regardons les plus courants.

Qu'est-ce qu'une requête WordPress ?

Requête se traduit par « demander » ou « commander ». Ainsi, dans le bloc Query Loop, la partie "Query" permet aux utilisateurs de demander certaines informations à extraire dans la boucle. C'est ainsi que la boucle de requête affiche tous les articles ou pages pour une balise, une catégorie spécifique, etc.

Qu'est-ce qu'une boucle WordPress ?

Une boucle WordPress est un moyen d'afficher des informations similaires dans un format cyclique. Par exemple, vous pouvez créer une boucle d'articles de blog qui afficheront des articles connexes sur votre page, indiquant le titre de l'article, l'extrait, l'image en vedette, etc.

Les données sont extraites de votre contenu publié et placées dans la boucle, qui se trouve sur vos pages pour les visiteurs. En tant que tel, il vous aide à diriger les utilisateurs vers d'autres éléments de contenu pertinents et à fidéliser les visiteurs avec votre site.

Que pouvez-vous faire avec le bloc Query Loop ?

Il y a beaucoup de choses que vous pouvez réaliser avec le bloc Query Loop. Par exemple, vous pouvez afficher une liste de produits associés ou en vedette.

De plus, vous pouvez diriger les utilisateurs vers d'autres recettes de votre site qui partagent les mêmes balises ou catégories. Pour un site Web de portefeuille, vous pouvez même présenter votre travail le plus récent ou le meilleur dans un bloc Query Loop.

Comment pouvez-vous étendre le bloc Query Loop ?

Vous pouvez obtenir un contrôle détaillé sur la façon dont votre boucle de requête est affichée en ajoutant des paramètres personnalisés au bloc. Avec l'API Block Variations, vous pouvez créer de nouvelles fonctionnalités, désactiver certains éléments et appliquer vos propres préréglages.

Créer un bloc de boucle de requête dans WordPress

Le bloc Query Loop est un bloc WordPress utile qui vous permet d'afficher des articles en vedette, des pages connexes ou des produits d'une certaine catégorie. Vous pouvez également l'utiliser pour afficher le contenu de types de publication personnalisés, tels que des témoignages et des projets de portefeuille.

Le bloc Query Loop est très personnalisable. Vous pouvez configurer les sous-blocs qu'il contient, comme le titre du message, le nom de l'auteur et les images en vedette. De plus, vous pouvez étendre le bloc et ajouter des paramètres personnalisés avec l'API Block Variations.

Une autre façon d'aider les visiteurs à trouver le bon contenu sur votre site consiste à utiliser Jetpack Search. Idéal pour les grands sites Web, vous pouvez fournir des résultats de recherche instantanés et utiliser des filtres puissants pour améliorer votre expérience utilisateur. Commencez avec Jetpack Search dès aujourd'hui !