Comment ajouter une recherche Ajax en direct à votre WordPress sans plugin

Vous cherchez un moyen d'ajouter une recherche Ajax en direct à votre site WordPress sans plugin ?

Cela vous permettra de fournir instantanément des résultats de recherche à vos visiteurs et d'améliorer leur expérience utilisateur.

Dans ce guide, nous expliquerons comment vous pouvez ajouter une recherche en direct à votre site sans plugin et les inconvénients de cette méthode.

Voici une table des matières pour vous aider à naviguer :

• Pourquoi ajouter la recherche en direct à votre site
• Inconvénients de l'ajout de la recherche Ajax en direct sans plugin
• La méthode la plus simple pour ajouter une recherche Ajax en direct à votre site
• Comment ajouter une recherche Ajax en direct à votre WordPress sans plugin

Commençons!

Pourquoi ajouter la recherche en direct à votre site

L'ajout de la recherche en direct à votre site est utile pour plusieurs raisons.

Premièrement, il est beaucoup plus pratique pour vos visiteurs d'obtenir des résultats de recherche instantanés plutôt que de les voir sur une nouvelle page séparée où WordPress les affiche par défaut.

Cela leur permet de gagner du temps et de déterminer plus rapidement si le contenu qu'ils recherchent se trouve sur votre site ou non.

Deuxièmement, cela vous aide à augmenter vos pages vues, car les visiteurs qui ont eu une expérience de recherche positive sur votre site sont plus susceptibles de l'utiliser à nouveau.

C'est aussi un excellent moyen d'attirer plus de trafic en provenance des moteurs de recherche puisque Google accorde beaucoup d'attention à la durée moyenne des sessions sur un site.

Mais, ajouter une recherche en direct sans plugin peut être un objectif difficile. Examinons de plus près pourquoi ce n'est pas la meilleure option.

Inconvénients de l'ajout de la recherche Ajax en direct sans plugin

Le principal problème lié à l'ajout d'une recherche en direct sur votre site sans plug-in est qu'il implique la modification du code de votre thème.

Cette approche présente quelques inconvénients sérieux dont vous devez être conscient :

• Cela nécessite des compétences en codage . Vous devez avoir une expérience de codage et une compréhension approfondie du fonctionnement de WordPress pour éditer avec succès le code de votre thème.
• Cela prend plus de temps . Contrairement à l'utilisation d'un plugin, l'édition de votre code de thème prend un certain temps pour déterminer les modifications que vous devez apporter et où les mettre.
• Ce n'est pas fiable . Vous pouvez facilement perdre toutes vos personnalisations de code si vous mettez à jour votre thème ou votre version de WordPress.
• Ce n'est pas commode . Un plugin vous donne beaucoup plus de flexibilité puisque vous pouvez rapidement activer et désactiver les fonctionnalités dont vous avez besoin en fonction de vos besoins.

Donc, si vous n'êtes pas un utilisateur expérimenté de WordPress ou un développeur Web, vous feriez mieux d'utiliser un autre moyen d'ajouter une recherche en direct à votre site.

Une fois que nous avons réglé cela, voyons comment vous pouvez ajouter une recherche en direct à votre site sans modifier vos fichiers de thème à l'aide d'un plugin.

La méthode la plus simple pour ajouter une recherche Ajax en direct à votre site

Le moyen le plus simple d'ajouter une recherche Ajax en direct à votre site consiste à utiliser un plugin comme SearchWP.

SearchWP est le meilleur plugin de recherche WordPress sur le marché, avec plus de 30 000 installations actives.

Avec lui, vous pouvez activer et désactiver la recherche en direct sur votre site en quelques clics, aucun codage n'est nécessaire.

Et ce n'est qu'une des nombreuses autres fonctionnalités de SearchWP. L'objectif principal de ce plugin est de vous donner un contrôle total sur la recherche sur votre site.

Par exemple, en l'utilisant, vous pouvez modifier l'ordre des résultats de recherche, rendre les balises de publication, les catégories et les champs personnalisés consultables, créer des formulaires de recherche personnalisés, et bien plus encore.

Voici quelques autres fonctionnalités de SearchWP qui vous aideront à développer votre entreprise :

• Activer la recherche floue . De cette façon, vos visiteurs peuvent trouver les bons résultats de recherche, même s'ils font une faute de frappe dans une requête de recherche.
• Suivez les recherches de vos visiteurs . Rassemblez des données complètes sur l'activité de recherche sur votre site, y compris les recherches les plus populaires, le nombre de clics, etc.
• Exclure des pages spécifiques des résultats de recherche . Masquez les pages inutiles des résultats de recherche sur votre site pour aider les visiteurs à trouver plus rapidement le contenu qu'ils recherchent.
• Inclure des fichiers PDF dans les résultats de recherche . Laissez vos visiteurs trouver des PDF et des documents bureautiques en utilisant la barre de recherche de votre site.

Avec cela, voyons comment vous pouvez activer la recherche en direct sur votre site en utilisant SearchWP.

Étape 1 : Installez et activez SearchWP sur votre site

Pour commencer, vous devrez obtenir votre copie de SearchWP.

Une fois cela fait, accédez à votre tableau de bord SearchWP et cliquez sur Téléchargements .

Ensuite, appuyez sur le bouton Télécharger SearchWP et enregistrez le fichier ZIP du plugin sur votre ordinateur.

