Blog SearchWP

Tutoriels, astuces et ressources WordPress pour vous aider à développer votre entreprise

Comment ajouter une miniature aux widgets de recherche WooCommerce personnalisés

Imaginez qu'un client arrive sur votre boutique WooCommerce à la recherche d'un pull en laine mérinos bleue. Il tape « laine mérinos bleue » dans la barre de recherche et obtient zéro résultat, même si vous avez exactement ce dont il a besoin.

C'est la recherche WooCommerce par défaut qui est à l'œuvre, et nous avons constaté qu'elle coûte aux propriétaires de boutiques de vraies ventes chaque jour.

Le problème est que la recherche WooCommerce par défaut ne fait correspondre les mots-clés qu'aux titres de produits et au contenu de base. Elle ignore complètement les attributs de produits, les variations, les étiquettes, les catégories et les champs personnalisés stockés dans votre base de données.

L'ajout d'un widget de recherche WooCommerce personnalisé est la solution. Vous pouvez placer un formulaire de recherche correctement configuré dans votre barre latérale, votre en-tête, votre page de boutique ou n'importe où ailleurs sur votre site, et le connecter à un moteur de recherche qui comprend réellement vos produits.

Dans cet article, nous vous montrerons comment ajouter des widgets de recherche WooCommerce personnalisés à votre boutique étape par étape, sans écrire une seule ligne de code.

Que sont les widgets de recherche WooCommerce personnalisés ?

Un widget de recherche WooCommerce personnalisé est un formulaire de recherche que vous placez n'importe où sur votre site et connectez à un moteur de recherche configuré. Contrairement à la barre de recherche par défaut, il vous donne le contrôle sur ce que le moteur recherche, comment les résultats sont classés et où le formulaire apparaît.

Les thèmes WordPress classiques utilisent l'écran Widgets pour placer des formulaires de recherche dans des zones comme la barre latérale, l'en-tête ou le pied de page. Les thèmes FSE (édition complète du site) basés sur des blocs utilisent plutôt l'éditeur de blocs, où vous pouvez déposer un bloc de formulaire de recherche sur n'importe quel modèle ou page.

Dans tous les cas, le widget lui-même n'est que l'affichage frontal. La véritable amélioration provient de ce qui le motive.

Pourquoi ajouter des widgets de recherche WooCommerce personnalisés ?

Un widget de recherche bien placé transforme la navigation de votre boutique en un chemin direct vers l'achat. Voici ce que vous gagnez en remplaçant l'expérience par défaut :

  • Meilleure découvrabilité des produits. La recherche par défaut manque les produits stockés avec des attributs personnalisés comme la couleur, la taille, le SKU ou le matériau. Un widget personnalisé soutenu par un véritable moteur de recherche trouve les produits, quel que soit l'attribut recherché par le client.
  • Plus de ventes à partir du trafic existant. Les visiteurs qui utilisent la recherche sur site convertissent à des taux significativement plus élevés que ceux qui naviguent. Chaque fois qu'une recherche ne renvoie aucun résultat, vous perdez une conversion que vous avez déjà payé pour attirer.
  • Contrôle sur ce qui est recherché. Avec un widget personnalisé, vous décidez exactement quelles données de produit le moteur de recherche lit : titre, description, étiquettes, variations, champs personnalisés, ou toute combinaison. Vous pouvez même créer différents widgets de recherche pour différentes pages, chacun optimisé pour un objectif différent.
  • Analyses de recherche. Une fois la recherche en cours, vous pouvez suivre exactement ce que les clients recherchent et quelles requêtes ne renvoient aucun résultat. Notre guide sur comment trouver le produit le plus recherché sur votre site web détaille cela.
  • Une expérience propre et professionnelle. Une barre de recherche qui renvoie des résultats pertinents instantanément renforce la confiance. Nous avons travaillé avec de nombreux propriétaires de boutiques qui ont constaté une baisse directe du taux de rebond après avoir amélioré la recherche de leurs produits.

