Comment créer un formulaire de recherche personnalisé dans WordPress (étapes faciles)

Publié: 2022-02-22

Vous souhaitez savoir comment créer un formulaire de recherche personnalisé dans WordPress ?

Il est crucial de fournir aux visiteurs de votre site des résultats de recherche de qualité si vous souhaitez garantir la meilleure expérience utilisateur.

Dans cet article, nous allons vous montrer comment vous pouvez ajouter un formulaire de recherche personnalisé à votre site WordPress en quelques étapes simples.

Pourquoi créer un formulaire de recherche personnalisé dans WordPress

Les capacités natives du moteur de recherche WordPress sont limitées. Par défaut, il recherche uniquement le titre, le contenu et l'extrait des publications et des pages, ignorant complètement tout le reste.

Ainsi, si vous utilisez des types de publication personnalisés pour publier votre contenu, WordPress ne l'affichera pas dans les résultats de recherche.

Ceci est particulièrement important pour les propriétaires de boutiques en ligne. La plupart des plugins de commerce électronique stockent les produits et leurs attributs sous forme de types de publication personnalisés et de champs personnalisés.

À l'aide d'un formulaire de recherche personnalisé, vous pouvez personnaliser la recherche sur votre site comme vous le souhaitez.

De plus, les endroits où vous pouvez placer un formulaire de recherche sont généralement limités par les paramètres de votre thème.

Dans le cas des formulaires de recherche personnalisés, vous pouvez les afficher même à l'intérieur du corps, de la publication ou des pages.

Cela peut être très pratique dans certaines situations particulières. Par exemple, vous pouvez créer une page distincte et y ajouter un formulaire de recherche personnalisé qui recherche uniquement par type de contenu spécifique.

Cela étant dit, voyons comment vous pouvez ajouter un formulaire de recherche personnalisé à votre site Web WordPress.

Comment créer un formulaire de recherche personnalisé dans WordPress

Le moyen le plus simple de créer un formulaire de recherche personnalisé dans WordPress consiste à utiliser un plugin comme SearchWP.

SearchWP logo

Il s'agit du meilleur plugin de recherche WordPress qui vous permet de contrôler totalement le fonctionnement de la recherche sur votre site.

En l'utilisant, vous pouvez rendre n'importe quoi consultable sur votre site, avoir plusieurs moteurs de recherche, ajouter facilement des formulaires de recherche, et bien d'autres.

Plus de 30 000 propriétaires de sites WordPress dans le monde l'utilisent déjà pour offrir à leur public la meilleure expérience utilisateur.

Voici quelques autres choses que vous pouvez faire avec SearchWP :

  • Afficher les résultats de la recherche en mode direct . Souhaitez-vous afficher les résultats de recherche sur votre site en mode direct comme le fait Google ? SearchWP vous offre cela et bien d'autres fonctionnalités avec sa vaste base d'extensions utiles.
  • Suivi de l'activité de recherche sur site . Vous souhaitez voir ce que les visiteurs recherchent sur votre site ? En utilisant SearchWP, vous pouvez suivre toutes les recherches effectuées sur votre site, ce qui vous permet de mieux comprendre les besoins de votre public.
  • Prioriser les résultats de recherche. Vous cherchez à amener une page particulière en haut des résultats de recherche sur votre site ? Avec SearchWP, vous pouvez le faire en quelques clics.
  • Rendre les documents et les PDF consultables . Avez-vous beaucoup de fichiers PDF et de documents de bureau utiles téléchargés sur votre site ? Rendez-les consultables avec SearchWP pour enrichir vos résultats de recherche.

Passons maintenant au guide étape par étape sur la façon d'utiliser SearchWP pour créer un formulaire de recherche personnalisé.

Étape 1 : Installez le plugin SearchWP et activez-le

Pour commencer, récupérez votre copie de SearchWP ici.

Une fois cela fait, connectez-vous à votre compte SearchWP et accédez à l'onglet Téléchargements .

go to the downloads tab

Après cela, cliquez sur le bouton Télécharger SearchWP pour commencer à télécharger le plugin.

press download SearchWP

Copiez votre clé de licence sur le même onglet. Vous en aurez besoin plus tard pour activer votre copie de SearchWP.

copy your license key

Une fois le téléchargement terminé, téléchargez le fichier ZIP du plugin SearchWP sur votre site Web WordPress.

Besoin d'aide sur la façon de faire cela? N'hésitez pas à consulter ce guide détaillé sur la façon d'installer un plugin WordPress.

Après avoir installé SearchWP, l'étape suivante consiste à activer votre copie.

Pour ce faire, cliquez sur SearchWP dans le panneau supérieur de votre tableau de bord WordPress.

go to SearchWP settings

Une fois sur la page des paramètres de SearchWP, accédez à l'onglet Licence .

go to the license tab

Collez le code de licence que vous avez copié précédemment dans votre compte SearchWP dans le champ Licence et appuyez sur Activer .

