Comment personnaliser facilement la page de résultats de recherche WordPress

Il existe de bons arguments pour personnaliser de nombreuses parties de WordPress — mais la page de résultats de recherche ? Quelle raison pourrait-il y avoir d'apporter des modifications à cela? Comment cette page pourrait-elle être différente ?

La vérité est que la page de résultats de recherche WordPress n'est pas nativement très intéressante. Cela vous donne la possibilité de mettre en évidence les articles sur lesquels vous souhaitez attirer davantage l'attention et de rendre la page un peu plus utile.

Je vous invite cordialement à le découvrir avec moi. Imaginez, à la fin de cet article, nous pourrions tous les deux être plus intelligents qu'avant. Êtes-vous dedans?

Pourquoi personnaliser les résultats de recherche de WordPress ?

Très bien, commençons par les raisons pour lesquelles vous devriez envisager d'apporter des modifications à la page de résultats de recherche de votre site et les éléments que vous pourriez personnaliser.

Le but de la page des résultats de recherche

Tout d'abord, clarifions la fonction de la page de résultats de recherche. Comme vous pouvez probablement le deviner, il est censé aider les utilisateurs à trouver le contenu qu'ils recherchent. À cette fin, ils peuvent entrer un terme de recherche dans le champ de recherche (qui, espérons-le, est présent sur votre site - plus à ce sujet ci-dessous).

WordPress servira ensuite la page de résultats de recherche avec tout ce qu'il peut trouver concernant cette requête.

Pourquoi devriez-vous vous en soucier ? On dirait que WordPress couvre automatiquement cette partie, n'est-ce pas ?

Parce que la page de résultats de recherche peut avoir un impact important sur l'expérience utilisateur de votre site, en particulier pour les sites de commerce électronique :

Selon Econsultancy, jusqu'à 30 % des visiteurs du commerce électronique utilisent la recherche interne sur le site. En raison de l'augmentation du niveau d'intention d'achat des internautes, ils sont connus pour convertir jusqu'à 5 à 6 fois plus que le visiteur moyen de recherche hors site.

CXL

Logique, n'est-ce pas ? Pensez simplement à la fréquence à laquelle vous utilisez la fonction de recherche lorsque vous magasinez en ligne. Exactement! Mais même les sites WordPress sans fonctionnalité de commerce électronique peuvent bénéficier de l'apprentissage de la personnalisation de la page de résultats de recherche.

Qu'est-ce qui pourrait être amélioré dans la recherche WordPress ?

Au cours de mes recherches, j'ai pu trouver les domaines de plaintes suivants concernant la fonction de recherche native de WordPress.

D'une part, jusqu'à récemment, il n'existait aucun moyen non codé de personnaliser l'apparence de la page de résultats de recherche. À moins que vous ne connaissiez PHP, CSS et un éditeur de code, vous deviez simplement avoir confiance que votre thème faisait un bon travail d'affichage et être satisfait du contenu de la page de recherche.

Deuxièmement, la fonction de recherche native de WordPress n'est pas toujours très bonne dans ce qu'elle fait. Il ne renverra souvent aucun résultat pour les recherches qui ont réellement des correspondances appropriées.

De plus, cela peut être un peu lent. Dans la bonne vieille mode PHP, la recherche WordPress a besoin d'un rechargement de page afin d'afficher les résultats, ce qui n'est pas le moyen le plus rapide de faire les choses.

En conséquence, cela nous laisse avec les domaines d'amélioration suivants :

• Conception - Nous verrons comment contrôler l'apparence de la page de résultats de recherche WordPress ainsi que les éléments qui y apparaissent.
• Résultats de recherche — Assurez-vous que les résultats que vos visiteurs peuvent trouver sur la page de recherche sont pertinents et satisfaisants.
• Expérience utilisateur - Améliorez la vitesse de recherche, rendez-la plus confortable à utiliser et ajoutez des fonctionnalités à la recherche WordPress auxquelles les visiteurs sont habitués à partir de Google ou d'autres moteurs de recherche.