La bonne nouvelle est que tout cela prend environ dix minutes à configurer avec le bon plugin.

Apprenons ci-dessous comment ajouter des widgets de recherche WooCommerce personnalisés à votre site Web.

Comment ajouter des widgets de recherche WooCommerce personnalisés (facilement)

Le moyen le plus simple d'ajouter un widget de recherche personnalisé à WooCommerce est d'utiliser un plugin, et SearchWP est le meilleur plugin de recherche WordPress pour cette tâche.

SearchWP - Meilleur plugin de recherche WordPress

SearchWP est le meilleur plugin de recherche WooCommerce, approuvé par plus de 50 000 propriétaires de sites Web pour remplacer la recherche par défaut de WordPress par un moteur rapide et précis.

Il crée un index de recherche sur le contenu de votre site, les articles, les pages, les produits, les médias, les champs personnalisés, et plus encore. Et vous permet de contrôler exactement ce qui est recherché, comment les résultats sont classés et où les formulaires de recherche apparaissent.

Voici les fonctionnalités clés qui le rendent idéal pour les boutiques WooCommerce :

  • Intégration WooCommerce. L'extension dédiée WooCommerce de SearchWP alimente la recherche de vos produits avec un véritable moteur de pertinence. Elle respecte les règles de visibilité des produits, gère le tri du catalogue et rend les attributs, les variations et les tags des produits entièrement consultables.
  • Moteurs de recherche personnalisés. Créez plusieurs moteurs et connectez chacun d'eux à un formulaire de recherche différent. Vous pouvez exécuter une recherche de produits uniquement dans la barre latérale de la boutique et une recherche sur l'ensemble du site dans l'en-tête en même temps.
  • Analyses de recherche. L'extension Metrics vous montre exactement ce que vos clients recherchent, quelles recherches ne donnent aucun résultat et où vous perdez des ventes à cause de votre propre barre de recherche.
  • Options de placement multiples. Ajoutez des formulaires de recherche sous forme de widgets, de blocs Gutenberg, de shortcodes ou d'éléments de constructeur de pages — sans restrictions de thème.
  • Indexation de documents PDF et Office. Si vous vendez des livres ou d'autres ressources textuelles, vos utilisateurs pourront les trouver plus facilement. SearchWP prend en compte le contenu des fichiers de documents dans votre bibliothèque de médias lors de la recherche.
  • Statistiques et aperçus des visiteurs. Vous pouvez voir ce que vos visiteurs recherchent. Vous pouvez utiliser ces informations pour améliorer vos services.

Avec cela, voyons comment ajouter des widgets de recherche WooCommerce personnalisés à votre site en utilisant SearchWP.

Étape 1 : Installer et activer SearchWP

Pour commencer, vous pouvez visiter le site Web de SearchWP et vous inscrire pour un nouveau compte.

Une fois que vous avez créé un compte et que vous êtes dans votre tableau de bord de compte, accédez à l'onglet Téléchargements. De là, cliquez sur Télécharger SearchWP pour enregistrer le fichier ZIP du plugin sur votre ordinateur. Copiez la clé de licence sur la même page, car vous en aurez besoin pendant l'installation.

Télécharger le plugin SearchWP depuis l'espace compte

Ensuite, vous pouvez télécharger les fichiers du plugin, puis installer et activer SearchWP sur votre site WordPress.

Si vous avez besoin d'aide, consultez ce guide pour débutants sur comment installer un plugin WordPress.

Après l'activation, vous verrez l'écran de bienvenue de SearchWP avec un assistant de configuration. Cliquez sur Démarrer l'assistant d'intégration et suivez les instructions à l'écran, y compris la saisie de votre clé de licence lorsque vous y êtes invité.

Assistant d'intégration SearchWP

Excellent travail, SearchWP est maintenant installé et prêt à être configuré. La prochaine étape consiste à ajouter la prise en charge de WooCommerce.

