How to Use Lunr.js for Searching in a Jekyll Blog
I have been using Google Programmable Search Engine on my blog, but I found that it doesn’t work quite as I expected. First, I tried Bing and DuckDuckGo as alternatives, but none of them performed as desired. DuckDuckGo’s API is nice, but it lacks a ‘site:’ filter, which prevented it from working as needed.
Here are the steps to set up a Jekyll search system using Lunr.js for GitHub Pages(github.io):
- Create
js/search.js
and add this code - Add search.md to the root of your project.
- Add an HTML form where you like
<li class="nav-item my-auto">
<div class="header-search">
<form class="header-search-form" action="/search.html" method="get">
<input type="text" id="search-box" name="query">
<input type="submit" value="search">
</form>
</div>
</li>
Check here for example.
If you have a page listing elsewhere and would like to remove it, refer to this conditional statement.