Another way to search

In the same vein as the original search post with lunr, I’ve implemented search on my blog. However, a key difference: the generation of the lunr index is taken care of in a Hugo template instead of a grunt task. This means three things:

  1. you don’t have to install node, if you don’t want to.
  2. you don’t have to run a separate process to generate the index. This means it works with livereload!
  3. there’s no extra HTTP request to get the search index on the search page.

here’s the diff, but essentially what I did:

What do y’all think about this approach? (and PS please let me know if it doesn’t work for you: here’s the rendered page live)

10 Likes

Possibly stupid question - so this works all directly within hugo, so if I’m hosting on github pages, this should all work like magic?

Not a stupid question at all, I don’t think. Yes, it works with GH
pages. In fact, that’s where the sample blog I posted lives. Check out
the .travis.yml for how it gets built automatically. :slight_smile:

1 Like

Brian, this is awesome! I have a question, does it render search suggestions in real time or do you have to press enter to get the results?

Happy to see someone did this as when I read that original post, my first thought was ‘couldn’t that be done in Hugo?’ but I hadn’t tried it.

@samrich rendering search suggestions in real time would be about the script performing the search, not down to the method used to create the index. So in this case just depends what lunr does (not used it yet myself)

Sorry for the late reply here, thanks @mikeaja!

I am interested in a nice on-site search as well. Checked out your page, however, the search does not work for me. If I type something and press enter, nothing happens at all. Am I stupid? :hushed:

The input field above the results is doing nothing, but look at the menu and you see ‘spacemacs’. It’s a field with the keyword. Change it and the page will show new results via ajax.

1 Like

Cool. It’s amazing. I will try to get more into that, maybe I can implement the same to my page :slight_smile: Thx for your help!