I found this old link on LiveSearch that I'd wanted to implement here but never got around to doing so until now. It's really quite a bit of a hack right now, with most of the code coming from the LiveSearch page on the Bitflux Blog wiki and with direct calls to PHP's MySQL functions to get it to work with WordPress.

Instead of replacing the default WordPress search box, I decided to add another one instead (that you can see right now on the left just below the "standard" search box) and label it a "LiveSearch" box. I do this because livesearch.js seems to crash Firefox randomly on occasion (as mentioned on Bitflux blog). Besides, it's hardly fully done, as it currently only does simple SQL LIKE matching on post titles, and the CSS is somewhat inelegant.

Anyway, what I did was to add livesearch.js to the WordPress index template, and added the LiveSearch form.

<form id="livesearchform" method="get" action="http://blog.codefront.net/livesearch.php">
<input autocomplete="off" id="livesearch" name="q" onkeypress="liveSearchStart()" type="text" />
<input id="submitted" name="submitted" value="yes" type="hidden" />
<div id="LSResult" style="display: none;"><div id="LSShadow"></div></div>
</form>

Next, I hacked out a livesearch.php script (source listing for livesearch.php) that performs the relevant query on WordPress' wp_posts table (may be differently named on your installation) and returns an XML document containing the matching post titles and their URLs. The tricky part was to map the matching post titles to their URLs (since I'm using SEO-friendly permalinks). All it took was to include the wp-blog-header.php file and have the get_permalink(ID) function return the correct URL.

The other tricky part involved preventing searches in the LiveSearch box from going to the livesearch.php page, because that'd return an XML page that the user would hardly know how to proceed from. Adding a hidden form field was a quick hack, but it works just fine and redirects the user to the search results page that WordPress spews.

// If the LiveSearch form was actually submitted (as opposed to being requested
// via a XMLHttpRequest, we redirect to the standard WP search page.
if( isset($_GET['submitted']) && $_GET['submitted'] == 'yes' ) {
header('Location: ' . get_settings('siteurl') . '/?s=' . $_GET['q']);
exit;
}

Well, that's it for now. It feels really like a hackjob but it works just fine. Perhaps someone could roll this up into a WordPress plugin or we could get LiveSearch as a feature in WordPress in future (as Serendipity already does).