Vous êtes ici : Accueil | Snippets WordPress | Template | Mettre en surbrillance les termes recherchés

Mettre en surbrillance les termes recherchés

recherche WordPress snippet

Pour plus de lisibilité et de facilité pour vos visiteurs, vous pouvez mettre en surbrillance les termes recherchés par ceux-ci sur votre page de résultats de recherche.

Par exemple, voici ce que vous pouvez avoir avec le thème Divi et le terme « article » recherché :

recherche en surbrillance

Plutôt pratique pour cibler directement les résultats les plus pertinents pour le visiteur.

Pour arriver à ce résultat, voici les étapes à suivre :

Chercher le fichier search.php de votre thème et copiez-collez le dans votre thème enfant. Si comme moi vous utilisez Divi, alors vous ne trouverez pas ce fichier. Le thème utilise le template index.php pour afficher les résultats de recherche.

Vous avez donc deux possibilités : soit vous dupliquez le fichier index.php en le renommant search.php dans votre thème enfant, soit vous pouvez par exemple télécharger directement un template de page de recherche pour Divi sur cette page.

Vous allez ensuite devoir localiser la ligne :

<?php the_title(); ?>

et la remplacer par :

<?php echo $title; ?>

Copiez au dessus de cette ligne le code :

<?php $title = get_the_title(); $keys= explode(" ",$s); $title = preg_replace('/('.implode('|', $keys) .')/iu', '<strong class="search-excerpt">\0</strong>', $title); ?>

Et voila, il ne vous reste plus qu’à améliorer le CSS suivant le design de votre site. Voici un exemple de celui utilisé sur l’image au-dessus :

/* CSS terme recherché en surbrillance */

strong.search-excerpt { 
	background-color: yellow;
	color: #666;
	padding: 0px 10px
}

Source: WPBeginner

Vous débutez ? Procurez-vous le Kit du Freelance WordPress

Trouver les bons clients, leur vendre des prestations et bien communiquer avec eux n'est pas inné. Évitez les galères et gagnez du temps en vous formant aux côtés de ces 7 professionnels.

Commencer maintenant

    Laisser un commentaire

    Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

    La Marmite ne peut malheureusement pas fournir de support. Merci d'en tenir compte dans votre commentaire 😉

    Si vous ne lui en voulez pas, donnez-lui un j'aime sur Facebook :



    33958be2906f8b188d62d43b36c44739KKKKKKKKKKKKKKKKKKKKKKKK
    Partagez
    Tweetez
    Partagez