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 voilà, 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