Comment utiliser la boucle de requête dans WordPress pour créer une page de liste de publications ?

La page des articles de blog affiche tous les articles de blog de votre site Web WordPress sur une page, quels que soient leur catégorie, leur type, leur date de publication ou leur auteur. Avez-vous déjà vu des sites Web qui ne sont essentiellement que des articles et des articles de blog ? Eh bien, il s'agit essentiellement d'une page d'articles de blog servant de page d'accueil pour lesdits sites Web. Ces types de sites Web sont les plus apparents avec des sites Web affichant exclusivement du contenu lié aux actualités. En dehors de cela, les pages de liste de publications sont généralement ce que vous voyez lorsque vous accédez aux blogs ou à la page d'actualités de la plupart des sites Web. Alors, comment pouvez-vous en créer un pour votre propre site Web ?

Configurer la page des articles de blog dans WordPress

Si vous souhaitez créer une page de blog, vous pouvez simplement créer une page dans WordPress.

• Accédez au tableau de bord d'administration de votre site Web et sélectionnez « Pages > Ajouter un nouveau ».
• Saisissez un titre pour la page. Dans la plupart des sites Web, comme mentionné précédemment, cette page sera nommée « Blogs » ou « Nouvelles », vous pouvez utiliser tout ce que vous voulez.
• Assurez-vous qu'il n'y a pas de contenu dans la page et publiez la page vide.
• Maintenant, allez dans la section « Paramètres > Écriture » ​​dans votre panneau d'administration WordPress et sélectionnez la page vide en tant que « page des articles ».
• Enregistrez vos paramètres.

Vous pouvez personnaliser le nombre de publications apparaissant sur la page des publications et si vous souhaitez afficher le résumé ou le contenu complet de chaque publication.

La page de liste de publications conçue est contrôlée par votre thème et vous pouvez également utiliser des plugins de création de page pour créer une page de publications personnalisée sur laquelle vous êtes votre site. Maintenant que vous vous demandez peut-être, s'il s'agit d'une option par défaut, pourquoi un bloc de boucle de requête distinct est disponible dans l'éditeur Gutenberg.

Le bloc de boucle de requête

WordPress a publié une nouvelle fonctionnalité vraiment cool dans la version 5.8, le bloc Query Loop. Contrairement à une page d'articles de blog, vous disposez d'options de personnalisation pour ajuster l'affichage et diverses autres fonctionnalités avec le bloc de boucle de requête. Essentiellement, vous pouvez utiliser le bloc de boucle de requête pour créer facilement une page de liste de messages remplie de tous vos messages présentés selon vos préférences spécifiques en termes de conception, d'alignement et de structure.

La boucle de requête est essentiellement un bloc imbriqué contenant le titre du message, le contenu du message, l'image en vedette, etc. et fonctionne exactement comme le bloc « Liste des messages ». Avec de nombreux modèles de blocs intégrés à ce nouvel éditeur de blocs, vous pouvez facilement créer une page de portfolio ou une page contenant vos publications préférées, sans aucun plug-in tiers. Avec ce guide, nous vous guiderons à travers toutes les étapes de configuration d'une page d'articles et d'utilisation du bloc de boucle de requête pour remplir la page avec les articles de blog sur votre site WordPress.

Pour les besoins de cet exercice, nous vous recommandons d'avoir déjà au moins quelques publications sur votre site Web avant de créer votre page de liste de publications. Assurez-vous également que vous utilisez l'éditeur de blocs Gutenberg et non l'ancien éditeur Classic.

Ajouter un bloc de boucle de requête

• Cliquez sur l'outil d'insertion (+) Ajouter un bloc et sélectionnez le bloc Query Loop comme indiqué dans l'image ci-dessous. Pour trouver le bloc Query Loop, vous devrez cliquer sur Parcourir tout , puis faire défiler jusqu'à la section Thème de l'outil d'insertion de bloc. Alternativement, vous pouvez taper « /query loop » dans un nouveau bloc de paragraphe pour faire la même chose.

Personnalisation du bloc de boucle de requête

Lors de l'ajout du bloc de boucle de requête dans votre page, par défaut, le bloc remplira votre page avec le dernier message. Cependant, dans le but de créer une page de publications, vous pouvez modifier le nombre de publications à afficher. L'éditeur de blocs Query Loop vous offrira diverses options de mise en page sous la forme de modèles de blocs à choisir et à personnaliser. Les différentes options de mise en page peuvent être visualisées sous forme de carrousel ou de grille.

