Add a category filter to WordPress search form

WordPress has a simple function to build a search form for your blog and in this tutorial I’ll show you how to add a category filter to it.

<?php get_search_form(); ?>

This function will look for a file called searchform.php inside your template folder: if it doesn’t exist it will output the standard search form. So, if it isn’t already in place, create your custom searchform.php and copy into it the default search form output. It should look similar to this:

<form role="search" method="get" id="searchform" action="<?php bloginfo('siteurl'); ?>">
  <div>
    <label class="screen-reader-text" for="s">Search for:</label>
    <input type="text" value="" name="s" id="s" />
    <input type="submit" id="searchsubmit" value="Search" />
  </div>
</form>

We want to add a select box to let the user search in a specific category or in all categories: to achive this we’ll use another default WordPress function.

The wp_dropdown_categories function will build for you a select box with all your categories. Take a look at the documentation for all available options.

<?php wp_dropdown_categories( 'show_option_all=All Categories' ); ?>
 
<!-- This is a sample output of the function -->
 
<select name='cat' id='cat' class='postform' >
  <option value='0' selected='selected'>All Categories</option>
  <option class="level-0" value="1">Uncategorized</option>
  <option class="level-0" value="3">HTML &amp; CSS</option>
  <option class="level-0" value="4">Java</option>
  <option class="level-0" value="5">Links</option>
  <option class="level-0" value="6">Linux</option>
  <option class="level-0" value="9">Javascript</option>
  <option class="level-0" value="32">XML</option>
</select>

Now add the category select box to the form modifying your searchform.php like this:

<form role="search" method="get" id="searchform" action="<?php bloginfo('siteurl'); ?>">
  <div>
    <label class="screen-reader-text" for="s">Search for:</label>
    <input type="text" value="" name="s" id="s" /> 
    in <?php wp_dropdown_categories( 'show_option_all=All Categories' ); ?> 
    <input type="submit" id="searchsubmit" value="Search" />
  </div>
</form>

That’s it. It just works out of the box.

A finishing touch

Now that you have a nice category filter in your search form it would be great to modify the search result page and add something like Search result for “foo” in category “bar”.
Well, it’s quite easy: we need do add a simple function to the function.php file. Remember that every function in this file will be automatically available in your theme.

This is a simple function that gets the cat parameter from the request and if it’s not null it searches the category name. It has two input parameters so you can pass two strings to be displayed before and after the category name. If cat is null or empty or “0″ (All categories) it will return an empty string.

function getCatSearchFilter($pre,$post){
 
  $category = "";
  $catId = htmlspecialchars($_GET["cat"]);
  if ($catId != null && $catId != '' && $catId != '0'){
    $category = $pre.get_cat_name($catId).$post;
  }
  return $category;
}

Now open you search.php, add the function call to the page and you are done:

<h1>Search Results for <?php echo(get_search_query());?><?php echo(getCatSearchFilter(' in category ',''));?></h1>

5 August 2009 category filter functions PHP search template WordPress Tech

7 Responses

Add a category filter to WordPress search form | Alessandro … | Hipacopa • 5.08.09 @ 15.08

[...] post: Add a category filter to WordPress search form | Alessandro … No Comments Read [...]
Mike Brisk • 24.02.10 @ 09.02

Am I able to add multiple categories options to the form? Example: I want the form to display only the results from a search of Category1+Category23+Category89

Three separate dropdowns:

php wp_dropdown_categories( ‘child_of=1&depth=2′ );
php wp_dropdown_categories( ‘child_of=23&depth=2′ );
php wp_dropdown_categories( ‘child_of=89&depth=2′ );

So they can choose a category from each option and the results will be more specific.

thanks,
Mike
Cayo Medeiros (yogodoshi) • 3.04.10 @ 06.04

I have the same doubt as Mike here, can you please enlight us? =D
Carlos • 8.04.10 @ 01.04

I’m looking to do the same as Mike and Cayos, help please :)
Alessandro • 8.04.10 @ 09.04

I’m trying to find some spare time to look at this…. :)
webbando • 14.06.10 @ 15.06

hi Alessandro. Thanks for your post. I have a question: can we add a filter for tags also?
Alessandro • 14.06.10 @ 21.06

Finally I have a solution regarding the multiple categories select box: it’s definitely possible! You must concatenate categories ids separated by commas, so you need some Javascript code.

Example: http://myblog.com/?s=searchString&cat=1,2,3

There’s a simple solution for tags too. Just add the tag parameter to search query:

Example: http://myblog.com/?s=searchString&cat=1&tag=myTag

I’m going to write a blog post on this :)

Alessandro Melandri