Integrated search for a static website Part 1

12 September 2011

This blog is six months old now and although the number of posts is still on the small side I thought it time to add a search function.

Since the blog is "baked" as static html, however, I knew I wouldn't be able to rely on <cfsearch critera="query" name="results"> and <cfoutput query="results">. In my mind I'd earmarked Google Site Search for the job but in fact that seems to require XML parsing capabilities and costs $100 for a limited number of queries per year.

Bing apparently offered a more attractive option, but Microsoft decided to withdraw it earlier this year.

Further research pointed to a highly promising new service by the name of Tapir. Aimed at static blogs just like mine, you give it your RSS feed (fiendishly clever idea) and it will index the contents and provide you with a key to its extremely simple Javascript API. They've even written a rudimentary jQuery plugin so you don't have to.

On receiving my key I excitedly whipped up an html test page to have a look at the JSON Tapir said it would return... but all I could see in Firebug were 500 internal server errors. I double-checked with their live demo page and that too was giving nothing back but 500s. A few hours later there was still no change.

The following day it was back up, but in the meantime I'd read up a little more on the Tapir back-end and learned that it is ultimately based on Lucene. My next thought was: hang on, I already have access to a Lucene-based search service — Solr via ColdFusion 9 — and, unlike Tapir, one that I can control if it goes down. Not only that but I wouldn't have to be constrained by RSS for the indexing: I can create and update the Solr collection directly from my blog generation app's database.

All I would need to do is set up a remote function similar to Tapir's, which returns JSON to the static HTML page, and then sprinkle some jQuery dust to retrieve that and turn it into nice looking dynamic results.

Assuming Javascript is enabled in your browser you should be able to try out what I came up with by using the search box in the top right of the screen.

In another post I'll go through how I got it working in more detail.

Comments

  • Formatting comments: See this list of formatting tags you can use in your comments.
  • Want to paste code? Enclose within <pre><code> tags for syntax higlighting and better formatting and if possible use script. If your code includes "self-closing" tags, such as <cfargument>, you must add an explicit closing tag, otherwise it is likely to be mangled by the Disqus parser.