Étape 2 : Installer l'extension WooCommerce Integration

SearchWP dispose d'une extension dédiée WooCommerce Integration qui alimente votre recherche de produits avec un moteur de pertinence complet.

Elle gère les règles de visibilité des produits, le tri du catalogue et garantit que SearchWP lit correctement vos données produit.

Pour l'installer, naviguez simplement vers SearchWP » Extensions depuis votre tableau de bord WordPress.

Installer l'extension WooCommerce

Ensuite, trouvez l'extension WooCommerce Integration dans la liste et cliquez sur Installer.

Elle s'active automatiquement en quelques secondes.

Maintenant, SearchWP a un accès complet à vos produits et données WooCommerce. Configurons le moteur de recherche ensuite.

Étape 3 : Configurer un moteur de recherche personnalisé SearchWP

SearchWP utilise des moteurs de recherche, qui vous permettent de définir des configurations contrôlant ce qui est recherché et comment les résultats sont classés.

Vous pouvez créer plusieurs moteurs et connecter chacun d'eux à un formulaire de recherche différent sur votre site.

Pour personnaliser votre moteur SearchWP, naviguez vers SearchWP » Algorithme depuis le tableau de bord WordPress.

Comment ajouter des widgets de recherche WooCommerce personnalisés : comment configurer un moteur de recherche WordPress étape 2

À partir de là, cliquez sur Sources & Paramètres. Une fenêtre modale apparaîtra avec une liste de sources parmi lesquelles choisir.

Ensuite, cochez la case à côté de Produits pour rendre vos produits WooCommerce recherchables. Vous pouvez également inclure d'autres sources par défaut comme Articles, Pages, ou Médias si vous souhaitez que le widget recherche sur l'ensemble de votre site.

Comment ajouter des widgets de recherche WooCommerce personnalisés : comment configurer un moteur de recherche WordPress étape 3

Cliquez sur Terminé lorsque vous avez terminé.

Faites maintenant défiler vers le bas jusqu'à la section Produits pour affiner ce que SearchWP lit de chaque produit.

Pour commencer, cliquez sur Ajouter/Supprimer des attributs pour ouvrir le panneau des attributs. Ici, vous pouvez ajouter des champs personnalisés de produits (comme le SKU, la couleur ou la taille) et des taxonomies (comme les tags et catégories de produits) à l'index de recherche.

Gérer les attributs des produits

Lorsque vous avez terminé de sélectionner les attributs, cliquez sur Terminé.

Cliquez ensuite sur Enregistrer pour que SearchWP puisse commencer à reconstruire votre index de recherche en fonction des nouveaux paramètres.

Comment ajouter des widgets de recherche WooCommerce personnalisés : comment configurer un moteur de recherche WordPress étape 4

Si vous souhaitez limiter le widget aux produits uniquement et supprimer d'autres types de contenu des résultats, consultez notre guide sur comment limiter vos résultats de recherche WordPress.

Votre moteur de recherche est maintenant optimisé pour les produits WooCommerce. La dernière étape consiste à ajouter le widget de recherche à votre site.

Étape 4 : Ajouter la recherche WooCommerce à votre site Web

Vous devez maintenant créer une barre de recherche pour que vos clients puissent rechercher les produits qu'ils désirent.

Que vous ayez besoin d'utiliser un widget ou un bloc pour créer la barre de recherche dépend du thème que vous utilisez. Un widget de recherche WooCommerce est votre meilleur choix si vous utilisez un thème classique. D'autre part, si vous utilisez un thème FSE (édition complète du site) moderne, l'utilisation d'un bloc de recherche WooCommerce est la méthode standard.

Vous pouvez ajouter une barre de recherche n'importe où sur votre site Web, quelle que soit la méthode utilisée. Voici comment vous pouvez ajouter la recherche WooCommerce à votre site Web dans les deux cas.

Étape 4.1 Ajouter un widget de recherche WooCommerce pour les thèmes classiques

