Knowledge Graph

Knowledge Graph is a relational graph between articles, providing a visual representation of backlink and taxonomy relationships. Yore supports Hugo Knowledge Graph, you only need to install it and enable the settings, no additional HTML/CSS configuration is required.

Installation & Configuration

Pick one of these methods to set up.

Git Submodule

git submodule add https://github.com/ZhenShuo2021/hugo-knowledge-graph themes/hugo-knowledge-graph

Configure hugo.yaml:

theme:
  - hugo-knowledge-graph
  - hugo-yore

outputs:
  home:
    - html
    - backlinks
    - knowledge-graph

params:
  pageKgStyle: bottom # bottom | sidebar

Hugo Module

Make sure your project already uses Hugo modules. If not, run hugo mod init NAME first.

Configure hugo.yaml:

module:
  imports:
    - path: github.com/ZhenShuo2021/hugo-knowledge-graph

outputs:
  home:
    - html
    - backlinks
    - knowledge-graph

params:
  pageKgStyle: bottom # bottom | sidebar

Differences from the Documentation

Yore already includes Hugo’s embedded link render hook, so you do not need to set useEmbedded = "always".

Usage

The pageKgStyle setting controls where the knowledge graph widget appears: bottom places it at the bottom of the page, while sidebar places it above the ToC.

Creating content/graph/_index.md will generate the full version of the knowledge graph, including legend filters and search functionality.

For detailed configuration, refer to the Hugo Knowledge Graph README.