Modèles de conception de bloc de boucle de requête

Choisissez l'un des deux formats de vue, carrousel ou grille, en fonction de la vue de conception que vous préférez en haut du bloc de boucle dans votre page de liste de publications. Vous devrez utiliser le bouton Choisir si vous décidez d'utiliser la vue carrousel ou sélectionner l'une des options disponibles si la forme de grille est le format d'affichage de votre choix.

Les modèles de boucle de requête fournis par WordPress par défaut sont :

• Standard
• Image à gauche
• Petite image et titre
• Grille
• Grand titre
• Décalage

À des fins de démonstration, nous avons décidé d'utiliser le modèle de conception standard illustré ci-dessous avec le format de vue carrousel. Inversement, vous pouvez également choisir de commencer à partir de Blank , et choisir l'une des quatre variantes qui correspond à vos besoins spécifiques, et personnaliser davantage à partir de là.

Options de bloc de boucle de requête

Comme mentionné précédemment, la boucle de requête est composée de blocs imbriqués qui peuvent être réorganisés, ajoutés, alignés, etc. La bonne chose est que lorsque vous personnalisez et modifiez un bloc, la même chose sera appliquée à tous les blocs du même type. Comme le montre la capture d'écran ci-dessous, vous pouvez utiliser la barre d'outils supérieure pour apporter les modifications suivantes à vos blocs de publication :

• Largeur : modifiez la largeur des différents éléments du bloc Query Loop. À partir de la barre d'outils supérieure, vous pourrez créer les messages sur toute la largeur ou sur la grande largeur. L'option grande largeur étendra le bloc au-delà de la taille du contenu tandis que l'option pleine largeur étendra le bloc Query Loop pour couvrir toute la largeur de votre écran.
• Alignement : modifiez l'alignement des différents éléments du bloc Query Loop. Vous avez la possibilité de choisir vos paramètres d'alignement allant de la gauche au centre jusqu'à la droite de la page.
• Disposition : Vous pouvez réorganiser les éléments du bloc Query Loop comme vous le souhaitez en utilisant les déménageurs comme indiqué ci-dessous.

• Couleurs : vous pouvez appliquer différents types d'options de couleur via les options de paramètres de bloc du bloc que vous avez sélectionné.
• Ajouter des blocs : vous pouvez également ajouter de nouveaux éléments à vos blocs tels que des auteurs de messages ou des extraits si vous le souhaitez.

Barre d'outils du bloc de boucle de requête

Dans la barre d'outils du bloc Boucle de requête, vous trouverez le bouton Paramètres d'affichage , qui, lorsque vous cliquez dessus, ouvre une fenêtre contextuelle qui vous permettra de choisir le nombre de publications à afficher.

• Éléments par page : nombre de publications à afficher dans le bloc Query Loop
• Offset : nombre de publications que vous souhaitez ignorer
• Nombre maximum de pages à afficher : limite le nombre de publications que vous souhaitez afficher

Choisissez le nombre de publications que vous souhaitez afficher dans votre page de liste de publications. Il est recommandé que les pages de liste de publications affichent toutes les publications sur le site Web. Cela dit, ils peuvent ne pas être sur la même page et peuvent être affichés sur plusieurs pages en utilisant la pagination.

Dans la barre bloc de requête, vous pouvez également basculer entre Liste ou Grille si vous voulez afficher vos messages sous forme de liste ou empilés comme des grilles, un à côté de l'autre, respectivement.

Connexe : Top 5 des plugins de bloc Gutenberg pour WordPress.

Éditeur de bloc de boucle de requête

En utilisant les fonctionnalités et les modificateurs spécifiques de l'éditeur de blocs Query Loop, vous pourrez modifier les paramètres de couleur, appliquer des filtres spécifiques aux publications et modifier l'ordre des publications dans votre page de liste de publications. Si, au cas où vous ne voyez pas l'éditeur de blocs, cliquez sur l'icône « roue dentée » à côté du bouton de publication pour ouvrir la barre latérale de l'éditeur sur le côté droit de votre écran.