Après le téléchargement, copiez votre clé de licence SearchWP sur la même page. Vous en aurez encore besoin pour activer le plugin sur votre site.

Vous devez maintenant télécharger le fichier ZIP SearchWP sur votre site et installer le plugin. Découvrez comment installer un tutoriel de plugin WordPress si vous avez besoin d'un rappel sur la façon de le faire,

Après l'installation de SearchWP, vous devrez activer la copie de votre plugin avec votre clé de licence.

Pour ce faire, pointez votre curseur sur le bouton SearchWP dans le panneau supérieur de votre tableau de bord WordPress et cliquez sur Activer la licence .

Une fois sur la page Licence , collez votre clé de licence SearchWP dans le champ Licence et cliquez sur Activer .

Une fois que vous avez activé votre licence, vous êtes prêt à passer à l'étape suivante et à installer l'extension Live Search.

Étape 2 : Installez l'extension SearchWP Live Search

L'installation de cette extension SearchWP vous permet d'activer la recherche Ajax en direct sur votre site en quelques clics sans écrire une seule ligne de code.

Pour commencer, accédez à SearchWP »Extensions sur le côté gauche de votre tableau de bord WordPress.

Ensuite, recherchez l'extension Live Search et cliquez sur Installer dans sa section.

C'est ça. Vous venez d'ajouter avec succès une recherche Ajax en direct à votre site.

Voyons voir comment ça fonctionne.

Étape 3 : Testez votre nouvelle recherche

Pour ce faire, rendez-vous sur votre site et effectuez une recherche.

Par exemple, voici à quoi ressemble une recherche SearchWP Ajax en direct sur notre site de test :

Voyons maintenant comment vous pouvez ajouter une recherche en direct à votre site sans plugin.

Comment ajouter une recherche Ajax en direct à votre WordPress sans plugin

Pour ajouter une recherche Ajax en direct à votre site sans utiliser de plugin, vous devrez apporter des modifications à vos fichiers de thème.

Pour commencer, créez un thème enfant de votre thème actuel que vous utilisez sur votre site.

Cela vous permettra de passer rapidement à votre thème parent si vous faites quelque chose de mal et plantez votre site.

Il est également recommandé de sauvegarder votre site avant de commencer à le modifier, au cas où.

Vous pouvez consulter ce didacticiel sur la création d'un thème enfant WordPress si vous avez besoin d'aide.

Après avoir créé un thème enfant, accédez à votre tableau de bord WordPress et accédez à Apparence » Éditeur de fichiers de thème .

Recherchez ensuite le fichier functions.php et cliquez dessus pour l'ouvrir dans l'éditeur de fichiers.

Ensuite, collez le code suivant dans votre fichier functions.php :

<?php 
/*
 ==================
 Ajax Search
======================	 
*/
// add the ajax fetch js
add_action( 'wp_footer', 'ajax_fetch' );
function ajax_fetch() {
?>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-wp-preserve="%3Cscript%20type%3D%22text%2Fjavascript%22%3E%0Afunction%20fetch()%7B%0A%0A%20%20%20%20jQuery.ajax(%7B%0A%20%20%20%20%20%20%20%20url%3A%20'%3C%3Fphp%20echo%20admin_url('admin-ajax.php')%3B%20%3F%3E'%2C%0A%20%20%20%20%20%20%20%20type%3A%20'post'%2C%0A%20%20%20%20%20%20%20%20data%3A%20%7B%20action%3A%20'data_fetch'%2C%20keyword%3A%20jQuery('%23keyword').val()%20%7D%2C%0A%20%20%20%20%20%20%20%20success%3A%20function(data)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20jQuery('%23datafetch').html(%20data%20)%3B%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D)%3B%0A%0A%7D%0A%3C%2Fscript%3E" data-mce-resize="false" data-mce-placeholder="1" class="mce-object" width="20" height="20" alt="&lt;script&gt;" title="&lt;script&gt;" />

<?php
}

// the ajax function
add_action('wp_ajax_data_fetch' , 'data_fetch');
add_action('wp_ajax_nopriv_data_fetch','data_fetch');
function data_fetch(){

    $the_query = new WP_Query( array( 'posts_per_page' => -1, 's' => esc_attr( $_POST['keyword'] ), 'post_type' => array('page','post') ) );
    if( $the_query->have_posts() ) :
        echo '<ul>';
        while( $the_query->have_posts() ): $the_query->the_post(); ?>

            <li><a href="<?php echo esc_url( post_permalink() ); ?>"><?php the_title();?></a></li>

        <?php endwhile;
       echo '</ul>';
        wp_reset_postdata();  
    endif;

    die();
}

Une fois que vous avez terminé, appuyez sur Mettre à jour le fichier pour enregistrer vos modifications.

C'est ça. Vous avez ajouté avec succès la recherche Ajax en direct à votre site WordPress sans plugin.

Cela permettra à vos visiteurs d'obtenir instantanément des résultats de recherche et d'augmenter le nombre de vos pages vues.

Vous souhaitez ajouter une recherche en direct à votre site en quelques clics sans codage ? Vous pouvez commencer avec SearchWP ici.

Vous vous demandez comment activer la recherche par balises de publication ? Consultez notre didacticiel détaillé sur la recherche de publications par balises dans WordPress.

Vous souhaitez masquer certaines catégories de publications de la recherche ? Suivez la procédure pour exclure une catégorie du guide de recherche WordPress.