Cela semble convaincant à première vue, si vous me demandez. Alors, passons aux choses sérieuses.

Ajouter un formulaire de recherche à votre site Web WordPress

Naturellement, travailler avec la page de résultats de recherche dans WordPress n'a de sens que si vous donnez même à vos utilisateurs la possibilité d'y accéder. Cela signifie que vous proposez un formulaire de recherche quelque part où ils peuvent saisir leurs requêtes.

Pour cela, WordPress propose un widget de recherche intégré que vous pouvez placer où bon vous semble dans vos modèles de page et vos parties de modèle. Ce dernier est une idée particulièrement bonne si vous utilisez le même en-tête sur chaque page. Dans ce cas, il vous suffit de modifier la partie du modèle une seule fois et vos modifications apparaîtront partout.

En règle générale, il est judicieux d'ajouter le formulaire de recherche à un en-tête, une barre latérale ou un pied de page, des éléments qui apparaissent sur chaque page. De cette façon, vous donnez à vos visiteurs la possibilité de rechercher ce qu'ils recherchent où qu'ils se trouvent sur votre site.

La façon dont le champ de recherche s'affiche sur votre site dépend de si vous utilisez un thème de bloc ou un thème classique.

Utilisation d'un thème de bloc et de l'éditeur de site

Si vous utilisez un thème de bloc comme Twenty Twenty-Two, vous pouvez effectuer cette action via l'éditeur de site. Vous le trouverez sous Apparence > Éditeur .

Dans l'écran initial, vous pouvez modifier votre page d'accueil. Lorsque vous cliquez sur le logo dans le coin supérieur gauche, vous accédez aux menus Templates et Template Parts .

Par exemple, supposons que vous souhaitiez ajouter le formulaire de recherche à l'en-tête par défaut de votre thème. Pour cela, allez dans Template Parts puis cliquez sur Header (Dark, small) .

Cela vous amène à cet écran :

Ici, ajouter le formulaire de recherche est assez simple, vous pouvez le faire de plusieurs manières.

D'une part, utilisez le signe plus dans le coin supérieur gauche, recherchez le widget de recherche et faites-le glisser vers l'emplacement souhaité.

Vous pouvez également créer un élément vide dans l'éditeur (par exemple via Insérer avant ou Insérer après sur un élément existant), cliquer sur le signe plus sur la page de l'éditeur et rechercher le widget de recherche ou saisir /rechercher pour l'ajouter directement.

L'une ou l'autre de ces méthodes fera apparaître le formulaire de recherche dans votre thème que vous pourrez ensuite personnaliser à l'aide des options de bloc à droite et de la barre de paramètres en haut.

Enregistrez vos modifications et elles apparaîtront sur la page.

Le même processus dans un thème classique

Si votre site fonctionne sur un thème classique, vous pouvez ajouter le widget de recherche dans n'importe quelle zone widgetisée qu'il propose. Pour savoir quelles options existent, rendez-vous dans Apparence > Widgets .

L'ajout d'un widget fonctionne de la même manière qu'avec l'éditeur de site. Cliquez sur le signe plus dans le coin supérieur gauche ou sur l'une des zones du widget. Ensuite, recherchez ou parcourez le widget de recherche et saisissez-le dans la zone du widget.

Si vous n'êtes pas satisfait de vos choix, vous pouvez également ajouter d'autres zones de widgets à votre thème.

Alternativement, il est également possible d'ajouter le formulaire de recherche directement dans vos modèles de page via le code. Collez l'extrait ci-dessous à l'endroit où vous souhaitez qu'il apparaisse.

 <?php get_search_form( true ); ?>

Ici aussi, il est logique d'opter pour une partie de modèle telle que votre en-tête, vous n'avez donc pas à le faire pour chaque modèle séparément. Sachez cependant que vous devez toujours apporter des modifications de fichier comme celle-ci dans un thème enfant.

