Le widget Filtre de produits – Catégories qui fait partie de l’extension WooCommerce Product Search fournit un filtre de catégories de produits en direct pour votre boutique. Pendant que vos clients choisissent la catégorie souhaitée, il trouve les produits correspondants et les affiche sur la page de la boutique.

Ce filtre en direct affiche les catégories de produits sur lesquelles le client peut cliquer. Il mettra à jour la page de la boutique pour inclure les produits de la catégorie choisie.

Styles Retour au début

Le filtre de catégorie offre plusieurs styles qui fournissent une vue et une expérience utilisateur alternatives. Ceux-ci peuvent être personnalisés et incluent l’option d’afficher des vignettes pour chaque terme.

Le style Liste affiche les termes de manière verticale où les termes parents peuvent être extensibles pour afficher les termes enfants lorsque le visiteur les survole. Des paramètres peuvent être utilisés pour affiner l’apparence et le comportement.

Similaire dans son comportement au style Liste, le style Inline rend les termes de manière plus horizontale.

Le style Dropdown est également consultable et offre des paramètres pour afficher des vignettes à la fois dans la liste ainsi que pour les termes choisis. Il peut s’étendre sur l’interaction de l’utilisateur ou être utilisé avec une hauteur flexible ou fixe.

Le style Select plus traditionnel est plus simple mais similaire à la Dropdown. Sa taille peut également être spécifiée afin que vous puissiez utiliser une version plus compacte ou étendue pour afficher un certain nombre de termes.

Tous ces styles ont des paramètres spécifiques qui vous permettent de personnaliser leur apparence et de créer une expérience utilisateur adaptée. En outre, les filtres d’attributs proposent également ces styles.

Réglages Retour en haut de page

Les paramètres décrits ici déterminent l’apparence et le comportement du widget de filtre.

• Le champ Titre vous permet de définir le titre du widget. Nous recommandons de le laisser vide et de faire en sorte que le widget affiche plutôt son titre automatiquement, car il se cachera lorsqu’il n’y a pas de catégories correspondantes à afficher et s’affichera lorsqu’il y en a automatiquement. Si vous utilisez ce titre, ce ne sera pas le cas.

En-tête Retour au début

• Afficher l’en-tête – Cette option affichera l’en-tête pour ce filtre.
• En-tête – Vous pouvez entrer un en-tête personnalisé ici ou le laisser vide pour utiliser la valeur par défaut. L’en-tête ne sera pas affiché lorsqu’il n’y a pas de termes à afficher.
• En-tête pour aucun résultat – Vous pouvez saisir le texte d’un en-tête alternatif à afficher lorsqu’il n’y a pas de résultats.

Affichage Retour en haut

Selon le style choisi, certaines options peuvent ou non être disponibles.

• Afficher sur les pages de la boutique uniquement – Utilisez cette option pour afficher le widget sur les pages de la boutique pertinentes uniquement. Cela inclut la page de la boutique, la balise du produit et les pages de catégorie de produits, etc.
• Style – Offre des options sur la façon d’afficher les termes : Liste, Inline, Select ou Dropdown.
• Afficher les vignettes / Parents – Activez cette option pour afficher les vignettes des termes. Une option distincte est fournie pour afficher les vignettes des termes parents.
• Afficher les vignettes pour les sélectionnés – Disponible lorsque Dropdown est choisi comme Style. Si elle est activée, affiche les vignettes également pour les termes sélectionnés.
• Afficher les noms / Parents – Activez cette option pour afficher les noms des termes. Une option distincte est fournie pour les afficher pour les termes parents.
• Afficher le nombre de produits – Si cette option est activée, le nombre de produits liés par terme sera affiché.
• Masquer les termes sans produits – Cela masquera automatiquement les termes qui n’ont pas de produits liés.
• Texte pour aucune sélection – Cette option est disponible lorsque Dropdown est choisi comme Style et détermine le texte qui est affiché dans le champ Dropdown lorsqu’aucun élément n’est sélectionné.
• Nombre de termes – Si un nombre est donné, cela limite le nombre de termes affichés.
• Taille – Disponible lorsque Select est choisi comme Style. Détermine la taille d’affichage de la boîte de sélection.
• Hauteur – Disponible lorsque Dropdown est choisi comme Style. Si elle est laissée vide, les choix de la liste déroulante s’affichent en dessous lorsque le champ prend le focus. Si un nombre simple est saisi, par exemple 5, la liste déroulante adoptera une hauteur fixe pour afficher le nombre d’entrées indiqué. Si un nombre avec une unité CSS* est utilisé, par exemple 120px, la liste déroulante adoptera une hauteur fixe selon l’unité indiquée. *Unités CSS autorisées : px, mm, cm, in, pt, pc, em , ex, ch, rem, vw et vh.
• Basculer le composant – Masquer le composant de filtrage lorsqu’il n’a aucune option, « yes » (par défaut) ou « no ».
• Basculer le widget – Masquer le widget lorsque le composant n’a pas d’options, « oui » (par défaut) ou « non ».

