Tutoriels WordPress de confiance, quand vous en avez le plus besoin.
Guide du débutant pour WordPress
WPB Cup
25 millions+
Sites web utilisant nos plugins
16+
Années d'expérience WordPress
3000+
Tutoriels WordPress par des experts

Comment j'ai configuré les filtres de produits WooCommerce et arrêté de perdre des clients

La première fois que j'ai ajouté des filtres de produits à ma boutique WooCommerce, ce fut un désastre. Ils semblaient avoir été conçus en 1999, ont plus embrouillé mes clients qu'ils ne les ont aidés, et le pire de tout, ils ont cassé ma page de paiement. J'ai dû les retirer en quelques heures.

Mais je savais que ma boutique avait besoin de filtres. Lorsque vous avez des centaines de produits, les clients cherchent un moyen de réduire rapidement leurs choix. Sans un filtrage approprié, ils sont dépassés et partent, emportant leur argent avec eux.

Alors j'ai retroussé mes manches et j'ai testé toutes les solutions de filtrage WooCommerce majeures que j'ai pu trouver. Après des semaines de tests, j'ai trouvé les meilleurs plugins : faciles à installer, beaux à regarder, et surtout, ils aident les clients à trouver (et acheter) ce dont ils ont besoin.

Dans ce guide, je vais vous expliquer comment j'ai configuré mes filtres de produits WooCommerce afin que vous puissiez également arrêter de perdre des prospects.

Comment j'ai configuré les filtres de produits WooCommerce et arrêté de perdre des clients

🧑‍💻 TL;DR : Ce guide vous présente deux façons d'ajouter des filtres de produits dans WooCommerce. WPFilters est idéal si vous souhaitez des filtres modernes, de style Amazon. Filter Everything est une option simple et gratuite si vous n'avez besoin que de filtrage de base.

Pourquoi ajouter des filtres de produits WooCommerce ?

Les filtres de produits permettent aux acheteurs de trouver plus facilement exactement ce qu'ils recherchent. Au lieu de faire défiler de longues listes de produits, ils peuvent affiner les résultats par prix, taille, couleur, note, et plus encore — en quelques clics seulement.

C'est important car une mauvaise navigation entraîne souvent l'abandon de panier et des ventes perdues. Lorsque les visiteurs ne trouvent pas rapidement ce dont ils ont besoin, beaucoup d'entre eux repartent sans rien acheter.

De plus, l'ajout de filtres à votre boutique WooCommerce peut réduire considérablement vos taux de rebond. Les clients passent plus de temps à naviguer et finalisent leurs achats.

L'ajout de filtres de produits permet d'améliorer à la fois l'expérience d'achat et les performances de votre boutique. Voici comment :

  • ⏱️ Faites gagner du temps à vos clients – Les acheteurs peuvent réduire des centaines de produits à quelques correspondances pertinentes en quelques secondes, ce qui rend la navigation plus rapide et moins frustrante.
  • 📈 Augmenter les ventes – Lorsque les clients trouvent rapidement le bon produit, ils sont plus susceptibles de l'ajouter à leur panier et de finaliser le processus de paiement.
  • 🧑‍💻 Augmenter le temps de visite – Des filtres clairs incitent les visiteurs à explorer votre boutique au lieu de chercher ailleurs.
  • 📱 Améliorez l'expérience d'achat mobile – Les filtres permettent aux utilisateurs mobiles de parcourir votre catalogue beaucoup plus facilement, sans avoir à faire défiler sans fin sur un petit écran.
  • 🌟 Renforcer la confiance des clients – Une boutique propre et bien organisée montre que vous vous souciez de l'expérience d'achat, ce qui contribue à établir la confiance dans votre marque.

Gardez cela à l'esprit, je vais vous expliquer comment ajouter des filtres de produits WooCommerce. Voici tout ce que je vais couvrir dans ce guide :

🛑 Important : Les filtres de produits dépendent des attributs de produits. Assurez-vous d'avoir réellement ajouté des attributs tels que la taille, la couleur ou le prix à vos produits dans WooCommerce. Si vous ne l'avez pas encore fait, consultez notre guide sur l'ajout d'étiquettes, d'attributs et de catégories de produits.

