Comment ajouter un formulaire de recherche dans une publication WordPress

Vous souhaitez ajouter un formulaire de recherche à une publication WordPress ?

En ajoutant une barre de recherche au contenu de votre publication, vous pouvez aider les internautes à trouver davantage de contenu de qualité et les faire rester plus longtemps sur votre site.

Dans cet article, nous allons vous montrer comment ajouter un formulaire de recherche à un article WordPress.

Pourquoi ajouter un formulaire de recherche à vos publications et pages ?

Si les visiteurs apprécient un article sur votre site WordPress, il est probable qu’ils voudront en lire d’autres. En ajoutant un formulaire de recherche à un article, vous pouvez aider les visiteurs à trouver d’autres blogs qui les intéressent.

De cette manière, vous pouvez augmenter le nombre de pages vues et réduire votre taux de rebond.

Plus les visiteurs restent longtemps sur votre site web, plus il y a de chances qu’ils s ‘inscrivent à votre liste d’adresses électroniques, laissent un commentaire, effectuent un achat, vous suivent sur les médias sociaux ou entreprennent d’autres actions positives.

Dans ce guide, nous allons vous montrer comment ajouter le formulaire de recherche standard de WordPress à vos articles. Si vous souhaitez utiliser un formulaire personnalisé à la place, consultez notre guide étape par étape sur la création d’un formulaire de recherche personnalisé sur WordPress.

Ceci étant dit, voyons comment ajouter facilement un formulaire de recherche dans un article WordPress. Utilisez les liens rapides ci-dessous pour accéder directement à la méthode que vous souhaitez utiliser :

Méthode 1. Ajouter un formulaire de recherche dans un article WordPress (fonctionne avec n’importe quel thème)

La façon la plus simple d’ajouter un formulaire de recherche à vos publications est d’utiliser le bloc Recherche intégré.

Dans ce guide, nous allons vous afficher comment ajouter le bloc à une publication, mais vous pouvez également l’ajouter à n’importe quelle page ou zone de votre site prête à recevoir des widgets.

Pour Premiers pas, il suffit d’ouvrir la page où vous souhaitez ajouter un formulaire de recherche. Dans l’éditeur/éditrices de contenu de WordPress, cliquez sur l’icône +.

Dans la fenêtre surgissante, tapez « Rechercher ». Lorsque le bloc de droite apparaît, cliquez pour l’ajouter à la page.

Par défaut, le bloc utilise « Rechercher » pour son libellé et le texte du bouton. Ce texte sera visible par les internautes, vous pouvez donc le remplacer par quelque chose de plus descriptif.

Par exemple, si vous ajoutez la barre de recherche à un blog WordPress, vous voudrez peut-être utiliser « Rechercher les publications récentes du blog » ou quelque chose de similaire.

Vous pouvez même utiliser le libellé et le texte du bouton pour motiver vos internautes.

Par exemple, si vous avez créé un magasin en ligne à l’aide d’une extension telle que WooCommerce, alors vous pourriez utiliser quelque chose comme  » Trouver plus de bons plans  » ou  » Rechercher des offres similaires « .

Vous pouvez également ajouter un texte de remplacement. Ce texte disparaîtra automatiquement lorsque l’internaute commencera à taper.

Pour ajouter un module, il suffit de cliquer sur « Module facultatif… » et de commencer à taper.

Par défaut, WordPress utilisera votre thème pour styliser la barre de recherche.

Vous pouvez toutefois modifier la couleur de l’arrière-plan et du texte du bouton à l’aide des Réglages « Couleur » dans le menu de droite. Cela peut aider votre barre de recherche à se démarquer du reste de votre site.

Lorsque vous êtes satisfait de l’aspect du bloc Recherche, vous pouvez publier ou mettre à jour la publication. Si vous visitez votre site, vous verrez maintenant la barre de recherche dans le contenu de la publication.

Vous pouvez ajouter un formulaire de recherche à d’autres publications et pages WordPress en suivant le même processus ci-dessus. Pour des instructions détaillées sur la façon d’ajouter la barre de recherche à une colonne latérale ou à une section similaire, veuillez consulter notre guide sur l’ajout et l’utilisation de widgets dans WordPress.

Méthode 2. Ajouter un formulaire de recherche à tous les articles de WordPress(thèmes basés sur des blocs)

Si vous utilisez un thème basé sur des blocs, comme ThemeIsle Hestia Pro, vous pouvez ajouter une barre de recherche au modèle que WordPress utilise pour tous les articles de votre blog.

De cette manière, vous pouvez rapidement et facilement ajouter une barre de recherche à chaque publication unique sur l’ensemble de votre site WordPress.

Pour ouvrir l’éditeur du site complet, allez dans Thèmes  » É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.

Pour voir toutes les options disponibles, sélectionnez « Modèles » dans le menu de gauche.

Elle affiche une liste de tous les modèles qui composent votre thème WordPress.

Pour personnaliser le modèle de blog, cliquez sur « Simple ».

WordPress affiche maintenant une Prévisualisation de la mise en page du blog.

Pour modifier ce Modèle, cliquez sur l’icône du petit crayon.

Vous verrez maintenant ce Modèle dans l’éditeur/éditrices du site complet.

Pour ajouter une barre de recherche, cliquez sur l’icône bleue « + ».

