Search
Last updated
Last updated
The template can dynamically (when a visitor comes to your site) filter items on a page based on a search.
A visitor types in a search box component (see below).
A visitor clicks on a link with e.g. ?search=some search
in the URL, like a tag or a team member page research link (see aliases
).
By default, the only items on the page that are filtered the card, citation, and post excerpt components.
You could customize this in /_scripts/search.js
to filter any kind of item that is selectable with a CSS selector, for example p
for paragraph elements.
You can search for terms, phrases, and tags:
term1 term2 "full phrase 1" "full phrase 2" "tag: some-tag" "tag: another-tag"
.
Items that contain all of the terms, at least one of the phrases, and at least one of the tags will be considered a match. Matching is case insensitive. Tags are also insensitive to hyphens, e.g. open science
is considered the same as open-science
.
Search words will be highlighted in the results (if they're longer than 2 characters). In addition to the visible text content of the item, tooltip and other content are also searched (via the data-tooltip
and data-search
attributes).
You can put a search box component on the page to let visitors type in their own search:
This also updates the URL so they can conveniently link to that page with that search.
To show info about what items are being filtered, e.g. Showing 12 of 60, you can put a search info component on a page:
Only visible if something is being searched.