Méthode 1 : Ajouter un filtre de produits WooCommerce de style Amazon (recommandé)

WPFilters est le meilleur plugin de filtre WooCommerce – il est convivial pour les débutants et a fière allure dès le départ. Vous n'avez pas besoin d'être un développeur pour le configurer, et il donne à votre boutique des filtres épurés, de style Amazon, qui facilitent la recherche de ce que les clients recherchent.

De plus, il fonctionne à merveille avec n'importe quel thème WooCommerce, ce qui en fait un choix sûr, quel que soit le thème que vous utilisez.

Pour plus d'informations sur cet outil, consultez notre avis détaillé sur WPFilters.

Étape 1 : Installer et activer WPFilters

Pour commencer le filtrage de produits, vous devrez installer WPFilters.

Tout d'abord, vous devrez créer un compte WPFilters sur le site web de SearchWP. SearchWP est la société derrière WPFilters, et ils offrent un support fiable si vous avez besoin d'aide.

Cliquez sur le bouton Obtenir WPFilters maintenant, choisissez un plan, et suivez les étapes pour finaliser votre achat.

Page d'accueil de WPFilters

💡 Remarque : SearchWP est un plugin premium qui vous donne un contrôle total sur le fonctionnement de la recherche sur votre site WordPress, y compris les fonctionnalités de filtrage via WPFilters. Il existe également un plugin gratuit appelé SearchWP Live AJAX Search qui vous permet d'ajouter des résultats de recherche en direct.

Une fois que vous vous êtes inscrit, connectez-vous à votre tableau de bord de compte et téléchargez le fichier ZIP du plugin. Vous le trouverez dans la zone de téléchargement de votre compte.

Vous êtes maintenant prêt à installer et activer le plugin. Dans votre tableau de bord d'administration WordPress, allez à Plugins » Ajouter un plugin.

Le sous-menu Ajouter un plugin sous Plugins dans la zone d’administration de WordPress

Sur l'écran suivant, cliquez sur « Téléverser un plugin » pour ouvrir l'outil de téléchargement de fichiers.

Cliquez ensuite sur le bouton « Choisir un fichier », sélectionnez le fichier zip sur votre ordinateur local, puis cliquez sur « Installer maintenant ».

Sélectionner le fichier zip du plugin à télécharger et installer dans WordPress

N'oubliez pas de cliquer sur « Activer » pour terminer le processus d'installation. Si vous avez besoin d'aide, consultez notre guide pour débutants sur comment installer un plugin WordPress.

Après l'activation, WPFilters lancera automatiquement un assistant de configuration pour vous aider à démarrer. Cliquez sur le bouton « Commencer ».

L'assistant d'installation convivial de WPFilters

Cet assistant vous guidera ensuite à travers la configuration de base et connectera le plugin à votre boutique WooCommerce.

Suivez simplement les instructions à l'écran dans l'assistant de configuration. Le processus ne prend qu'une minute ou deux et garantit que tout est correctement configuré pour votre boutique.

Étape 2 : Créer un nouvel élément de filtre pour vos produits WooCommerce

Maintenant que WPFilters est installé, il est temps de créer votre premier élément de filtre. Un élément de filtre est simplement une option de filtrage que les clients peuvent utiliser, comme le filtrage par couleur ou par taille.

Pour commencer, accédez à WPFilters » Éléments dans votre tableau de bord d'administration WordPress. Cliquez ensuite sur le bouton « Ajouter » en haut de la page.

Ajout d'un nouvel élément WPFilters

Tout d'abord, vous devrez entrer un nom pour votre filtre.

Ce nom est uniquement pour votre référence dans la zone d'administration. Mais je recommande de choisir quelque chose de descriptif comme « Couleur » ou « Filtre » pour une organisation plus facile.

Nommage de l'élément WPFilters

Ensuite, vous choisirez le type de champ de filtre qui détermine comment les clients interagiront avec ce filtre.

