45 lines
2.4 KiB
Markdown
45 lines
2.4 KiB
Markdown
|
# Instructions for Installing and Running PageFind
|
||
|
|
|
||
|
|
## Install `nvm` and `npx`
|
||
|
|
There are a few ways to install PageFind. I used the `npx` method, but you can check out other ways from their [website](https://pagefind.app/docs/installation/). Below is the `npx` method.
|
||
|
|
1. Install `nvm` from the [git repo](https://github.com/nvm-sh/nvm?tab=readme-ov-file#installing-and-updating) using the `Install and Update Script`.
|
||
|
|
- `curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.3/install.sh | bash`
|
||
|
|
- `nvm install --lts`
|
||
|
|
2. Install `npm`
|
||
|
|
- `sudo apt install npm`
|
||
|
|
3. Verify Installations
|
||
|
|
- `which npx` should print out the path to the `npx` binary.
|
||
|
|
- `npx --version` should give you the version that was installed.
|
||
|
|
|
||
|
|
|
||
|
|
## Include PageFind Script into Website
|
||
|
|
1. In the `config.toml` file of the root of the `libertytools.io` project, set the following:
|
||
|
|
- `BookSearch = true`
|
||
|
|
2. `cd libertytoolsio/themes/hugo-book/layouts/_partials/docs`
|
||
|
|
3. Make a backup of `search.html`:
|
||
|
|
- `cp search.html search.html.bkup`
|
||
|
|
4. Open `search.html` and delete the contents. Replace the contents with the following script from the [pagefind website](https://pagefind.app/docs/):
|
||
|
|
```
|
||
|
|
<link href="/pagefind/pagefind-ui.css" rel="stylesheet">
|
||
|
|
<script src="/pagefind/pagefind-ui.js"></script>
|
||
|
|
<div id="search"></div>
|
||
|
|
<script>
|
||
|
|
window.addEventListener('DOMContentLoaded', (event) => {
|
||
|
|
new PagefindUI({ element: "#search", showSubResults: true });
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
```
|
||
|
|
|
||
|
|
## Index the Website
|
||
|
|
Once the pagefind script has been copied into the `libertytoolsio/themes/hugo-book/layouts/_partials/docs/search.html`, the search bar should persist across all pages created. To index the website for pagefind we first have to build the site using `hugo`, then we will have to index the contents of the site using the `npx` wrapper.
|
||
|
|
1. Build the site:
|
||
|
|
- From the project root (i.e. `libertytoolsio/`),
|
||
|
|
- `hugo serve`
|
||
|
|
2. Building the site will publish the html and shit to the `public/` directory. We now have to index and rebuild the site in order for pagefind to persist:
|
||
|
|
- From the project root, `npx -y pagefind --site public --serve`
|
||
|
|
- If all goes well, you should see something like `Serving "public" at http://localhost:1414` at the bottom of the output. Paste the address `http://localhost:1414` into a browser. You should now see the search bar in the upper left, and it should be available on all pages.
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|