Dynamic search page using Jets
I've added a search.html page, which is auto-generated by the rebuild command, so users can search the website and its posts more easily. The results are presented in a nice list, just like a normal search engine results page.
This is how it works:
- if no query string, nothing to search, show the search input
- after user submits a search, set a query string of the search terms
- refresh page, detect new query string
- use Jets to show only the posts in the page matching the search term(s)
The problem with this approach is that it's very dumb.
All posts are listed in the HTML of the page, but hidden - so on any site with very large amounts of content, the initial load times of the search page might be quite slow.
Once the search.html page has loaded however, all subsequent search are nice and fast, as all the HTML (containing any potential search results) is loaded and cached already.
It's also dumb as it's not really a proper query based search, although Jets allows various search settings, see the searchSelector options at the Jets homepage.
However, many static sites don't have any built-in search, any many others require extra plugins to get it working, so the fact that mdsh now has a (fairly) nice built-in search feature is quite cool.