WPFilters offre plusieurs options :

  • Case à cocher – Permet aux clients de sélectionner plusieurs options à la fois
  • Radio – N'autorise qu'une seule sélection à la fois
  • Liste déroulante – Affiche les options dans un menu déroulant pour gagner de la place
  • Liste déroulante (Sélection multiple) – Le type de liste déroulante qui permet plusieurs sélections
  • Recherche – Ajoutez une barre de recherche pour que les clients puissent taper ce qu'ils recherchent
  • Curseur – Parfait pour les gammes de prix ou les valeurs numériques
  • Réinitialiser – Ajoutez un bouton pour effacer tous les filtres sélectionnés

Pour la plupart des attributs de produits, tels que la couleur, la taille ou la marque, je recommande d'utiliser l'option case à cocher. C'est le moyen le plus simple pour les clients et cela leur permet de combiner plusieurs sélections.

Choix du champ de filtre de produit dans WPFilters

Après avoir choisi votre type de filtre, vous devrez ajouter une source de données. Cela indique à WPFilters par quelles informations produit filtrer, telles que les catégories de produits, les tags ou les attributs personnalisés.

Cliquez sur la liste déroulante de la source de données et sélectionnez l'attribut sur lequel vous souhaitez filtrer. Si vous avez configuré des attributs de produit dans WooCommerce, ils apparaîtront dans cette liste.

Choix de la source de données pour l'élément WPFilters
Étape 3 : Personnaliser votre filtre de produits WooCommerce

Une fois votre élément de filtre créé, vous pouvez maintenant personnaliser son apparence et son comportement sur votre boutique. WPFilters vous offre plusieurs options pour que le filtre corresponde à votre marque et améliore l'expérience utilisateur.

Vous pouvez commencer par ajuster les paramètres dans la section « Conteneur », où vous pouvez :

  • Afficher le titre – Pour afficher ou masquer le nom du filtre au-dessus des options.
  • Dépliable – Utile si vous avez plusieurs filtres sur une page. Les clients peuvent développer ou réduire chaque filtre pour garder la mise en page épurée.
  • Voir plus/moins – Limitez le nombre d'options affichées au début et laissez les clients développer la liste s'ils souhaitent en voir plus. Cela permet d'éviter que de longues listes de filtres n'envahissent la page.
  • Horizontal – Affichez les options de filtre en ligne au lieu d'une colonne. Cela fonctionne bien pour les filtres simples avec peu de choix, comme les tailles.

Voici comment j'ajuste mes paramètres de « Conteneur » :

Configuration du conteneur de l'élément

Ensuite, dirigez-vous vers la section des paramètres d'élément.

  • Nombre d'éléments – Indique combien de produits correspondent à chaque option. Par exemple, les clients verront Bleu (15) ou Rouge (8), afin de savoir ce qui est disponible avant de cliquer.
  • Vide – Masque les options sans produits correspondants, ce qui permet de garder vos filtres propres et d'éviter les impasses.
  • Hiérarchique – Regroupe les options liées, permettant aux clients de descendre d'une catégorie principale dans des sous-catégories, ce qui le rend parfait pour les grands magasins.

Une fois que vous avez ajusté ces paramètres, cliquez sur « Enregistrer les modifications » pour sauvegarder votre configuration.

Configuration des paramètres des éléments

WPFilters mettra alors à jour l'aperçu en direct à l'intérieur de ce constructeur.

Si quelque chose ne semble pas tout à fait correct, vous pouvez revenir en arrière et ajuster les paramètres jusqu'à ce que ce soit parfait.

Aperçu en direct du filtre de couleur dans le constructeur de WPFilters
Étape 4 : Intégrer le filtre dans votre boutique

Maintenant que votre filtre est prêt, il est temps de l'ajouter à votre boutique en ligne. WPFilters vous offre des options flexibles pour l'endroit où vous souhaitez afficher vos filtres.

Vous pouvez ajouter des filtres directement à votre page de boutique où les clients parcourent les produits, ou les placer dans votre barre latérale pour un accès facile sur n'importe quelle page.

Laissez-moi vous montrer les deux méthodes afin que vous puissiez choisir celle qui convient le mieux à votre magasin.

Option 1 : Afficher le filtre d'attributs de produit sur la page de boutique WooCommerce