activate your license key

Après avoir activé la licence, l'étape suivante consiste à ajouter un nouveau moteur de recherche.

Étape 2 : Ajouter un nouveau moteur de recherche

Pour ce faire, accédez à l'onglet Moteurs .

go over to the engines tab

Ici vous pouvez voir tous les moteurs de recherche que vous avez actuellement.

the list of default search sources

Vous pouvez considérer un moteur de recherche comme un ensemble de règles que WordPress suit lors d'une recherche.

Par défaut, il n'y a qu'un seul moteur de recherche appelé Default . Vous pouvez personnaliser le fonctionnement de la recherche sur l'ensemble du site en modifiant ses paramètres.

Notez que SearchWP vous permet d'ajouter un nombre illimité de moteurs de recherche et de les lier à des formulaires de recherche spécifiques.

Ainsi, pour créer un formulaire de recherche personnalisé, nous devons ajouter un nouveau moteur de recherche, puis le configurer comme nous le souhaitons.

Pour commencer, appuyez sur le bouton Ajouter nouveau .

add a new search engine

Après cela, apparaîtra le moteur supplémentaire que nous allons personnaliser.

the Supplemental search engine

Pour commencer à personnaliser le moteur de recherche, cliquez sur le bouton Sources et paramètres en haut à droite.

click sources and settings

Après cela, vous verrez une fenêtre dans laquelle vous pourrez modifier certains paramètres du moteur de recherche.

settings of the supplemental engine

Tout d'abord, vous pouvez choisir les types de contenu sur lesquels ce moteur de recherche effectuera ses recherches.

Par exemple, disons que nous voulons qu'il recherche uniquement par messages. Pour ce faire, il suffit de décocher toutes les sources de recherche à l'exception de Posts .

uncheck all except posts

Ensuite, nous renommerons ce moteur de recherche pour faciliter son identification.

Pour ce faire, entrez le nom du moteur de recherche dans le champ Engine Label . Par exemple, nous allons changer son nom en Custom .

rename the search engine

De plus, comme vous pouvez le constater, une fonctionnalité Keyword Stems est activée par défaut.

check keywords stems

Vous pouvez l'activer ou le désactiver pour que ce moteur de recherche ignore les fins de mots lors d'une recherche.

Nous laisserons cette option telle quelle, car elle permet d'afficher les résultats de recherche les plus pertinents pour les visiteurs de votre site.

Lorsque vous avez terminé de personnaliser les paramètres, cliquez sur Terminé pour enregistrer vos modifications.

press done to save the changes

Comme vous pouvez le voir, il existe 4 attributs de publication par défaut auxquels le moteur de recherche prête attention lors de la recherche : titre, contenu, slug et extrait.

the list of attributes

Vous pouvez modifier le poids de pertinence d'un attribut en déplaçant le curseur à côté de celui-ci vers la gauche ou vers la droite.

the adjustment slider

Disons que nous voulons que notre moteur de recherche d'utilisateurs donne la plus haute priorité aux titres de publication.

Pour ce faire, nous allons placer le curseur à côté des attributs Content , Slug et Excerpt tout à fait à gauche. De cette façon, notre moteur de recherche donnera la priorité aux titres des articles lors de la recherche.

Voici à quoi cela ressemble sur notre site de test :

move the title slider all the way right

Outre la définition des pondérations de pertinence des attributs, vous pouvez également supprimer des attributs existants ou en ajouter de nouveaux.

Pour ce faire, appuyez sur le bouton Ajouter/Supprimer des attributs .

click add remove attributes

Ici, vous pouvez choisir les attributs, les champs personnalisés ou les taxonomies que le moteur de recherche doit prendre en compte lors d'une recherche.

manage attributes

Supposons que les publications sur notre site aient un champ personnalisé de type de publication dans lequel nous spécifions à quel type elles appartiennent. Par exemple, il peut s'agir d'un didacticiel, d'une vitrine, d'une évaluation ou de tout autre type.

Pour ajouter un champ personnalisé en tant qu'attribut, ajoutez son nom au champ approprié.

Voici à quoi cela devrait ressembler :

add the post type custom field

Notre moteur de recherche prendra désormais en compte le contenu du champ personnalisé Type de publication , ce qui rendra les résultats de recherche plus pertinents.

Lorsque vous avez fini de personnaliser les attributs, appuyez sur Terminé pour enregistrer les modifications.

press done to save the attribute

De plus, si vous souhaitez que ce moteur de recherche affiche ou exclue des entrées sous certaines conditions, vous pouvez lui ajouter des règles.

Pour ce faire, appuyez sur le bouton Modifier les règles .

click edit rules

Il n'y a pas de règles par défaut, alors cliquez sur Ajouter une règle pour voir quelles règles vous pouvez appliquer.

click add new rule

