WordPress   

Starter template for WordPress search results page

Create a new file in child theme directory of your WordPress website and name it as search.php. Paste following code in it and save it.

<?php
/**
 * Custom Search Template
 *
 */

get_header(); ?>

<div class="search-posts-wrap">
    <div class="search-page-header">
        <h1 class="search-page-title">
            <?php echo "Search Results For: " . esc_html( get_search_query() ); ?>
        </h1>
    </div>
<?php if ( have_posts() ) {
        while ( have_posts() ) {
            the_post(); ?>
            <div class="search-post-box">
                <h3 class="search-item-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
                <?php echo wp_trim_words(get_the_content(), 20, '...' ); ?>
                <a href="<?php the_permalink(); ?>" class="view-search-item">Read More</a>
            </div>
        <?php } ?>
        <div class="search-pagination">
            <?php echo paginate_links( $args ) ?>
        </div>
    <?php } else {
        echo '<div class="no-search-results">0 Search Results Found</div>';
    }
?>
</div>
<?php get_footer();

 

How to change total number of search results in this newly created search template?

This step is completely optional, you can skip it if you want to keep the default number of posts in your search results page. If you want to change the total number of search results then copy following code and paste it in  functions.php file of the current theme. Replace 10 with any number you want to set for the total number of search results. Save it and you are done.

function modify_search_results_num($query) {
	if ( $query->is_search ) 
		$query->query_vars['posts_per_page'] = 10; 
	return $query; 
}
add_filter('pre_get_posts', 'modify_search_results_num'); 
Need a helping hand in fixing your website issues?

If you are facing any problems in implementing these code snippets and tutorials, you can hire us to fix your website issues.

Hire Us