На странице с поиском у вас есть глобальный запрос постов из которого вы можете достать контент записей, распарсить их регулярками и вывести во фронт. Для подсветки слов можете использовать этот код
if ( ! function_exists( 'wpgen_search_highlight' ) ) {
/**
* Highlight search results.
*
* @param string $text is text for highlight.
*
* @return string
*/
function wpgen_search_highlight( $text ) {
$s = get_query_var( 's' );
if ( is_search() && in_the_loop() && ! empty( $s ) ) :
$style = 'background-color:#307FE2;color:#fff;font-weight:bold;';
$query_terms = get_query_var( 'search_terms' );
if ( ! empty( $query_terms ) ) {
$query_terms = explode( ' ', $s );
}
if ( empty( $query_terms ) ) {
return '';
}
foreach ( $query_terms as $term ) {
$term = preg_quote( $term, '/' ); // like in search string.
$term1 = mb_strtolower( $term ); // lowercase.
$term2 = mb_strtoupper( $term ); // uppercase.
$term3 = mb_convert_case( $term, MB_CASE_TITLE, 'UTF-8' ); // capitalise.
$term4 = mb_strtolower( mb_substr( $term, 0, 1 ) ) . mb_substr( $term2, 1 ); // first lowercase.
$text = preg_replace( "@(?<!<|</)($term|$term1|$term2|$term3|$term4)@i", "<span style=\"{$style}\">$1</span>", $text );
}
endif; // is_search.
return $text;
}
}
add_filter( 'the_title', 'wpgen_search_highlight' );
add_filter( 'the_content', 'wpgen_search_highlight' );
add_filter( 'the_excerpt', 'wpgen_search_highlight' );