Si vous utilisez un thème basé sur des blocs (comme Divi ou Twenty Twenty-Five), vous pouvez simplement ouvrir votre page Boutique dans l'Éditeur de site et y glisser le bloc Filtre.

💡 Remarque : Si vous utilisez un thème classique, vous ne pouvez généralement pas modifier la mise en page de la page Boutique directement car WooCommerce la contrôle. Pour les thèmes classiques, je recommande vivement d'ajouter plutôt le widget de filtre à votre barre latérale (voir Option 2).

Tout d'abord, dans le constructeur visuel WPFilters, cliquez sur le bouton « Intégrer ».

Le bouton d'intégration dans le constructeur d'éléments WPFilters

Sélectionnez ensuite la méthode de bloc Gutenberg parmi les options disponibles.

Ensuite, vous choisirez si vous souhaitez créer une nouvelle page ou en sélectionner une existante.

Assistant d'intégration avec les champs de mode d'intégration et de page cible

Si vous avez déjà une page de boutique configurée, sélectionnez-la simplement dans le menu déroulant.

Cliquez sur « C'est parti ! »

Intégrer des filtres sur la page de la boutique

Le constructeur visuel ouvrira alors votre page de boutique dans l'éditeur de blocs.

Ensuite, cliquez simplement sur l'icône « + » pour ajouter un bloc WPFilters Element.

Ajout de l'élément WPFilters dans l'éditeur de blocs

Dans le panneau des paramètres du bloc, sélectionnez l'élément de filtre que vous venez de créer.

Vous le verrez apparaître instantanément dans votre éditeur de contenu.

Sélection de l'élément WPFilters à intégrer

Vous pouvez répéter ce processus pour tous les éléments WPFilters que vous avez créés.

Une fois terminé, cliquez sur « Enregistrer les modifications » ou « Mettre à jour » pour publier votre filtre.

C'est tout : votre filtre de produits WPFilters est maintenant en ligne sur votre page de boutique et prêt à être utilisé par les clients :

Éléments de filtre WPFilters sur une boutique WooCommerce en direct
Option 2 :  Afficher le filtre d'attributs de produit dans la barre latérale

Ajouter des filtres à votre barre latérale est une autre excellente option, surtout si vous souhaitez qu'ils soient visibles sur plusieurs pages. La barre latérale maintient vos filtres accessibles sans prendre de place dans votre zone de contenu principale.

Pour ajouter un filtre à votre barre latérale, accédez à Apparence » Widgets dans votre zone d'administration. Cela ouvre le personnalisateur de widgets, où vous pouvez gérer le contenu de votre barre latérale.

Accès à l'éditeur de widgets

💡 Remarque : Si vous ne voyez pas le menu Widgets, vous utilisez probablement un thème basé sur des blocs. Dans ce cas, veuillez utiliser l'Option 1 pour modifier directement le modèle de votre site.

À partir de là, vous pouvez rechercher la barre latérale WooCommerce dans la liste des zones de widgets disponibles. Cliquez dessus pour développer la barre latérale et voir quels widgets s'y trouvent actuellement.

Ensuite, cliquez sur l'icône plus pour ajouter un nouveau widget, puis ajoutez le widget Élément WPFilters.

Ajout de l'élément WPFilters à la barre latérale WooCommerce

Dans le panneau des paramètres de l'élément qui apparaît, sélectionnez votre filtre dans le menu déroulant.

Vous pouvez ajouter plusieurs widgets de filtre pour offrir aux clients plusieurs options de filtrage.

Sélection de l'élément WPFilters à ajouter

Une fois que vous avez sélectionné votre filtre, cliquez sur « Mettre à jour » ou « Publier » pour enregistrer les modifications de votre barre latérale.

Votre filtre apparaîtra désormais sur toutes les pages WooCommerce qui affichent cette barre latérale :

Le filtre WPFilters sur la page Boutique
Étape 5 : Tester votre filtre de produits WooCommerce

Avant de terminer, prenez quelques minutes pour tester vos filtres. Ouvrez votre boutique dans une fenêtre de navigation privée afin de la voir de la même manière que vos clients.