Disons que nous voulons que ce moteur de recherche n'affiche que les articles de la catégorie WordPress.

Pour ce faire, nous sélectionnerons les options des catégories de produits dans le menu déroulant Taxonomie et saisirons « WordPress » dans le champ approprié.

Voici à quoi cela ressemble sur notre site de test :

add a rule to search only in the WordPress category

Lorsque vous avez terminé de modifier les règles, cliquez sur Terminé pour enregistrer les modifications.

press done to save the rules

Appuyez sur le bouton Enregistrer les moteurs en haut à droite une fois que vous avez fini de personnaliser votre nouveau moteur de recherche.

press save engines

C'est ça. Vous disposez maintenant d'un nouveau moteur de recherche entièrement personnalisé.

L'étape suivante consiste à télécharger et à activer l'extension SearchWP Shortcodes.

Étape 3 : Installez et activez l'extension Shortcodes

Cette extension vous permet d'ajouter un formulaire de recherche à n'importe quel endroit où vous pouvez ajouter un shortcode.

Vous pouvez le récupérer sur la page de téléchargement de l'extension Shortcodes. Une fois que vous y êtes, appuyez sur le bouton Télécharger l'extension .

download the Shortcodes extension

Une fois le téléchargement terminé, téléchargez et installez l'extension de la même manière que le plugin SearchWP.

L'étape suivante consiste à créer une nouvelle page. Nous y placerons un formulaire de recherche personnalisé associé au moteur de recherche que nous avons créé à l'étape précédente.

Étape 4 : créer une nouvelle page avec un formulaire de recherche personnalisé

Pour ce faire, accédez à Pages »Ajouter un nouveau dans votre tableau de bord WordPress.

click add a new page

Donnez un titre à votre nouvelle page et cliquez sur le bouton Plus .

title your page and press plus

Recherchez le bloc HTML personnalisé , puis cliquez dessus pour l'ajouter à la page.

click custom html block

Copiez et collez le code suivant dans le bloc HTML personnalisé ajouté :

[searchwp_search_form engine="custom" var="searchvar" button_text="Find Results"]
  
<div class="search-results-wrapper">
 [searchwp_search_results engine="custom" var="searchvar" posts_per_page=4]
  <h2>[searchwp_search_result_link direct="true"]</h2>
  [searchwp_search_result_excerpt]
 [/searchwp_search_results]
</div>
  
<div class="no-search-results-found">
 [searchwp_search_results_none]
 No results found, please search again.
 [/searchwp_search_results_none]
</div>
  
<div class="search-results-pagination">
 [searchwp_search_results_pagination direction="prev" link_text="Previous" var="searchvar" engine="custom"]
 [searchwp_search_results_pagination direction="next" link_text="Next" var="searchvar" engine="custom"]
</div>

Assurez-vous de remplacer le libellé de moteur de recherche "Personnalisé" dans le code ci-dessus par le nom de votre propre libellé de moteur que vous avez créé aux étapes précédentes.

Ce code affiche un formulaire de recherche personnalisé lié au moteur que vous avez créé.

Il affiche également le message "Aucun résultat de recherche trouvé" s'il n'y a pas de résultats et la pagination s'il y a plus de 4 résultats.

Une fois que vous avez collé le code, appuyez sur le bouton Publier en haut à droite pour publier votre page.

press publish

Maintenant, testons notre nouveau formulaire de recherche personnalisé.

Étape 5 : Testez votre nouvelle recherche

Pour ce faire, cliquez sur le bouton Afficher la page une fois la page publiée.

press view page

Lorsque vous accédez à la page, saisissez un terme de recherche dans le champ de recherche et cliquez sur Rechercher les résultats.

Nous avons limité le formulaire de recherche à la catégorie « WordPress » dans notre exemple. Entrons donc dans la requête de recherche "tutoriel" et voyons si les résultats de la recherche incluent des tutoriels liés uniquement à WordPress ou non.

press find results

Comme vous pouvez le voir, il n'y a que des articles de la catégorie "WordPress", ce qui signifie que notre formulaire de recherche personnalisé fonctionne très bien.

we found only posts related to WordPress

Dans cet article, vous avez appris à créer un formulaire de recherche personnalisé dans WordPress. Vous pouvez désormais proposer à vos visiteurs un contenu plus pertinent, améliorer leur expérience utilisateur et réduire le taux de rebond.

Si vous êtes prêt à créer votre propre formulaire de recherche personnalisé et à fournir à vos visiteurs de meilleurs résultats de recherche, vous pouvez récupérer votre copie de SearchWP ici.

Souhaitez-vous ajouter une barre de recherche à votre site Web ? Ensuite, vous pourriez être intéressé par la façon d'ajouter une barre de recherche dans WordPress avec un tutoriel de 4 façons différentes.

Avez-vous rencontré des problèmes avec la recherche WordPress ? Consultez ce guide pour réparer la recherche WordPress qui ne fonctionne pas.