In WordPress it’s easy to use a widget for searching within the website. Often the standard search query suffices. But sometimes you want to refine the search options. This can be done in a simple way by adding extra fields in the form.

The function get_search_form() has standard as output in WordPress 3.0 the next html:

<form role="search" method="get" id="searchform" action="/" >
<div><label for="s">Search for:</label>
<input type="text" value="searchtest" name="s" id="s" />
<input type="submit" id="searchsubmit" value="Search" />
</div>
</form>

The only variable that will be submitted here is “s” with the value of the search query, in this case “searchtest”. However, you can refine it in many ways. For example by only showing posts in the search results. This can be done with the next addition:

<input type="hidden" value="post" name="post_type" id="post_type" />

Here we submit the value “post”. The default value is “any”, meaning, posts, pages, etc.
There are many additions like this. With a var_dump() of the object $wp_query you can see all the default values of the search variables. With a var_dump() of $wp_query->query you can see the current query.

Searchform.php

You can make this set of input-fields the standard search query by adding a searchform.php in your theme directory. The searchform.php can look like this:

<form role="search" method="get" id="searchform" action="/" >
<div><label for="s">Search for:</label>
<input type="text" value="<?php the_search_query(); ?>" name="s" id="s" />
<input type="hidden" value="post" name="post_type" id="post_type" />
<input type="submit" id="searchsubmit" value="Search" />
</div>
</form>

Each time you call the function get_search_form() you will get the right form.

WordPress is origineel opgebouwd rond een andere javascript library, Prototype. In latere instantie is er pas jQuery aan toegevoegd. De gebruikte jQuery is echter licht aangepast om niet te conflicteren met Prototype. Veel plugins gebruiken ook deze jQuery.
Probleem kan echter zijn dat de eigen toegevoegde jQuery scripts niet goed werken wanneer de jQuery van WordPress wordt gebruikt. Er is een goede oplossing hiervoor.

De oplossing

De oplossing houdt in dat we de eerste regel van onze eigen jQuery scripts aanpassen.
De regel die eruit ziet als:

$(document).ready(function()

Veranderen we in:

jQuery(document).ready(function()

Zo wordt in het script dat we gebruiken ook jQuery daadwerkelijk aangeroepen.
De oorzaak ligt er namelijk in dat het $ teken gebruikt wordt om jQuery aan te roepen binnen een script, maar omdat WordPress rond Prototype gebouwd is wordt dat binnen Prototype juist aangeroepen. En dat werkt niet.

We kunnen deze aanpassing loslaten op alle “$” tekens in het betreffende javascript. Dus simpelweg een Zoek-en-vervang van $ door jQuery.