Essayez différentes combinaisons de filtres pour vous assurer que les résultats se mettent à jour correctement. Par exemple, sélectionnez « Vert » et vérifiez que seuls les produits correspondants apparaissent.

Test du filtre de produits WPFilter

Il est également conseillé de tester chaque attribut que vous avez ajouté pour vous assurer que la logique de filtrage fonctionne sans problème. Portez également attention aux décomptes de produits à côté de chaque option. Ils devraient changer lorsque vous appliquez ou supprimez des filtres.

Si quelque chose ne semble pas correct, vérifiez vos attributs de produit dans WooCommerce. Une fois que tout fonctionne correctement, vos filtres sont prêts et faire des achats sur votre boutique vient de devenir beaucoup plus facile.

Méthode 2 : Ajouter un filtre de produit WooCommerce simple (méthode gratuite)

Si vous recherchez une alternative plus simple à WPFilters, alors Filter Everything est une bonne option. J'ai choisi ce plugin car il est léger et offre une version gratuite avec toutes les fonctionnalités de filtrage importantes.

Notez que Filter Everything fonctionne et rend mieux sur les thèmes classiques. Il ne prend pas en charge les blocs, vous devrez donc utiliser un shortcode, ce qui est généralement moins flexible.

Étape 1 : Installer et configurer le plugin

Tout d'abord, allez dans Plugins » Ajouter un plugin dans votre espace d'administration WordPress.

Le sous-menu Ajouter un plugin sous Plugins dans la zone d’administration de WordPress

Sur l'écran suivant, utilisez la barre de recherche pour trouver rapidement le plugin Filter Everything.

Ensuite, cliquez sur « Installer maintenant » puis sur « Activer » dans les résultats de recherche pour terminer le processus.

Installation de Filter Everything

Pour obtenir de l'aide, consultez notre guide sur comment installer un plugin WordPress.

Après l'activation, accédez à Filter Everything » Settings pour configurer quelques options importantes. Ces paramètres contrôlent le comportement de vos filtres sur le front-end de votre boutique.

Configuration des paramètres de Filter Everything

Tout d'abord, vous pouvez configurer le comportement mobile et les paramètres AJAX :

  • Appareils mobiles – Choisissez si les filtres sont réduits sur mobile ou affichés comme sur ordinateur. Je recommande de les laisser réduits et de les déplacer vers le haut, afin qu'ils soient plus faciles à trouver et ne prennent pas trop de place sur les petits écrans.
  • AJAX – Choisissez si les filtres mettent à jour les résultats instantanément ou rechargent la page après chaque sélection. Vous voudrez l'activer pour que les produits se mettent à jour instantanément sans que toute la page ne se recharge, créant ainsi une expérience d'achat plus rapide.

Vous verrez également « ID HTML ou classe du conteneur des articles ». Cela indique au plugin quelle partie de la page doit être mise à jour lorsque les filtres sont appliqués. Il est défini sur #primary par défaut, et dans la plupart des cas, vous pouvez le laisser tel quel en toute sécurité.

Configuration du mobile et de l'AJAX

Enfin, rendez-vous dans la section « Autres » pour affiner quelques options visuelles et avancées :

  • Couleur primaire du widget – Elle affecte les boutons et les cases à cocher des filtres, alors choisissez une couleur qui correspond au schéma de couleurs de votre marque.
  • Hauteur maximale du conteneur de filtre, px – Définit une hauteur maximale pour la zone de filtre. Si la liste devient trop longue, elle devient déroulante au lieu de faire descendre la page.
  • Intégration des filtres sélectionnés (puces) – Vous permet d'afficher les filtres actifs sous forme de petites « puces ». Vous pouvez choisir où elles apparaissent en ajoutant un nom d'emplacement, tel que before_main_content.
  • Mode de débogage – Affiche des messages utiles si quelque chose ne fonctionne pas, ce qui peut être utile lors de la configuration.

Voici à quoi cela ressemble sur mon écran :

Consultation de la section Autres paramètres

Une fois que vous avez ajusté ces paramètres, cliquez sur « Enregistrer les modifications » pour sauvegarder votre configuration.