Dans la fenêtre surgissante, tapez « Rechercher » pour trouver le bon bloc.

Vous pouvez maintenant faire glisser le bloc à l’Emplacement où vous souhaitez afficher la barre de recherche.

Pour personnaliser le titre du bloc ou le Texte indicatif, il suffit de personnaliser la nouvelle messagerie dans le bloc de recherche.

Lorsque vous êtes satisfait de l’aspect du bloc, cliquez sur « Enregistrer » pour mettre la barre de recherche en direct.

Maintenant, si vous visitez n’importe quelle publication de blog sur votre site, vous verrez la barre de recherche.

Méthode 3. Ajouter une barre de recherche à tous les articles de WordPress avec un code (fonctionne avec n’importe quel thème)

Si vous n’utilisez pas de thème en bloc mais que vous souhaitez que la barre de recherche apparaisse dans tous vos messages, vous devrez utiliser un code.

Pour ce faire, nous vous recommandons d’utiliser WPCode. Ce plugin d’extraits de code permet d’insérer facilement et en toute sécurité du code personnalisé dans les fichiers de votre thème sans les modifier directement. Vous pouvez ainsi ajouter divers extraits de code sans endommager votre site web.

Ce que vous voulez faire, c’est installer le plugin WPCode dans WordPress. Vous pouvez lire notre guide étape par étape sur l ‘installation d’un plugin WordPress pour plus d’informations.

Ensuite, allez dans Code Snippets «  + Add Snippet. Sélectionnez « Ajouter votre code personnalisé (nouvel extrait) » et cliquez sur le bouton « Utiliser l’extrait ».

Maintenant, donnez un nom à votre nouveau code personnalisé. Il peut s’agir de quelque chose de simple comme « Barre de recherche sur les articles de blog ».

Ensuite, changez le type de code en « PHP Snippet ».

Ensuite, dans la boîte de prévisualisation du code, copiez et collez l’extrait de code suivant:

// Define the button text and placeholder text. You can customize these values as needed.
$button_text = 'Search'; // The text displayed on the search button
$placeholder_text = 'What are you looking for?'; // The placeholder text in the search input field

// Construct the search form HTML using the defined button text and placeholder text.
$search_form = '<form role="search" method="get" action="' . esc_url(home_url('/')) . '" class="wp-block-search__button-outside wp-block-search__text-button wp-block-search">
                    <label class="wp-block-search__label" for="wp-block-search__input-2">' . esc_html($button_text) . '</label>
                    <div class="wp-block-search__inside-wrapper ">
                        <input class="wp-block-search__input" id="wp-block-search__input-2" placeholder="' . esc_attr($placeholder_text) . '" value="" type="search" name="s" required="">
                        <button aria-label="' . esc_attr($button_text) . '" class="wp-block-search__button wp-element-button" type="submit">' . esc_html($button_text) . '</button>
                    </div>
                </form>';

// Output the search form HTML.
echo $search_form;

Ce code ajoute une barre de recherche de base similaire au bloc de recherche. Vous pouvez personnaliser le bouton et le texte de l’espace réservé selon vos besoins.

Une fois cela fait, faites défiler vers le bas et assurez-vous que « Insertion automatique » est sélectionné pour la méthode d’insertion.

En ce qui concerne l’emplacement, accédez à l’onglet « Page-Specific » et choisissez celui qui correspond le mieux à vos critères. Pour les besoins de l’exemple, nous avons choisi « Insérer après le contenu ».

Lorsque vous avez terminé, il vous suffit de rendre le code « actif » et de cliquer sur « Enregistrer l’extrait ».

Vous devriez maintenant voir quelque chose comme ceci :

Découvrez des conseils et des astuces pour améliorer la recherche sur WordPress

Le bloc Recherche utilise la fonction de recherche intégrée de WordPress. Cependant, celle-ci est assez limitée et ne permet pas d’obtenir des résultats précis. Vous pouvez en savoir plus sur le fonctionnement de la fonction de recherche de WordPress dans notre article.

Dans certains cas, vous pouvez souhaiter que la fonction de recherche de WordPress soit plus avancée. Vous souhaitez peut-être ajouter une fonction de recherche par catégorie ou rendre les commentaires de vos articles de blog consultables.

C’est là que SearchWP intervient. Ce plugin de recherche personnalisé vous donne un contrôle complet sur la recherche du site WordPress afin que vous puissiez fournir des résultats plus précis à vos visiteurs.

SearchWP permet également d’effectuer des recherches dans toutes les parties de votre site, y compris les fichiers PDF, les fichiers ACF, les fichiers texte, les champs personnalisés de WordPress, etc.

Après avoir créé un formulaire de recherche personnalisé, vous pouvez l’ajouter à n’importe quelle partie de votre site à l’aide d’un bloc ou d’un code court.

Pour en savoir plus, veuillez consulter notre guide sur l’amélioration de la recherche sur WordPress avec SearchWP.

Nous espérons que ce tutoriel vous a aidé à apprendre comment ajouter un formulaire de recherche dans une publication WordPress. Vous voudrez peut-être aussi apprendre comment créer un formulaire de contact dans WordPress ou consulter notre choix d’experts des meilleurs services de marketing e-mail pour les petites entreprises.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.