This guide shows how to integrate the Hugo Docsy theme with the search module.
Requirements
- A Docsy site which install Docsy with Hugo modules.
- Hugo Module, see also how to use Hugo modules.
- Search module
>= v0.2.0
.
Prepare Your Site
In this guide, we take the Docsy example site as an example.
1git clone --depth 1 https://github.com/google/docsy-example.git docsy
2cd docsy
Install Missing Dependencies
The search module uses RTLCSS to generate styles for RTL sites.
1npm i -D rtlcss
Import Module
hugo.yaml
1module:
2 imports:
3 - disable: false
4 path: github.com/hugomods/search
5 - disable: false
6 path: github.com/google/docsy
7 - disable: false
8 path: github.com/google/docsy/dependencies
hugo.toml
1[module]
2 [[module.imports]]
3 disable = false
4 path = 'github.com/hugomods/search'
5 [[module.imports]]
6 disable = false
7 path = 'github.com/google/docsy'
8 [[module.imports]]
9 disable = false
10 path = 'github.com/google/docsy/dependencies'
hugo.json
1{
2 "module": {
3 "imports": [
4 {
5 "disable": false,
6 "path": "github.com/hugomods/search"
7 },
8 {
9 "disable": false,
10 "path": "github.com/google/docsy"
11 },
12 {
13 "disable": false,
14 "path": "github.com/google/docsy/dependencies"
15 }
16 ]
17 }
18}
Import CSS
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-go-html-template" data-lang="go-html-template"><span class="line"><span class="ln">1</span><span class="cl"><span class="cp">{{</span><span class="w"> </span><span class="nx">partialCached</span><span class="w"> </span><span class="s">"search/assets/css"</span><span class="w"> </span><span class="na">.</span><span class="w"> </span><span class="cp">}}</span>