Étape 2 : Créer un ensemble de filtres

Il est maintenant temps de créer un ensemble de filtres, qui est simplement un groupe de plusieurs filtres qui fonctionnent ensemble. Par exemple, vous pourriez avoir des filtres pour les catégories, les couleurs et les tailles dans un seul ensemble.

Accédez à Filter Everything » Filter Sets dans votre tableau de bord WordPress. C'est ici que vous organiserez et gérerez tous vos filtres de produits.

Accès à la section Ensembles de filtres

Cela vous mènera au constructeur d'ensembles de filtres.

Cliquez sur le bouton « Ajouter un nouvel ensemble de filtres » pour commencer à créer votre premier ensemble.

Ajouter un ensemble de filtres

Ensuite, vous pouvez lui donner un nom descriptif.

Ceci est uniquement pour votre référence, mais je recommande d'utiliser un nom descriptif, comme « Filtres de produits » ou simplement « Filtres », pour une organisation plus facile.

Nommer l'ensemble de filtres

Ensuite, choisissez le type de publication que vous souhaitez filtrer : pages, articles, produits ou types de publication personnalisés.

Comme vous travaillez avec des produits WooCommerce, sélectionnez « Produit » dans le menu déroulant et cliquez sur « Ajouter un filtre ».

Choisir le produit comme type de publication et cliquer sur Ajouter

Maintenant, vous allez configurer votre premier filtre individuel dans cet ensemble :

  • Filtrer par – choisissez « Catégories de produits » dans le menu déroulant. Cela indique au plugin de filtrer vos produits en fonction des catégories qui leur sont attribuées.
  • Titre du filtre – Utilisez quelque chose comme Catégories ou Catégories de produits, ce qui convient le mieux à votre boutique.
  • Nom de variable pour l'URL – ce champ est rempli automatiquement avec quelque chose comme categories. Il permet de créer des URL propres et optimisées pour le référencement lorsque les clients utilisent vos filtres.
  • Afficher dans le widget – un menu déroulant fonctionne bien pour les catégories, car les produits peuvent appartenir à de nombreuses catégories, et il facilite également la visualisation des sous-catégories.

💡 Remarque : Filter Everything propose plusieurs options d'affichage en fonction de votre plan :

  • Cases à cocher
  • Curseurs de plage
  • Listes
  • Champs de recherche
  • Note
  • Menus déroulants

Vous pouvez choisir le style qui correspond le mieux au design de votre boutique et aux besoins de vos clients.

Création d'un filtre

Vous pouvez ajouter d'autres filtres à cet ensemble en cliquant à nouveau sur « Ajouter un filtre ». Je recommande d'ajouter des filtres pour le prix, la couleur, la taille ou tout autre attribut de produit que votre boutique utilise.

Une fois que vous avez ajouté tous les filtres dont vous avez besoin, cliquez sur « Publier » pour activer votre ensemble de filtres.

Le bouton Publier dans Filter Everything
Étape 3 : Ajouter des filtres à votre boutique WooCommerce

Avec votre jeu de filtres créé, vous êtes prêt à l'afficher sur votre boutique WooCommerce. Filter Everything vous offre des options flexibles pour l'emplacement de vos filtres.

Laissez-moi vous montrer comment ajouter des filtres directement dans votre barre latérale pour un accès facile, ou dans le contenu de votre page de boutique en utilisant les blocs Gutenberg.

Option 1 : Afficher le filtre de produit simple dans la barre latérale

L'ajout de filtres à votre barre latérale est rapide et fonctionne très bien si vous souhaitez qu'ils soient visibles sur plusieurs pages WooCommerce. La barre latérale maintient vos filtres accessibles sans occuper d'espace de contenu précieux.

Accédez à Apparence » Widgets dans votre tableau de bord WordPress. Cela ouvre le personnalisateur de widgets où vous gérez tout le contenu de votre barre latérale.

Accès à l'éditeur de widgets

💡 Remarque : Si vous ne voyez pas ce menu, vous utilisez probablement un thème de blocs moderne et devriez utiliser la méthode de l'éditeur (Option 2) à la place.

