Getting Started

This page assumes the use case of a static site, that is:

You have some HTML files you want to index.
These HTML files are served in a static file server, and are linkable to.
You have an <input> element for attaching a search dropdown.

For mobile devices

A fullscreen modal will show when the input element is focused.
This documentation uses an alternative user interface (try the search function!), which is covered later. To preview the defaults, head on over here.

Installing the indexer

There are a couple of options for installing the indexer:

Install the global npm package with npm install -g @infisearch/cli.
If you have the rust / cargo toolchains setup, run cargo install infisearch --vers 0.10.1.
You can also grab the cli binaries here.

Running the indexer

Run the executable as such, replacing <source-folder-path> with the relative or absolute folder path of your source html files, and <output-folder-path> with your desired index output folder.

infisearch <source-folder-path> <output-folder-path>

If you are using the binaries, replace infisearch with the appropriate executable name.

Other Cli Options

-c <config-file-path>: You may also change the config file location (relative to the source-folder-path) using the -c <config-file-path> option.
--preserve-output-folder: All existing contents in the output folder are removed before starting. Specify this option to avoid this.

Installing the search UI

Installation via CDN

<!-- Replace "v0.10.1" as appropriate -->

<!--  Search UI script -->
<script src="https://cdn.jsdelivr.net/gh/ang-zeyu/infisearch@v0.10.1/packages/search-ui/dist/search-ui.ascii.bundle.js"></script>
<!-- Search UI css, this provides some basic styling for the search dropdown, and can be omitted if desired -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/ang-zeyu/infisearch@v0.10.1/packages/search-ui/dist/search-ui-light.css" />

⚠️ Ensure the linked versions match the indexer version used exactly.

If you wish to host the files, you can find them in the <output-folder-path>/assets directory generated by the indexer. Using these guarantees that you will always being using the same indexer and search UI versions.

The folder contains:

A pair of language-specific files that should be served from the same folder:
- search-ui.*.bundle.js, the default is search-ui.ascii.bundle.js
- An accompanying WebAssembly binary
A stylesheet: search-ui-basic/light/dark.css

The same files are also in the release packages here, inside search.infi.zip.

UI Initialisation

Once you have loaded the bundles, simply call the infisearch.init function in your page.

This requires an input element with an id=infi-search to be present in the page by default. The id can be configured via uiOptions.input.

infisearch.init({
  searcherOptions: {
    // Output folder url specified as the second parameter in the cli command
    // Urls like '/output/' will work as well
    url: 'http://<your-domain>/output/',
  },
  uiOptions: {
    // Input / source folder url, specified as the first parameter in the cli command
    sourceFilesUrl: 'http://<your-domain>/source/',
    input: 'infi-search',
  }
});

InfiSearch Documentation