Replacement search page to address NNG recommendations

ajax-search.php

function suggsearch() {

    $sugg = esc_html($_POST['suggestion']);
    
	$post_list = new WP_Query( 's=' . $sugg );							
	
	if ( $post_list->have_posts() ) : 
	
		// Start the Loop.
		while ( $post_list->have_posts() ) : $post_list->the_post();

			echo '<h3><a href="' . esc_url( get_permalink() ) . '" rel="bookmark">' . get_the_title() . '</a></h3>';
			echo get_the_excerpt();
 
		endwhile;
 
	else :
	
		echo 'none';
		
	endif;
	
	wp_reset_postdata();

    exit; // This is required to end AJAX requests properly.
}

// Register my custom function for AJAX processing
add_action('wp_ajax_suggsearch', 'suggsearch'); // Logged-in users
add_action('wp_ajax_nopriv_suggsearch', 'suggsearch'); // Guest users

function suggsearch_js() { ?>

    <script>
        // Set the "ajax_url" variable available globally
        ajax_url = "<?php echo admin_url('admin-ajax.php'); ?>";

        // Make your AJAX request on document ready:
		function suggestion_search( sugg ) {

            var sugg_data = {
                action: 'suggsearch', 
                suggestion: sugg,
            };

            jQuery.post(ajax_url, sugg_data, function(response) { 
                jQuery('#didyoumean').html('<p>Did you mean <a href="?s=' + sugg + '">' + sugg + '?</a></p>' + response);
            });
        }
    </script>

    <?php
}

// Inline JavaScript
add_action('wp_footer', 'suggsearch_js');

functions.php

function my_search_template_redirect() {
  
  if ( is_search() ) {
    include( get_stylesheet_directory() . '/searchpage.php' );
    exit();
  }
}

add_action( 'template_redirect', 'my_search_template_redirect', 1);

searchpage.php

<?php
/*
Template Name: Search Page
 */

get_header(); ?>

	<section id="primary" class="content-area">
		<div id="content" class="site-content" role="main">

			<!-- search form, original query term automatically pre-filled -->
			<header class="page-header">
				<div><?php get_search_form(); ?></div>
			</header><!-- .page-header -->

			<article>
				<div class="entry-content">	

			<?php if ( have_posts() ) : ?>
				<h1 class="page-title"><?php printf( __( 'The following matches were found', 'twentyfourteen' )  ); ?></h1>
				<?php
					// Start the Loop.
					while ( have_posts() ) : the_post();
					
						the_title( '<h3><a href="' . esc_url( get_permalink() ) . '" rel="bookmark">', '</a></h3>' );
						the_excerpt();

					endwhile;

				else :
				?>
					<h1 class="page-title"><?php printf( __( 'Sorry, no matches found', 'twentyfourteen' )  ); ?></h1>
					
					<!-- Did You Mean placeholder -->
					<div id="didyoumean"></div>					

					<h4>Search Suggestions:</h4>
					<ul>
						<li>Check your spelling</li>
						<li>Try more general words</li>
						<li>Try different words that mean the same thing</li>
					</ul>
					
					<h1 class="page-title">Or, perhaps these posts might be of interest...</h1>
					
					<?php
								
						list_posts( 'Most Recent Posts', 
								array(
									'post_type' => 'post',
									'posts_per_page' => 5,
									'orderby' => 'date',
									'order' => 'DESC') 
								);
								
						list_posts( 'Most Popular Posts', 
								array(
									'post_type' => 'post',
									'posts_per_page' => 5,
									'orderby' => 'comment_count',
									'order' => 'DESC')
								);
													
				endif;
			?>
				</div>			
			</article>			

		</div><!-- #content -->
	</section><!-- #primary -->

<?php

get_sidebar( 'content' );
get_sidebar();
get_footer();

?>
	<!-- call the Wikipedia API to generate suggestions for the search -->
	<script type="text/javascript">
	
		function didyoumean(data){
    		var sugg = data.query.searchinfo.suggestion;
    		if (sugg) {
    			document.getElementById('didyoumean').innerHTML = '<p>Did you mean <a href="?s=' + sugg + '">' + sugg + '?</a></p>';
    		}
		}
	</script>
	<script type="text/javascript" src="http://en.wikipedia.org/w/api.php?format=json&srnamespace=0&action=query&srlimit=1&list=search&srprop=sectiontitle&srsearch=<?php echo get_search_query(); ?>&callback=didyoumean"></script>					

<?php

function list_posts( $section_title, $args ) {

	$post_list = new WP_Query( $args );
						
	if ( $post_list->have_posts() ) {

		echo '<h4>' . $section_title .'</h4>';
						
		echo '<ul>';
						
		while ( $post_list->have_posts() ) : $post_list->the_post();
							
			the_title( '<li><a href="' . esc_url( get_permalink() ) . '" rel="bookmark">', '</a></li>' );
							
		endwhile;
							
		echo '</ul>';
						
	}

	wp_reset_postdata();
}