Comment ajouter la recherche Ajax en direct à votre site WordPress (en toute simplicité)
Voulez-vous ajouter la recherche Ajax en direct à votre site WordPress ?
La recherche instantanée affiche les résultats au fur et à mesure que le visiteur tape dans la barre de recherche, de la même manière que Google fonctionne. Cela aide les visiteurs à trouver rapidement des pages, des publications, des produits et bien plus encore.
Dans cet article, nous allons vous montrer comment ajouter la recherche Ajax en direct à votre site WordPress.
Pourquoi ajouter la recherche Live Ajax à WordPress ?
La recherche Live Ajax, également appelée recherche instantanée, améliore la recherche WordPress intégrée en ajoutant une fonctionnalité de liste déroulante et de saisie semi-automatique courante dans les moteurs de recherche comme Google.
Voici un exemple de recherche Ajax en direct en action :
La recherche en direct devine ce que les utilisateurs recherchent au fur et à mesure qu'ils tapent, ce qui les aide à trouver plus rapidement le contenu pertinent. Cela augmentera souvent les pages vues et réduira le taux de rebond.
Avec la recherche en direct Ajax, vous pouvez afficher des résultats pertinents sans même recharger la page. Cela en fait un excellent choix pour les boutiques en ligne, car les acheteurs peuvent voir instantanément les produits qui correspondent à leur requête de recherche. De cette manière, la recherche instantanée peut vous aider à créer une recherche de produits plus intelligente.
Cela étant dit, voyons comment ajouter une recherche Ajax en direct à WordPress.
Ajout de la recherche Ajax à WordPress avec un plugin WordPress
Le moyen le plus simple d’ajouter la recherche en direct Ajax à WordPress consiste à utiliser SearchWP Live Ajax Lite Search. Ce plugin gratuit ajoute automatiquement une recherche instantanée à votre site Web et fonctionne parfaitement avec n'importe quel thème WordPress.
La première chose à faire est d'installer et d'activer le plugin. Pour plus de détails, consultez notre guide étape par étape sur la façon d'installer un plugin WordPress.
Lors de l'activation, le formulaire de recherche WordPress par défaut utilisera automatiquement la fonction de recherche en direct Ajax. Si vous visitez votre site et commencez à taper dans la barre de recherche, vous verrez la recherche instantanée en action.
Par défaut, SearchWP affichera les résultats Ajax en direct sous le formulaire de recherche. Si vous préférez les afficher sous le formulaire de recherche, accédez à SearchWP » Recherche en direct dans le tableau de bord WordPress.
Ici, ouvrez la liste déroulante « Positionnement » et choisissez « Au-dessus du formulaire de recherche ».
Cela fait, cliquez sur « Enregistrer les paramètres » pour stocker vos modifications.
Visitez simplement votre site Web, votre marché en ligne ou votre blog et vous verrez que les résultats de recherche en direct apparaissent désormais au-dessus du formulaire de recherche.
Affichage d'Ajax Live Search sur votre site WordPress
Après avoir activé le plugin, chaque barre de recherche de votre site utilisera automatiquement la recherche Ajax en direct, y compris tous les formulaires de recherche WordPress personnalisés que vous avez créés.
La plupart des thèmes WordPress disposent d’une barre de recherche intégrée. Cependant, après avoir activé la recherche Ajax en direct, vous souhaiterez peut-être ajouter une barre de recherche à d’autres zones de votre site Web WordPress.
Ajout de la recherche Ajax en direct à la barre latérale WordPress
De nombreux propriétaires de sites Web ajoutent une barre de recherche à la barre latérale de leur site Web.
Cela permet aux visiteurs d'effectuer une recherche, peu importe où ils se trouvent sur votre site.
Pour ajouter le widget de recherche à WordPress, allez simplement dans Apparence » Widgets.
Cette page montre toutes les différentes zones prêtes pour les widgets de votre thème WordPress. Les options que vous voyez peuvent varier, mais la plupart des thèmes auront soit une barre latérale, une barre latérale droite, une barre latérale gauche ou une section similaire.
Cliquez simplement pour développer la zone dans laquelle vous souhaitez ajouter la barre de recherche Ajax en direct. Ensuite, cliquez sur l'icône « + ».
Dans la fenêtre contextuelle qui apparaît, tapez « SearchWP », puis cliquez sur l'icône « SearchWP Live Search » lorsqu'elle apparaît.
Cela ajoutera automatiquement le widget de recherche Ajax en direct à la barre latérale ou à une section similaire.
Vous pouvez ajouter un titre facultatif à la barre de recherche en tapant dans le champ « Titre ».
Lorsque vous avez terminé, cliquez sur le bouton « Mettre à jour » pour enregistrer vos modifications et afficher la barre de recherche Ajax sur votre blog ou site Web WordPress.
Désormais, si vous visitez votre site, vous verrez une barre de recherche Ajax en direct dans la barre latérale ou une section similaire.
Vous pouvez suivre le même processus pour ajouter la barre de recherche à n'importe quelle autre zone prête pour les widgets.
Pour ajouter une barre de recherche à votre menu de navigation, consultez notre guide sur la façon d'ajouter une barre de recherche à votre menu WordPress.
Ajout de la recherche en direct à la barre latérale WordPress à l'aide de l'éditeur de site complet
Si vous utilisez un thème basé sur des blocs tel que ThemeIsle Hestia Pro, vous pouvez ajouter une recherche Ajax en direct à n'importe quelle zone de votre thème à l'aide de l'éditeur de site complet.
Vous pouvez même ajouter une barre de recherche aux zones que vous ne pouvez pas modifier à l’aide de l’éditeur de contenu WordPress standard. Par exemple, vous pouvez ajouter un champ de recherche à votre modèle de page 404.
Pour commencer, rendez-vous sur Apparence ȃditeur dans le tableau de bord WordPress.
Par défaut, l'éditeur de site complet affiche le modèle d'accueil de votre thème, mais vous pouvez ajouter un bloc de recherche à n'importe quel modèle.
Pour voir toutes les options disponibles, sélectionnez « Modèles » dans le menu de gauche.
Vous pouvez maintenant cliquer sur le modèle dans lequel vous souhaitez ajouter la recherche Ajax en direct.
WordPress affichera désormais un aperçu de la conception et de tous les paramètres de page que vous pouvez modifier. Pour continuer et modifier ce modèle, cliquez sur la petite icône en forme de crayon.
Ceci fait, cliquez sur l’icône bleue « + ».
Dans le panneau qui apparaît, tapez « Rechercher ».
Lorsque le bloc « Rechercher » apparaît, faites-le glisser vers la zone où vous souhaitez afficher le champ.
Pour personnaliser le titre du bloc ou le texte de l'espace réservé, saisissez simplement le nouveau message dans le bloc de recherche.
Lorsque vous êtes satisfait de l'apparence du bloc, cliquez sur « Enregistrer » pour activer la barre de recherche Ajax.
Ajout de la recherche Ajax en direct aux pages WordPress
Vous souhaiterez peut-être également ajouter un champ de recherche Ajax en direct à des pages spécifiques de votre site Web. Par exemple, vous pouvez ajouter une barre à votre page d'archives personnalisée afin que les visiteurs puissent facilement effectuer des recherches dans les archives.
Pour ce faire, vous devrez ouvrir la publication ou la page sur laquelle vous souhaitez ajouter la barre de recherche. Pour cet exemple, nous allons vous montrer comment ajouter une recherche en direct à une page WordPress, mais les étapes seront similaires pour les publications.
Tout d'abord, accédez à Pages » Toutes les pages, puis sélectionnez la page que vous souhaitez modifier.
Dans l'éditeur de contenu WordPress, cliquez sur l'icône « + ».
Cela fera apparaître le menu des blocs.
Ici, tapez « Rechercher » dans la case, puis cliquez sur l'icône « Rechercher » pour l'ajouter à votre page.
WordPress placera automatiquement la barre de recherche pour vous.
Par défaut, la zone comporte un en-tête « Recherche ». Vous pouvez modifier cela en tapant dans le champ de l'étiquette, ou vous pouvez supprimer complètement le texte du titre.
Vous pouvez également saisir un espace réservé facultatif, qui est le texte que WordPress affichera avant que les visiteurs ne commencent à saisir leur requête de recherche. Par exemple, si vous gérez une boutique en ligne, vous souhaiterez peut-être utiliser quelque chose comme « Rechercher des produits » ou « Trouver des offres intéressantes ».
Lorsque vous êtes satisfait de la configuration de la barre de recherche, cliquez sur le bouton « Mettre à jour ».
Désormais, vos visiteurs peuvent utiliser la barre de recherche en direct pour trouver rapidement ce qu'ils recherchent.
Vous pouvez utiliser le même processus pour ajouter une barre de recherche à n’importe quelle publication ou page.
Personnalisation des résultats de recherche WordPress instantanés
SearchWP Live Ajax Search s'intègre parfaitement à la recherche WordPress intégrée. Cependant, cette recherche par défaut est assez limitée et ne permet pas d’afficher des résultats de recherche précis.
C'est là qu'intervient SearchWP.
C’est le meilleur plugin de recherche WordPress du marché, utilisé par plus de 30 000 sites Web.
Ce plugin permet aux visiteurs de rechercher du contenu que WordPress ignore par défaut, notamment des champs personnalisés, des fichiers texte, des documents PDF, des produits WooCommerce, etc.
En installant SearchWP, vous pouvez complètement personnaliser la nouvelle fonctionnalité instantanée de votre site sans écrire de code.
SearchWP dispose également d'analyses et de statistiques avancées qui vous permettent de voir ce que recherchent vos visiteurs.
Vous pouvez utiliser ces informations pour affiner la configuration de la recherche de votre site et identifier le contenu le plus populaire de votre site Web. Cela peut vous aider à générer de nouvelles idées d’articles de blog en fonction de ce que les visiteurs recherchent déjà.
Pour plus d'informations, consultez notre guide sur la façon d'améliorer la recherche WordPress avec SearchWP.
Nous espérons que cet article vous a aidé à apprendre comment ajouter la recherche Ajax en direct à votre site WordPress. Vous souhaiterez peut-être également consulter notre guide sur la façon de suivre les visiteurs d’un site Web et nos choix d’experts sur les plugins WordPress indispensables pour les sites Web d’entreprise.
Si vous avez aimé cet article, abonnez-vous à notre chaîne YouTube pour les didacticiels vidéo WordPress. Vous pouvez également nous trouver sur Twitter et Facebook.