A MkDocs plugin to make the native "search" plugin work locally (file:// protocol).
This plugin only works with the Material for MkDocs theme. If you need support for other themes, feel free to create a pull request.
If you are using Material v9 or later, this plugin is not necessary. Use the inbuilt offline plugin instead.
⚠️ Plugin not working anymore? On Nov 3, 2022, the URL given in steps 5 and 6 below changed from "iframe-worker/polyfill" to "iframe-worker/shim". Updatetheme/main.htmlif necessary.
To use the plugin with Material v7 or v8 projects:
- Install the plugin using pip:
pip install mkdocs-localsearch - Activate the plugin in
mkdocs.yml, in addition to thesearchplugin:plugins: - search - localsearch
- Make sure that
use_directory_urlsis set tofalseinmkdocs.yml. - Add a
custom_direntry to thethemesection inmkdocs.yml:theme: name: material custom_dir: theme
- Create a new file, save it in your project dir as
theme/main.html, and add the following content:Note: Don't use the{% extends "base.html" %} {% block config %} {{ super() }} {% if "localsearch" in config["plugins"] %} <script src="https://unpkg.com/iframe-worker/shim"></script> <script src="{{ 'search/search_index.js' | url }}"></script> {% endif %} {% endblock %}extra_javascriptoption inmkdocs.ymlto add the two scripts above. Scripts referenced viaextra_javascriptare placed at the bottom of the HTML page, i.e., after the search implementation, which is too late. - If your documentation should work offline, i.e., without internet access:
- Open this file and save it as
iframe-worker.jsin yourdocs_dir.
Example path:docs/assets/javascripts/iframe-worker.js - Edit
theme/main.htmland change the following line:to this:<script src="https://unpkg.com/iframe-worker/shim"></script>
<script src="{{ 'assets/javascripts/iframe-worker.js' | url }}"></script>
- Open this file and save it as
To use the plugin with Material v5 or v6 projects:
- Install version 0.7.0 of the plugin using pip:
pip install mkdocs-localsearch==0.7.0 - Activate the plugin in
mkdocs.yml, in addition to thesearchplugin:plugins: - search - localsearch
- Make sure that
use_directory_urlsis set tofalseinmkdocs.yml. - Add a
custom_direntry to thethemesection inmkdocs.yml:theme: name: material custom_dir: theme
- Create a new file, save it in your project dir as
theme/main.html, and add the following content:Note: Don't use the{% extends "base.html" %} {% block config %} {% if "localsearch" in config["plugins"] %} <script src="https://unpkg.com/iframe-worker/shim"></script> <script src="{{ 'search/search_index.js' | url }}"></script> {% endif %} {% endblock %}extra_javascriptoption inmkdocs.ymlto add the two scripts above. Scripts referenced viaextra_javascriptare placed at the bottom of the HTML page, i.e., after the search implementation, which is too late. - If your documentation should work offline, i.e., without internet access:
- Open this file and save it as
iframe-worker.jsin yourdocs_dir.
Example path:docs/assets/javascripts/iframe-worker.js - Edit
theme/main.htmland change the following line:to this:<script src="https://unpkg.com/iframe-worker/shim"></script>
<script src="{{ 'assets/javascripts/iframe-worker.js' | url }}"></script>
- Open this file and save it as
- If your project has a large search index (several MBytes), add the
promise_delaysetting:A delay of 100 ms worked with a search index of 24 MB (prebuilt index).plugins: - search - localsearch: promise_delay: 100
Note that thepromise_delaysetting has a negative effect on performance (loading time will be increased).
To use the plugin with Material v4 projects:
- Install version 0.5.0 of the plugin using pip:
pip install mkdocs-localsearch==0.5.0 - Activate the plugin in
mkdocs.yml:plugins: - localsearch
- Add
search_index.jsto theextra_javascriptsection inmkdocs.yml:extra_javascript: - search/search_index.js
- Add a
custom_direntry to thethemesection inmkdocs.yml:theme: name: material custom_dir: theme
- Open this file and save it in your project dir as
theme/partials/header.html. - Edit
theme/partials/header.htmland change the following line:
{% if "search" in config["plugins"] %}
to this:
{% if "localsearch" in config["plugins"] %}