WordPress: Search Results

You should already know a bit about “The Loop” and how to use WordPress in general before you continue with this tutorial.

First we will need to make a search form. Copy and paste the following code into a new document. You can edit it to your liking – “Search for:” can be replaced with no text or your own text, for example. Try to avoid fiddling too much with it.

<form method="get" id="searchform" action="<?php bloginfo('url'); ?>/">
<label class="hidden" for="s"><?php _e('Search for:'); ?></label>
 <div>
   <input type="text" value="<?php the_search_query(); ?>" name="s" id="s" />
   <input type="submit" id="searchsubmit" value="Search" />
 </div>
</form>

Save this document as searchform.php and upload it to your theme folder. This means the folder that contains the theme you are currently using.

Now we will need to call on that search form where we want it. The following PHP include will do that. Simply place it where you would like the form to appear.

<?php get_search_form(); ?>

Now we can customise the search results page. Copy everything in index.php of your theme, and paste it into a new document. You will need to remove everything within The Loop (between <?php while (have_posts()) : the_post(); ?> and <?php endwhile; ?>), and then replace it with the following:

<h1><a href="<?php the_permalink() ?>" rel="bookmark" 
title="Permanent Link to <?php the_title_attribute(); ?>">
<?php the_title(); ?></a><br />
<?php the_time('l jS F, Y - g:ia') ?><br />
Posted in <?php the_category(', ') ?></h1>

The above is how I have customised it myself. You can customise it yourself, for example, the_time can be removed if you don’t wish to show the time, or changed to the format you like (visit php.net/date for formatting options).

The search results don’t display the entries, so when searching, the viewer won’t have to sift through pages and pages of entries, but rather, just the title of each post or page. If you would like the post to be displayed, use the following code directly after the previous code:

<?php the_content('Read the rest of this entry...'); ?>

The search form will show a certain number of results – which is actually the number of posts you have chosen to display in your Reading settings. You might want to show all the results of the search, which is where the following code comes in. Place it before <?php if (have_posts()) : ?>.

<?php $posts=query_posts($query_string . '&posts_per_page=-1'); ?>

Simply change -1 to a positive integer if you want a certain number of results shown. If you do this, you might want to include next/previous entry links to view further pages. This should be placed at the end of The Loop.

<?php next_posts_link('&laquo; Older Entries') ?>
<?php previous_posts_link('Newer Entries &raquo;') ?>

Add a title to the page directly after the header include. When you are done, save the file as search.php, upload it and searchform.php to your theme folder, test your search box and you’re good to go.

The following is roughly what search.php should look like in the end:

<?php get_header(); ?>

<?php $posts=query_posts($query_string . '&posts_per_page=20'); ?>

<?php if (have_posts()) : ?>
<h1>Search Results</h1>
<?php while (have_posts()) : the_post(); ?>

<h1><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>">
<?php the_title(); ?></a><br />
<?php the_time('l jS F, Y - g:ia') ?><br />
Posted in <?php the_category(', ') ?></h1>

<?php endwhile; ?>

<?php endif; ?>

<?php next_posts_link('&laquo; Older Entries') ?>
<?php previous_posts_link('Newer Entries &raquo;') ?>

<?php get_footer(); ?>