Doc

Search

Search Sugam Pokharel

Sugo search uses Pagefind. The search opens as an overlay panel from the header button.

Enable Search UI

In your root hugo.toml:

TOML
1
2
[params.features]
enableSearch = true

If this is set to false, the search button and the search overlay are not rendered. More information can be found here.

Build Scripts (Pagefind)

Search index is generated by Pagefind from the built public folder. In this repo, scripts are in mysite/package.json:

JSON
1
2
3
4
5
6
7
8
{
  "scripts": {
    "dev": "hugo server --disableFastRender",
    "build:hugo": "hugo --gc --minify",
    "build:search": "npx -y pagefind --site public --output-path public/pagefind",
    "build": "hugo --gc --minify && npx -y pagefind --site public --output-path public/pagefind"
  }
}

A small but important point: npm run dev only starts Hugo server. It does not generate Pagefind index.

Local Workflow

For local testing with working search:

BASH
1
2
3
npm install
npm run build
npm run dev

If you change content and want updated search results, run build again:

BASH
1
2
3
4
npm run build
# or
npm run build:hugo
npm run build:search

Once you have build the search indexes, you can also just use the normal hugo server to get the hugo site running locally. All of this is, of course, for running locally. For how to manage the deployment, see here

Search Text and Labels

You can customize search text labels from [params.ui] in hugo.toml:

TOML
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
[params.ui]
searchToggleText = "Search"
searchToggleAriaLabel = "Open search"
searchDialogTitle = "Search"
searchCloseLabel = "Close search"
searchPlaceholder = "Search posts"
searchNoResultsText = "No results found"
searchEmptyPrompt = "Search by title, subtitle, tags, categories, authors, or body text."
searchLoadFailedText = "Search index is not available. Build with Pagefind first."
searchLoadingText = "Loading search..."
searchResultLabel = "result"
searchResultsLabel = "results"

What Gets Indexed

By default, Pagefind indexes page body text. In Sugo, extra metadata is also exposed for indexing from frontmatter:

  • title
  • subtitle
  • description
  • type
  • section
  • categories
  • tags
  • authors

So search can match title/subtitle/tags/categories/authors as well as normal content text.

If Search Is Not Working

  1. Check enableSearch = true in [params.features].
  2. Run npm run build so public/pagefind is generated.
  3. Deploy the public/pagefind folder along with the rest of public output.

Share this article

  • X
  • Facebook
  • LinkedIn
  • Reddit
  • WhatsApp
  • Telegram
  • Pinterest
  • Bluesky