Créer une page de catégorie en utilisant la grille de boucle ou le carrousel de boucle

Les requêtes de taxonomie vous permettent de créer des boucles basées sur les catégories ou étiquettes d’articles ou de produits. Par exemple, si vous tenez un blog culinaire, vous pouvez créer une grille de boucle ou un carrousel de boucle affichant les catégories d’articles – Entrées, Soupes, Desserts etc.

Créer une page de catégorie

L’exemple ci-dessous montre une requête de taxonomie pour les articles dans une grille de boucle, mais les mêmes principes s’appliquent aux produits et au carrousel de boucle.

Pour plus de détails sur la création d’une grille de boucle, voir Construire une grille de boucle.

Pour créer une requête de taxonomie :

1. Faites glisser la grille de boucle sur la toile. Pour plus de détails, voir Ajouter des éléments à une page.
   
   Une grille de boucle apparaît sur la toile.
2. Dans le panneau, allez dans le menu déroulant Choisir le type de modèle et sélectionnez Taxonomie d’article.
   
   Si WooCommerce est installé, une option « Taxonomie de produit » apparaîtra également.
   
3. Cliquez sur Créer un modèle.
   Lorsque nous construisons le modèle, nous utiliserons des informations dynamiques. Par exemple, au lieu de saisir les noms de catégories, nous utiliserons l’étiquette dynamique « Titre d’archive ». Cela récupérera automatiquement les noms de catégories sans avoir à les saisir manuellement. Pour plus d’informations, voir Étiquettes dynamiques.
   
   Important

   Les boucles de taxonomie pour les articles peuvent utiliser les étiquettes dynamiques suivantes :

   • Titre d’archive
   • Description d’archive
   • URL d’archive
   • Vous pouvez également ajouter des images pour vos catégories en utilisant les images de taxonomie ACF. Voir Ajouter une image aux catégories d’articles pour plus de détails.  
   
   
4. Dans la fenêtre contextuelle, cliquez sur Enregistrer.
   
5. Faites glisser un widget Titre vers le modèle que vous venez de créer.
   
6. Dans le panneau, cliquez sur l’icône dynamique à côté de Titre. 
   
7. Sélectionnez Titre d’archive dans le menu déroulant.
   
   Note

   Dans WordPress, les taxonomies d’articles et de produits sont considérées comme un type d’archive.
   
   
   Habituellement, vous ne voulez pas que le mot Catégorie apparaisse dans la boucle, nous allons donc le supprimer.
   
8. Dans le panneau, dans le champ Titre, cliquez sur l’icône clé à molette pour accéder aux Paramètres.
   
9. Dans la fenêtre, basculez Inclure le contexte sur Non.
   Maintenant nous allons ajouter la description de catégorie.
   
10. Ajoutez un widget Éditeur de texte au modèle et en utilisant l’étiquette dynamique, sélectionnez Description d’archive.
    
11. Cliquez sur Enregistrer et retour pour sauvegarder le modèle.
    

Vous verrez comment les visiteurs visualiseront la page.

Vous pouvez styliser la page en utilisant les contrôles trouvés dans la grille de boucle ou le carrousel de boucle. Pour plus de détails, voir Widget grille de boucle et Carrousel de boucle.  

Rendre les catégories cliquables

Maintenant que vous avez créé une page de catégorie, vous devez la rendre utile. En général, les utilisateurs s’attendent à cliquer sur une catégorie et être dirigés vers une page de catégorie.  

Il y a deux façons de rendre les éléments cliquables :

• Vous pouvez rendre un des éléments cliquable. Par exemple, rendre le titre cliquable pour que les visiteurs puissent cliquer sur le titre et aller à la page de catégorie.
• Vous pouvez rendre le conteneur cliquable pour que les visiteurs puissent cliquer n’importe où dans le conteneur et aller à la page de catégorie. 

Dans cet exemple, nous rendrons le conteneur cliquable.

Pour rendre une catégorie cliquable :

1. Lors de l’édition du modèle, sélectionnez le conteneur en cliquant sur l’icône dans le coin supérieur gauche.
   
   Les paramètres du conteneur apparaîtront dans le panneau.
   
2. Dans le panneau, ouvrez la section Options supplémentaires.
   
3. Dans le menu déroulant Balise HTML, sélectionnez a (lien).
   
4. Dans le champ Lien, cliquez sur l’icône d’étiquette dynamique .
   
5. Sélectionnez URL d’archive dans la liste.

Lorsque les visiteurs cliquent sur le conteneur, ils iront à la page de catégorie.

Ajouter une image aux catégories d’articles

Vous pouvez ajouter des images aux catégories de produits en utilisant WooCommerce et ensuite ajouter ces images mises en avant à votre modèle. Cependant, pour les articles, vous devrez utiliser le plugin tiers ACF pour ajouter des images à votre catégorie. Pour plus d’informations sur la façon d’attacher des images aux catégories, consultez la documentation ACF.

Une fois ces images attachées à vos catégories, vous pouvez les ajouter à votre boucle.

Dans l’exemple suivant, les images de catégorie sont dans un champ intitulé Image mise en avant.  

Pour ajouter des images au modèle :

1. Ajoutez un widget Image.
   
   Note

   Ces étapes s’appliquent à tout widget qui utilise des images.
   
   
2. Dans le panneau, dans l’onglet Contenu, cliquez sur l’icône d’étiquette dynamique .
   
3. Dans le menu déroulant, sélectionnez Champ image ACF.
   
4. Dans le champ dynamique, cliquez sur l’icône clé.
   
5. Dans le menu déroulant Clé, sélectionnez le champ que vous avez choisi pour les images de catégorie.

Le modèle affichera maintenant les images de catégorie.