After lamenting this morning that I didn't feel like figuring out how to add search to this blog, I've added search to this blog. Here's a short summary of what I did.

First, I used most of the UI and Fuse.js work from this post by Yihui Xie. (Thanks!)

To generate the index.json file, I created a page and new template in Tinderbox. The export inspector for the index generator looks like this:

Note the export file name and extension is set so that the output file is "index.json"

The parent template is simply a JSON array wrapper:

Each child is then rendered using the "search index item" template:

Note that that final if statement is necessary so that we don't end up with an extra comma after the last item which would make the JSON invalid. (This is one reason I don't like working with JSON. Can't it forgive me that last comma? You know what I meant!

Anyway, the search page loads fuse.js and includes some JavaScript to handle the search (also thanks to Yihui Xie, see his post for details.)

Rendering the index.json file is a little time consuming, so I'll do that manually every once in a while. This means the search won't always include everything but we can live with that.

The search results aren't pretty due to the raw HTML that is rendered, but it's good enough for now. I don't know why Tinderbox escapes everything multiple times when calling "jsonEncode()" but if you know why please let me know.

Try it and let me know if it works! Search