Modifier la conception de la page des résultats de recherche

Très bien, maintenant que vous avez un formulaire de recherche sur votre site, il est temps de personnaliser l'apparence de la page de résultats de recherche WordPress une fois que quelqu'un l'utilise. Ce processus dépend également beaucoup de votre thème.

Utiliser l'éditeur de site, encore une fois

L'apparence de la page de résultats de recherche dans WordPress est contrôlée par un modèle de page. Celui que nous recherchons dans l'éditeur de site s'appelle Rechercher (qui aurait pensé) et vous le trouverez dans le menu Modèles susmentionné.

Cliquez dessus pour accéder à l'éditeur de modèles.

Ici, vous pouvez apporter toutes les modifications que vous souhaitez. Par exemple, voici à quoi ressemble la page de résultats de recherche dans Twenty Twenty-Two par défaut :

L'une des choses les plus simples que je puisse faire pour modifier son apparence est d'échanger le bloc Query Loop par défaut avec un modèle de bloc. Après ça, ça finit par ressembler à ça :

Tout à fait différent, vous ne trouvez pas ?

Personnalisation de la page de résultats de recherche via le code

Si vous n'utilisez pas un thème WordPress qui vous permet de personnaliser visuellement la page de résultats de recherche, vous pouvez également le faire avec du code. Pour rendre la page, le thème utilisera soit search.php , s'il est présent, soit se rabattra sur index.php (consultez la hiérarchie des modèles WordPress pour comprendre comment cela fonctionne).

Une fois que vous avez créé un thème enfant, copiez-y le search.php du thème parent ou bien faites une copie de index.php , renommez-le en search.php et placez-le dans le thème enfant. Après cela, ouvrez-le avec votre éditeur de code préféré et personnalisez-le selon vos besoins.

Bien sûr, si vous utilisez un thème classique et que vous ne connaissez pas le code, vous pouvez également utiliser un plugin de création de page.

Options de plugin pour améliorer les résultats de recherche WordPress

Après avoir traité de la conception de la page de résultats de recherche, il est temps de parler de la façon de personnaliser son contenu. Pour cela, nous allons nous concentrer sur les options du plugin. Tout d'abord, parce qu'il en existe plusieurs bons, deuxièmement, parce que la personnalisation des résultats de recherche via le code va tout simplement au-delà de ce que nous pouvons couvrir dans cet article.

1. Relevanssi

Ce plugin remplace complètement la fonction de recherche standard de WordPress et apporte les modifications suivantes :

• Triez les résultats de la recherche par pertinence, et non par date.
• Activez la correspondance approximative, ce qui signifie qu'elle affiche également des correspondances partielles avec la requête de recherche.
• Prise en charge de l'utilisation des modificateurs de requête AND et OR ainsi que des guillemets pour la recherche de correspondance exacte.
• Mettez en surbrillance les termes de recherche dans les extraits de recherche et dans les résultats lorsque vous cliquez dessus.
• Possibilité de rechercher des taxonomies, des commentaires, des champs personnalisés, y compris les SKU WooCommerce et le contenu des champs personnalisés avancés.
• Suggestions de recherche lorsqu'il n'y a pas de résultat (“vouliez-vous dire…?”).

La version gratuite offre beaucoup plus de fonctionnalités et il existe une version premium avec encore plus. Faites juste attention : Relevanssi a besoin de beaucoup d'espace de base de données pour son index, alors assurez-vous que vous l'avez disponible dans votre hébergement avant d'installer le plugin.

2. Recherche d'ivoire

L'une des principales fonctionnalités d'Ivory Search est qu'il vous permet de créer des formulaires de recherche illimités et de les afficher où vous le souhaitez. Les positions disponibles incluent l'en-tête du site, le pied de page, les zones de widgets, la navigation et partout où vous pouvez placer des codes abrégés. Vous pouvez concevoir et personnaliser vos formulaires selon vos besoins ou utiliser les modèles inclus. De plus, vous pouvez personnaliser le contenu exact que chacun recherchera.

