Dane. Designer.

Old Blog

Livesearch

Using ancient formulas, the scales of a dragon, spit of a toad and a single hair from the head of Margaret Thatcher – yeah, not really – I have succeeded in concocting a search-as-you-type. For all you Mac-whores out there, it’s sort of like Quicksilver / Spotlight ‘lite’.

Try it out. Type for instance ‘kubrick’ into the search form, and wait a second. There, a list should roll down and show you the last 20 entries with the word Kubrick in them. Now use arrow up and down to navigate and enter to select an entry.

Ehm… Now press the back button… Hello?... Come back!

So anyway. How cool is that? Pretty damn cool I’d say! It’s still sort of a proof of concept, but I’ve got a few ideas on how to implement it in other ways as well.

Now, it is worth noting that it doesn’t work on all browser (Opera and OmniWeb, I’m looking at you two!), but it should work on IE, Mozilla and Safari variants, so that covers 99.9% of the market. And for you guys on Opera and Omniweb, don’t fret, you (and everyone else) can still use the search form in the old fashioned way. Just press enter and it’ll take you to the normal search page.

How do you get this on your own WordPress 1.2 site? Easy peasy.

Download livesearch.php. Now open wp-blog-header.php and go to line 527, where it says ‘if ($s && empty($paged)) { // If they were doing a search and got one result‘. Uncomment that section of code (or download my copy). This is to prevent WordPress from automatically forwarding the user to a permalink, if it is the only result returned on a search.

Update: Now make a few changes to livesearch.js.

Once you’ve done that, just follow the instructions, and you should be fine. Feel free to ask questions in this entry. However since this isn’t my code (I just supply the missing link between WordPress and Livesearch, I suggest that you don’t start doing this unless you have a little understanding of PHP and such.

I’ll see if I can’t put together a small Livesearch for WordPress 1.2 package at some point soon.

PS: No, it doesn’t have Reversi...

Update: After having spent way too long time plugging in a new search algorithm, it turned out to be broken in various annoying ways. Annoying, seeing as how the standard search is pretty tame all in all. If you know of a good WordPress search hack, let me know.

Now I’m off to a company party.

Update: I think it’s worth noting, since there seems to be some confusion on this matter (though I can’t quite understand how, since all the livesearch code is found on a site that is distinctly not mine), that I wrote the livesearch javascript code. Which I of course didn’t. These guys did. As it says on the Wiki.

What I should have mentioned, when I implemented it, was that some of the code and the alternating color selection currently powering my livesearch, is in fact Garrett Murray’s work. My apologies to Garrett for not pointing this out earlier. A testament to how I should make sure to get the credits right before I forget about it! (And to think this is the second time I do this in one and a half year... I’m still sorry Alex).

Related
How to make Livesearch validate