Dans le panneau des widgets, recherchez votre zone de barre latérale WooCommerce.

Cliquez ensuite sur le bouton « + » pour ajouter le widget Filter Everything – Filter.

Ajout du widget Filter Everything - Filtre

Les paramètres du widget s'ouvriront automatiquement. Ensuite, vous pouvez choisir ce qu'il faut afficher :

  • Titre – Affiche le titre du filtre en haut du widget.
  • Le nombre d'articles trouvés – Affiche le nombre de produits correspondant aux filtres sélectionnés.
  • Termes sélectionnés (Puces) – Affiche les filtres actifs sous forme de petites puces, afin que les clients puissent voir ce qui est appliqué en un coup d'œil.
  • Mise en page horizontale – Affiche les filtres en ligne au lieu d'une colonne, ce qui fonctionne bien pour les mises en page compactes.

Voici ce que vous verrez à l'écran :

Options de personnalisation du filtre Filter Everything - Filtre

Vous pouvez jouer avec ces paramètres pour qu'ils correspondent à la conception de votre boutique.

Lorsque vous avez terminé, cliquez sur « Mettre à jour » pour publier votre widget.

Mise à jour du widget

C’est tout !

Vos filtres apparaîtront maintenant dans la barre latérale sur toutes les pages qui affichent cette zone de barre latérale.

Filtre de produits Filter Everything dans une barre latérale
Option 2 : Afficher le filtre de produits simple sur la page de la boutique WooCommerce

Pour ajouter des filtres directement à votre page de boutique, vous utiliserez le shortcode [fe_widget] dans l'éditeur Gutenberg.

Si vous avez plus d'un ensemble de produits, vous devrez ajouter son ID dans ce shortcode, par exemple, [fe_widget id="123"]. Vous pouvez trouver ce numéro d'ID à côté du nom de votre ensemble sur la page Filter Everything » Filter Sets.

Pour ajouter votre filtre de produit, accédez à Pages » Toutes les pages pour ouvrir votre page de boutique dans l'éditeur de blocs.

Modification de la page Boutique

🧑‍💻 Astuce de pro : Si vous n'êtes pas sûr de quelle page est votre page de boutique, vérifiez sous WooCommerce » Réglages » Produits.

Dans l'éditeur Gutenberg, collez le shortcode que vous avez copié précédemment dans un bloc de paragraphe ordinaire.

Ajout du shortcode Filter Everything dans l'éditeur de blocs

Si vous voulez voir à quoi cela ressemble, prévisualisez simplement votre page. Ils devraient apparaître exactement là où vous avez placé le bloc shortcode.

Une fois que vous êtes satisfait de l'emplacement, cliquez sur « Mettre à jour » ou « Publier » pour enregistrer vos modifications.

Vos filtres de produits sont maintenant en ligne sur votre page de boutique :

Astuce bonus : Ajouter une recherche intelligente de produits WooCommerce

Maintenant que vous avez ajouté des filtres de produits, une fonctionnalité supplémentaire peut faire passer la navigation de votre boutique en ligne au niveau supérieur : la recherche intelligente de produits.

Alors que les filtres aident les clients à naviguer par attributs spécifiques, une barre de recherche intelligente de produits leur permet de taper exactement ce qu'ils recherchent. Cette combinaison offre aux acheteurs la flexibilité de trouver des produits comme ils le souhaitent.

La recherche intelligente de produits WooCommerce va au-delà de la recherche de base de WordPress. Elle comprend les attributs des produits, les catégories, les SKU, et même les correspondances partielles pour afficher rapidement des résultats pertinents.

Création d'une recherche de produits intelligente

Par exemple, si quelqu'un recherche « baskets bleues », une recherche intelligente affichera toutes les chaussures de couleur bleue dans votre catégorie de baskets. Une recherche WordPress ordinaire pourrait manquer des produits si la phrase exacte n'est pas dans le titre.

L'ajout de filtres et d'une recherche intelligente signifie que vous couvrez toutes les bases. Vos clients peuvent acheter comme ils le souhaitent, ce qui se traduit par plus d'achats finalisés pour vous.