En plus de cela, le plugin améliore la fonctionnalité de recherche sur votre site des manières suivantes :

• Recherche plus rapide grâce à un moteur de recherche basé sur un index.
• Recherchez des images, des fichiers et des pièces jointes, du contenu de code court, des produits WooCommerce, etc.
• Fonctionnalité de recherche en direct.
• Recherchez un contenu spécifique ou excluez du contenu des résultats.
• Suivez les recherches sur votre site dans les analyses de recherche.
• Recherche multilingue.

Une version premium avec des fonctionnalités supplémentaires est disponible.

3. Meilleure recherche

Ce plugin remplace également la recherche WordPress par défaut. Il produit des résultats en fonction du titre et du contenu de vos publications, pages et types de publication personnalisés. Vous pouvez également contrôler où le plugin recherche, y compris les champs méta, les auteurs, les taxonomies et même les commentaires.

De plus, Better Search affiche les résultats par pertinence et vous permet de personnaliser le résultat de la recherche, d'attribuer plus de poids au titre ou au contenu, et propose d'autres filtres et actions. Enfin, vous pouvez afficher le contenu recherché le plus populaire sous la forme d'un widget et personnaliser les résultats de recherche avec votre propre modèle et CSS personnalisé.

4. Plugins de recherche payants

Outre les plugins ci-dessus, il existe également un tas d'offres payantes :

• WP Fastest Site Search — Bien que dans le répertoire WordPress, il s'agit en fait d'un plugin payant avec une période d'essai de 14 jours. La seule partie gratuite est la fonctionnalité de recherche vocale , utile pour les mobiles. En plus de cela, il est livré avec des personnalisations d'interface utilisateur sans code, une recherche de PDF et d'images, des synonymes et une saisie semi-automatique, et plus encore.
• SearchWP — Trie les résultats en fonction de l'endroit où ils se trouvent. Le plug-in peut rechercher des champs personnalisés, des produits et des détails de commerce électronique, des catégories, des balises et d'autres taxonomies, le contenu des documents de votre site (par exemple, PDF, docx), etc. Vous pouvez ajuster l'importance accordée aux différents attributs de recherche et exclure les taxonomies. La même société propose également une amélioration gratuite pour la recherche en direct.
• YITH WooCommerce AJAX Search - Spécifiquement pour améliorer la recherche sur les sites WooCommerce. Permet de rechercher dans une catégorie spécifique, par fournisseur ou par SKU. Il peut afficher les prix dans les résultats de recherche et propose différentes dispositions de formulaire de recherche, y compris en plein écran.

5. Autres plugins de recherche

Enfin, voici quelques plugins qui apportent de petites modifications à la fonctionnalité de recherche WordPress :

• Recherche et filtre - Un plugin gratuit qui permet aux chercheurs d'affiner leur recherche en choisissant des catégories, des balises ou des types de publication dans lesquels rechercher. Il affiche également le terme de recherche en haut de la page de recherche. De cette façon, les utilisateurs peuvent être sûrs que la recherche a été effectuée, même si elle s'avère vide.
• Mettre en surbrillance les termes de recherche — Un plugin petit et léger qui ne fait qu'une chose : mettre en évidence le terme de recherche dans les résultats de recherche ainsi que sur les pages trouvées après un clic. Il est également compatible avec BuddyPress/bbPress.

Réflexions finales : résultats de recherche WordPress

Et voilà, à la fois les raisons pour lesquelles vous voudrez peut-être personnaliser la page de résultats de recherche WordPress et comment le faire. Pour ma part, je me sens un peu plus intelligent, et vous ? J'espère que vous utiliserez les informations ci-dessus pour améliorer cette partie vitale de votre site WordPress.

Connaissez-vous d'autres moyens de personnaliser la page de résultats de recherche WordPress ? Autre chose à ajouter ? Faites le nous savoir dans les commentaires!