Vous pouvez ajouter un widget de recherche WooCommerce personnalisé n'importe où sur votre site si votre thème le prend en charge. Voyons comment vous pouvez ajouter le widget à la barre latérale.

Vous pouvez également le placer n'importe où sur votre site, comme dans l'en-tête et le pied de page. Cela dépend de vos besoins, mais le processus est similaire. Naviguez simplement vers Apparence » Widgets depuis le tableau de bord WordPress.

Comment ajouter des widgets de recherche WooCommerce personnalisés : Ajout du widget de recherche Étape 1

Sur la page des paramètres des widgets, sélectionnez la zone où vous souhaitez ajouter le widget et cliquez sur l'icône +.

Dans ce tutoriel, nous ajouterons le widget de recherche à la zone de la barre latérale WooCommerce. Tapez SearchWP dans le champ, puis sélectionnez le bloc de widget Formulaire SearchWP.

Ajouter des formulaires SearchWP à la barre latérale WooCommerce

Une fois le bloc SearchWP Form ajouté, vous pouvez cliquer sur le menu déroulant et sélectionner un formulaire de recherche.

Ensuite, cliquez sur Mettre à jour dans le coin supérieur droit.

Sélectionner votre formulaire pour la barre latérale WooCommerce

Votre barre latérale contient maintenant un widget de recherche WooCommerce personnalisé.

Visitez maintenant le front-end de votre site Web et voyez votre widget de recherche WooCommerce en action !

Comment ajouter des widgets de recherche WooCommerce personnalisés : Aperçu de la boîte de recherche sur le frontend

Étape 4.2 Ajouter un bloc de recherche WooCommerce pour les thèmes FSE modernes

Avant d'afficher la barre de recherche, vous devrez créer un formulaire de recherche. Le processus est rapide et facile avec SearchWP et n'implique aucune écriture de code.

Pour créer un formulaire de recherche, allez dans SearchWP > Formulaires de recherche et cliquez sur "Ajouter".

Comment ajouter des widgets de recherche WooCommerce personnalisés : Création du formulaire de recherche Étape 1

Choisissez un nom pour votre formulaire de recherche, sélectionnez une mise en page de thème et configurez-le selon vos besoins.

Veuillez noter que SearchWP vous permet de configurer plusieurs moteurs, en utilisant lesquels vous pouvez servir différents contenus à différents endroits de votre site Web.

Comment ajouter des widgets de recherche WooCommerce personnalisés : Création du formulaire de recherche Étape 1-1

Choisir SearchWP comme page de résultats donne un contrôle total et une optimisation de la page de résultats de recherche WordPress.

Voici un tutoriel détaillé sur comment optimiser la page de résultats de recherche WordPress.

Comment ajouter des widgets de recherche WooCommerce personnalisés : Création du formulaire de recherche Étape 2

Une fois que vous avez terminé la configuration du formulaire de recherche, cliquez sur Enregistrer.

Si vous souhaitez en savoir plus, voici un tutoriel détaillé sur comment créer un formulaire de recherche avancé dans WordPress.

Comment ajouter des widgets de recherche WooCommerce personnalisés : Création du formulaire de recherche Étape 3

Maintenant, ouvrez la page où vous souhaitez afficher la barre de recherche en mode Édition.

Cliquez sur l'icône « + Ajouter un bloc », puis trouvez et sélectionnez le formulaire SearchWP dans la liste des blocs.

Ajouter le bloc de formulaires SearchWP dans WordPress

Une fois le bloc Formulaire SeachWP ajouté, vous pouvez sélectionner le formulaire que vous venez de créer.

Cliquez simplement sur le menu déroulant pour ce faire.

Choisir un formulaire dans la liste déroulante

Vous devriez maintenant voir la barre de recherche affichée à l'emplacement souhaité.

Enfin, vous pouvez cliquer sur le bouton Mettre à jour ou Publier dans le coin supérieur.