Pour configurer cela, consultez notre guide détaillé sur la création d'une recherche intelligente de produits WooCommerce. Il vous guide à travers l'ensemble du processus étape par étape.

FAQ sur la configuration des filtres de produits WooCommerce

Si vous avez encore des questions sur l'utilisation des filtres de produits dans WooCommerce, ces réponses rapides devraient vous aider.

Existe-t-il un plugin fiable et RAPIDE pour le filtrage des produits ?

Oui, WPFilters est l'un des plugins les plus fiables et les plus rapides pour le filtrage de produits WooCommerce. Il est spécialement conçu pour la vitesse et utilise la technologie AJAX pour mettre à jour les résultats sans recharger la page, assurant ainsi le bon fonctionnement de votre boutique.

Meilleur filtre de produits gratuit pour WooCommerce ?

La version gratuite de Filter Everything est une bonne option. Elle prend en charge les filtres de base comme les catégories, les prix et les attributs sans ralentir votre site. Le seul inconvénient est qu'elle fonctionne mieux sur les thèmes classiques.

Comment filtrer les produits WooCommerce par attributs personnalisés ?

Tout d'abord, vous devrez créer vos attributs dans Produits » Attributs et les assigner à vos produits. Ensuite, utilisez un plugin de filtre WooCommerce comme WPFilters pour afficher ces attributs comme filtres sur votre page de boutique.

Comment créer une page de boutique WooCommerce avec plusieurs filtres ?

Vous pouvez ajouter plusieurs widgets de filtre à la barre latérale de votre boutique, ou utiliser un plugin de filtre de produits qui vous permet de combiner des filtres comme le prix, la catégorie, la note et les attributs dans un seul panneau.

Quel est le code du filtre de produits dans WooCommerce ?

WooCommerce n'inclut pas de shortcode unique pour les filtres avancés. La plupart des fonctionnalités de filtrage proviennent de widgets ou de plugins, qui génèrent leurs propres shortcodes ou blocs que vous pouvez placer n'importe où sur votre site.

Prochaines étapes pour finaliser la configuration de votre boutique WooCommerce

Maintenant que vos filtres de produits WooCommerce sont configurés, vous voudrez peut-être consulter ces guides connexes pour améliorer encore davantage votre boutique WooCommerce :

Si vous avez aimé cet article, abonnez-vous à notre Chaîne YouTube pour des tutoriels vidéo WordPress. Vous pouvez également nous trouver sur Twitter et Facebook.

Divulgation : Notre contenu est soutenu par nos lecteurs. Cela signifie que si vous cliquez sur certains de nos liens, nous pouvons gagner une commission. Consultez comment WPBeginner est financé, pourquoi c'est important et comment vous pouvez nous soutenir. Voici notre processus éditorial.

La boîte à outils WordPress ultime

Accédez GRATUITEMENT à notre boîte à outils - une collection de produits et de ressources liés à WordPress que tout professionnel devrait posséder !

Interactions des lecteurs

1 CommentLeave a Reply

  1. Quand j'ai découvert WooCommerce pour la première fois, il m'a été très difficile de naviguer et de configurer quoi que ce soit. Les filtres de produits étaient une exigence que presque tous ceux qui envisageaient une boutique en ligne avaient. Et peu importe le type de produits – que ce soit des vêtements ou des matériaux de construction. Les filtres de produits sont simplement souhaitables pour une boutique en ligne, et j'étais stressé car je ne savais pas vraiment comment les implémenter dans WooCommerce. Grâce à cet article, j'ai appris comment faire, et j'ai enfin la compétence que tout le monde me demandait. Je peux rayer cela de ma liste de choses à apprendre sur WooCommerce. Ce fut un jour heureux quand j'ai trouvé ce site car je suis arrivé ici en tant que débutant et je repars avec tout ce que j'ai appris.

Leave A Reply

Merci d'avoir choisi de laisser un commentaire. N'oubliez pas que tous les commentaires sont modérés conformément à notre politique de commentaires, et votre adresse e-mail ne sera PAS publiée. N'utilisez PAS de mots-clés dans le champ nom. Ayons une conversation personnelle et significative.