SearchWP

Version 4 Documentation

Display Custom Sources (e.g. Users) in Live Search Results

By default Live Search will utilize your Default Engine which is limited to Sources that are based on WP_Post objects (e.g. Posts, Pages, Custom Post Types, etc.)

We can use the searchwp_live_search_get_search_form_engine hook to use a Supplemental Engine for Live Search results, but in the same way that we need to use a custom results template for a Supplemental Engine we need to use a custom results template for Live Ajax Search if we want to display results from a custom Source.

SearchWP Live Ajax Search has a template structure we can utilize to output our custom Source results.

In this example we’ll put together a Live Ajax Search results template that takes into consideration Users from our supplemental Engine:

Screenshot of Engine config

On this example site we have a User that has a username of ‘coffeefan’ with a display name of ‘Jane Doe’:

Screenshot of Users

When we search for coffee using Live Ajax Search, our custom results template will include that result and another Post about coffee:

User result

To implement this custom Live Search results template we can create a folder searchwp-live-ajax-search in our theme directory, and inside that folder create a file search.results.php with this code:

<?php
// Execute a search using our supplemental SearchWP Engine.
$search_query = isset( $_REQUEST['s'] ) ? sanitize_text_field( $_REQUEST['s'] ) : null;
$search_results = [];
if ( ! empty( $search_query ) && class_exists( '\\SearchWP\\Query' ) ) {
$searchwp_query = new \SearchWP\Query( $search_query, [
'engine' => 'supplemental', // The Engine name.
'fields' => 'all', // Load proper native objects of each result.
] );
$search_results = $searchwp_query->get_results();
}
?>
<?php if ( ! empty( $search_query ) && ! empty( $search_results ) ) : ?>
<?php foreach ( $search_results as $search_result ) : ?>
<?php
switch( get_class( $search_result ) ) {
case 'WP_Post':
?>
<div class="searchwp-live-search-result" role="option" id="" aria-selected="false">
<p><a href="<?php echo esc_url( get_permalink( $search_result->ID ) ); ?>">
<?php echo get_the_title( $search_result->ID ); ?> &raquo;
</a></p>
</div>
<?php
break;
case 'WP_User':
?>
<div class="searchwp-live-search-result" role="option" id="" aria-selected="false">
<p><a href="<?php echo get_author_posts_url( $search_result->data->ID ); ?>">
<?php echo esc_html( $search_result->data->display_name ); ?> &raquo;
</a></p>
</div>
<?php
break;
}
?>
<?php endforeach; ?>
<?php else : ?>
<p class="searchwp-live-search-no-results" role="option">
<em><?php esc_html_e( 'No results found.', 'swplas' ); ?></em>
</p>
<?php endif; ?>

This results template can be customized in any way you’d like, outputting various attributes of each result type as determined by the switch statement.

[wpforms id="3080"]