LiveSearch hack for WordPress

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).

6 Comments & TrackBacks ()

Paper doll icon
Switch's Gravatar

Binary Bonsai has this LiveSearch function now for quite a time :) It’s really cool, and makes searching something really easy.

Posted by: Switch on October 24, 2004 12am

Paper doll icon
fernando's Gravatar

forgive me, but i can’t determine where to add that last piece of code you offered.

would you mind pointing me in the right direction?

Posted by: fernando on December 18, 2004 8pm

Paper doll icon
fernando's Gravatar

Ahhh…

ok i realized that this was included in your livesearch.php example.

so it is installed, however i am having some difficulty with line 2:

include ‘db-config.php’;

this causes errors in WP1.3

can you help?

Posted by: fernando on December 18, 2004 9pm

Paper doll icon
fernando's Gravatar

hey!

nevermind. i actually began to look at the files and see that the db-config is the wp-config, and therein were the answers to what needed to be changed in that file to match the db and the livesearch.php.

wonderful!

thanks for this page.

Posted by: fernando on December 18, 2004 9pm

Paper doll icon
Jax's Gravatar

How do you make this work in WP 1.5?

Posted by: Jax on January 21, 2005 1pm

Paper doll icon
Julien's Gravatar

I’m a php newbie , and think to implement the livesearch to my
website , but I couldn’t figure out how to do the “get_permalink”
function, any help would be appreciated , thanks

Julien(julienmassillia@gmail.com)

Posted by: Julien on August 21, 2005 12am

You can subscribe to the RSS feed for comments on this post.

Sorry, this entry is no longer accepting comments. If you have something you really want to say, you can write me.