搜索
目录
- 在配置中启用搜索
- Hiding pages from search
- Generate search index when used as a gem
- Custom content for search index
Just the Docs 使用 lunr.js 添加由 Jekyll 生成的 JSON 索引支持的客户端搜索界面。 所有搜索结果都显示在自动完成样式的界面中(没有搜索结果页面)。 默认情况下,所有生成的 HTML 页面都使用以下数据点进行索引:
- 页面标题
- 页面内容
- 页面 URL
在配置中启用搜索
在恁网站的 _config.yml
中,启用搜索:
# Enable or disable the site search
# Supports true (default) or false
search_enabled: true
Search granularity
Pages are split into sections that can be searched individually. The sections are defined by the headings on the page. Each section is displayed in a separate search result.
# Split pages into sections that can be searched individually
# Supports 1 - 6, default: 2
search.heading_level: 2
Search previews
A search result can contain previews that show where the search words are found in the specific section.
# Maximum amount of previews per search result
# Default: 3
search.previews: 3
# Maximum amount of words to display before a matched word in the preview
# Default: 5
search.preview_words_before: 5
# Maximum amount of words to display after a matched word in the preview
# Default: 10
search.preview_words_after: 10
Search tokenizer
The default is for hyphens to separate tokens in search terms: gem-based
is equivalent to gem based
, matching either word. To allow search for hyphenated words:
# Set the search token separator
# Default: /[\s\-/]+/
# Example: enable support for hyphenated search words
search.tokenizer_separator: /[\s/]+/
Display URL in search results
# Display the relative url in search results
# Supports true (default) or false
search.rel_url: false
Display search button
The search button displays in the bottom right corner of the screen and triggers the search input when clicked.
# Enable or disable the search button that appears in the bottom right corner of every page
# Supports true or false (default)
search.button: true
Focus search bar with a keyboard shortcut
Just the Docs supports focusing the search bar input with a keyboard shortcut. After setting the search.focus_shortcut_key
config item key, users who press Ctrl + search.focus_shortcut_key
(or on macOS, Command + search.focus_shortcut_key
) will focus the search bar.
Note that this feature is disabled by default. search.focus_shortcut_key
should be a valid value from KeyboardEvent.key
; this involves all ASCII alphanumeric values, as well as modifier keys.
For example,
search:
focus_shortcut_key: 'k'
Will make Ctrl + K focus the search bar for Windows users (and Command + K on macOS).
Hiding pages from search
Sometimes you might have a page that you don’t want to be indexed for the search nor to show up in search results, e.g., a 404 page. To exclude a page from search, add the search_exclude: true
parameter to the page’s YAML front matter:
---
layout: default
title: Page not found
nav_exclude: true
search_exclude: true
---
Generate search index when used as a gem
If you use Just the Docs as a remote theme, you do not need the following steps.
If you use the theme as a gem, you must initialize the search by running this rake
command that comes with just-the-docs
:
$ bundle exec just-the-docs rake search:init
This command creates the assets/js/zzzz-search-data.json
file that Jekyll uses to create your search index. Alternatively, you can create the file manually with this content.
Custom content for search index
New (v0.4.0)
Advanced
By default, the search feature indexes a page’s .content
, .title
, and some headers within the .content
. Other data (e.g. front matter, files in _data
and assets
) is not indexed. Users can customize what is indexed.
Customizing search indices is an advanced feature that requires Javascript and Liquid knowledge.
- When Just the Docs is a local or gem theme, ensure
assets/js/zzzz-search-data.json
is up-to-date with Generate search index when used as a gem. - Add a new file named
_includes/lunr/custom-data.json
. Insert custom Liquid code that reads your data (e.g. the page object atinclude.page
) then generates custom Javascript fields that hold the custom data you want to index. Verify these fields in the generatedassets/js/search-data.json
. - Add a new file named
_includes/lunr/custom-index.js
. Insert custom Javascript code that reads your custom Javascript fields and inserts them into the search index. You may want to inspectassets/js/just-the-docs.js
to better understand the code.
Example: adding custom usage
and examples
fields
This example adds front matter usage
and examples
fields to the search index.
_includes/lunr/custom-data.json
custom code reads the page usage
and examples
fields, normalizes the text, and writes the text to custom Javascript myusage
and myexamples
fields. Javascript fields are similar yet not the same as JSON. jsonify
will probably work for most scenarios.
{%- capture newline %}
{% endcapture -%}
"myusage": {{ include.page.usage | markdownify | replace:newline,' ' | strip_html | normalize_whitespace | strip | jsonify }},
"myexamples": {{ include.page.examples | markdownify | replace:newline,' ' | strip_html | normalize_whitespace | strip | jsonify }},
_includes/lunr/custom-index.js
custom code is inserted into the Javascript loop of assets/js/just-the-docs.js
. All custom Javascript fields are accessed as fields of docs[i]
such as docs[i].myusage
. Finally, append your custom fields on to the already existing docs[i].content
.
const content_to_merge = [docs[i].content, docs[i].myusage, docs[i].myexamples];
docs[i].content = content_to_merge.join(' ');