Comment ajouter des widgets de recherche WooCommerce personnalisés : Affichage du formulaire de recherche Étape 3

Visitez maintenant le front-end de votre site Web et voyez votre recherche WooCommerce en action !

Vous pouvez rechercher différents produits pour vérifier si la recherche fonctionne correctement.

Comment ajouter des widgets de recherche WooCommerce personnalisés : Formulaire de recherche en direct sur le frontend

FAQ sur les widgets de recherche WooCommerce

1. Qu'est-ce qu'un widget de recherche WooCommerce personnalisé ?

Un widget de recherche WooCommerce personnalisé est un formulaire de recherche placé sur votre site et connecté à un moteur de recherche configuré. Contrairement à la barre de recherche WordPress par défaut, il recherche les attributs des produits, les variations, les tags et les champs personnalisés. Vous pouvez le placer dans n'importe quelle zone de widget ou page à l'aide d'un plugin comme SearchWP.

2. SearchWP nécessite-t-il l'extension WooCommerce Integration pour rechercher des produits ?

SearchWP indexe les produits WooCommerce par défaut en tant que type de publication. L'extension WooCommerce Integration ajoute des comportements spécifiques aux produits, y compris les règles de visibilité, la compatibilité du tri du catalogue et la gestion correcte de la recherche d'archives de la boutique WooCommerce. Elle est recommandée pour toute boutique WooCommerce et est incluse dans le plan SearchWP Pro.

3. Puis-je ajouter un widget de recherche WooCommerce à mon en-tête ou à mon pied de page ?

Oui. Si votre thème prend en charge les zones de widgets d'en-tête ou de pied de page, accédez à Apparence » Widgets, ouvrez la zone de widgets d'en-tête ou de pied de page, et ajoutez le bloc Recherche. Pour les thèmes FSE, vous pouvez intégrer le bloc Formulaire SearchWP directement dans le modèle d'en-tête ou de pied de page via l'éditeur de site.

4. Pourquoi la recherche WooCommerce par défaut manque-t-elle des produits ?

La recherche WordPress par défaut exécute une requête SQL LIKE de base sur les titres et le contenu des publications. WooCommerce stocke les attributs des produits, les tags, les SKU et les variations dans des tables de base de données séparées en tant que métadonnées de publication et termes de taxonomie, que la recherche par défaut ne lit jamais. Un plugin comme SearchWP crée un index personnalisé qui inclut toutes ces données.

5. Puis-je créer différents widgets de recherche pour différentes pages ?

Oui. SearchWP vous permet de créer plusieurs moteurs de recherche et de lier chacun d'eux à un formulaire de recherche différent. Vous pouvez avoir un moteur de recherche axé uniquement sur les produits alimentant un widget sur votre page de boutique, et un moteur distinct couvrant tout le site alimentant la barre de recherche dans votre en-tête. Chaque moteur peut être configuré pour rechercher différentes sources et attributs.

Vous avez maintenant un widget de recherche WooCommerce personnalisé sur votre site, alimenté par un moteur qui comprend vos produits. Avec SearchWP indexant les attributs de vos produits, les tags, les variations et les champs personnalisés, vos clients peuvent trouver ce dont ils ont besoin, quelle que soit la manière dont ils le recherchent.

Nous espérons que cet article vous a aidé à apprendre comment ajouter des widgets de recherche WooCommerce personnalisés. Vous voudrez peut-être aussi consulter nos guides sur comment restreindre la recherche de produits WooCommerce au titre uniquement et comment masquer un produit WooCommerce des résultats de recherche.

Prêt à améliorer votre recherche WooCommerce ? Vous pouvez commencer avec SearchWP ici.

Créez dès aujourd'hui une meilleure expérience de recherche WordPress

Ne perdez plus jamais de visiteurs à cause de résultats de recherche inutiles. SearchWP rend la création de votre propre recherche WordPress intelligente rapide et facile.

Obtenez SearchWP maintenant
Icône de moteurs de recherche multiples