• Les options de couleur de l'éditeur de bloc Query Loop auront un impact sur l'ensemble du bloc Query, mais vous pouvez également personnaliser des éléments individuels dans le bloc en les sélectionnant spécifiquement et en apportant les modifications applicables via la barre latérale de leur éditeur. L'éditeur de bloc Query Loop fournit les options de personnalisation des couleurs suivantes dans le bloc :
  • Couleur du texte : vous permet de modifier la couleur du texte contenu dans la boucle de requête. Ici, vous avez la possibilité de choisir l'une des couleurs prédéfinies dans le menu, de choisir une couleur personnalisée dans la palette ou d'ajouter un code de couleur spécifique de votre choix.
  • Couleur d'arrière-plan : Cela aura un impact sur la couleur de l'arrière-plan global du bloc. Ici, vous pouvez soit choisir une couleur prédéfinie, choisir une couleur personnalisée, ajouter un code de couleur spécifique ou utiliser également une option de dégradé de couleur. Vous pouvez voir comment l'utilisation d'une option de couleur de dégradé a eu un impact sur le bloc de requête dans la capture d'écran ci-dessous.
  • Couleur du lien : cette option de couleur contrôle les couleurs de tous les liens dans l'un des messages présents dans le bloc de requête. Cette option a exactement les mêmes variations de couleur que l'option de couleur de texte.

• Dans la barre latérale de l'éditeur de blocs Query Loop, vous rencontrerez l' option Hériter de la requête à partir du modèle . Cette option peut être activée ou désactivée, selon que vous souhaitez ou non personnaliser la requête sur laquelle la boucle est construite. Si vous l'activez, certaines options de personnalisation seront masquées, mais si vous la désactivez, d'autres options de personnalisation apparaîtront, telles que :
  • Colonnes : ce sera une barre de déplacement qui vous permettra de sélectionner le nombre de colonnes dans lesquelles vous souhaitez afficher vos messages. Cette option n'apparaîtra que si la vue en grille est sélectionnée par opposition à la vue en liste.
  • Trier par : vous pourrez trier les publications dans la page de liste des publications sur l'un des critères suivants :
    • Du plus récent au plus ancien, c'est l'option de commande par défaut
    • Du plus ancien au plus récent
    • Alphabétique, A à Z
    • Alphabétique, de Z à A
  • Articles collants : en utilisant cette option, les articles de blog peuvent être placés en haut de la page d'accueil des articles, en les conservant jusqu'à ce qu'un nouvel article collant soit publié. Vous pouvez inclure, exclure ou afficher uniquement les messages persistants.
• Vous trouverez également l'option Filtrer dans la barre latérale de l'éditeur de blocs Query Loop, une option qui vous aidera à personnaliser davantage les publications affichées. Cette option sera invisible si vous activez l' option Hériter la requête du modèle . Pour créer un filtre pour afficher les publications sur votre page de liste de publications, vous pouvez jouer avec les options suivantes.
  • Catégories : vous devrez lister toutes les catégories de publications que vous souhaitez inclure. N'oubliez pas que vous devrez attribuer vos publications à des catégories distinctes pour que ce filtre fonctionne.
  • Auteur : vous pouvez utiliser ce filtre si vous souhaitez afficher uniquement les blogs écrits par un auteur spécifique dans votre page d'index.
  • Mot clé : si vous souhaitez filtrer les publications en fonction des mots clés que les publications peuvent inclure, utilisez cette option de filtre.
• Enfin, vous trouverez également l'option Paramètres avancés qui vous permettra d'ajouter une classe CSS personnalisée à l'aide de laquelle vous pourrez personnaliser le style de bloc selon vos préférences spécifiques. Vous pouvez également affecter un élément HTML si vous le souhaitez. Cependant, si vous n'avez pas d'expérience en développement Web frontal, nous vous recommandons de laisser cette option telle quelle et d'utiliser les autres options de personnalisation de bloc pour styliser votre bloc de boucle de requête.

Et voila! Vous pouvez utiliser les différentes options mentionnées ci-dessus dans le bloc Query Loop pour créer une page de publications pour répertorier les différentes publications sur votre site WordPress et les personnaliser comme bon vous semble. Si nécessaire, vous pouvez affecter la page des articles en tant que blog ou l'utiliser en tant que blog séparé avec des paramètres spécifiques.