Order Back to top

• Order by … – Utilisez cette option pour déterminer l’ordre dans lequel les termes sont affichés. Vous pouvez choisir de les ordonner selon l’un de plusieurs critères, comme par exemple le Nom du terme pour un classement alphabétique ou l’Ordre des termes pour les afficher comme établi dans la liste des catégories de produits.

Navigation Retour en haut

Les options de cette section déterminent comment la hiérarchie des catégories de produits est présentée au visiteur et comment il interagira.

Si vous utilisez les valeurs par défaut, les catégories racines s’afficheront et leurs enfants seront cachés.

Si vous survolez une catégorie avec des enfants, elle se développera et révélera ses enfants. Cela continue tant qu’il y a des enfants plus bas dans la hiérarchie.

Sur les appareils tactiles, vous pouvez toucher le symbole d’expansion d’une catégorie pour afficher ses enfants.

Voici un exemple montrant seulement les catégories racines avec leurs expanseurs:

Voici la même zone mais maintenant les enfants des deux catégories ont été développés:

Les options qui contrôlent l’expérience de navigation à travers les catégories de produits sont:

• Développer les termes enfants – Ici, vous pouvez déterminer à quel niveau les catégories vont cacher leurs enfants. Par défaut, seules les catégories racines sont affichées et si elles ont des enfants, un symbole d’expansion est affiché.
• Développer automatiquement – Ceci est activé par défaut afin que les catégories extensibles révèlent automatiquement leurs enfants au survol. Si vous le désactivez, vous devez cliquer explicitement sur l’expandeur pour voir les enfants, tout comme vous devez le toucher sur les appareils tactiles.
• Rétracter automatiquement – Lorsque vous sortez de la zone où les catégories sont affichées, les enfants seront automatiquement cachés. Ceci est activé par défaut.
• Afficher les expanseurs – Ceci affichera les expanseurs et les rétracteurs pour les catégories avec des enfants.
• Afficher la hiérarchie des ancêtres – Ceci détermine si la hiérarchie des ancêtres basée sur le contexte actuel est affichée.
• Afficher la navigation des parents – Si cette option est activée, des liens supplémentaires pour les ancêtres sont affichés, ce qui permet de naviguer en arrière dans la hiérarchie.

Termes Retour au début

• Profondeur – Cette option permet de limiter la profondeur dans la hiérarchie des termes.
• Filtre – Cette option doit être activée pour le filtrage en direct.
• Hiérarchique – Si les termes doivent être affichés sous forme de hiérarchie.
• Multiple – Si vous voulez laisser les visiteurs sélectionner plus d’un terme, activez cette option.
• Afficher – Cela déterminera si a) Tous les termes sont affichés, ou b) avec Définir, seuls ceux qui sont dans la hiérarchie du terme sélectionné sont affichés.
• Termes à inclure – Vous pouvez indiquer les termes qui doivent être inclus ici. S’il est laissé vide, tous les termes sont affichés. Indiquez les termes par ID, slug ou nom et séparés par une virgule.
• Termes à exclure – Indiquez les termes qui doivent être exclus ici par ID, slug ou nom et séparés par une virgule. Si des termes à inclure sont donnés, ils remplacent complètement ce champ – utilisez l’un ou l’autre mais pas les deux.
• Terme parent – Cela limitera les termes affichés aux enfants de celui indiqué. Le jeton {actuel} peut être utilisé pour le limiter aux enfants du terme actuel.

Avancé Retour au début

Les options avancées devraient être laissées à leurs valeurs par défaut, à moins qu’il soit nécessaire d’aborder un cas spécifique avec ce filtre.

• ID de l’en-tête – Ceci définit l’ID de l’élément d’en-tête.
• Classe d’en-tête – Ceci définit la classe de l’élément d’en-tête.
• Élément d’en-tête – Ici, vous pouvez choisir quelle balise HTML est utilisée comme élément d’en-tête.
• ID du conteneur – Ceci définit l’ID de l’élément conteneur div principal du filtre.
• Classe du conteneur – Ceci ajoute à la classe de l’élément conteneur div principal du filtre.