This theme supports Giscus - a comments system powered by GitHub Discussions. This guide will help you set up comments for your Hugo site.
Prerequisites
Before configuring Giscus, ensure you have:
- A public GitHub repository
- The Giscus app installed on your repository
- GitHub Discussions enabled in your repository settings
Use Discus
Step 1: Enable GitHub Discussions
- Go to your GitHub repository
- Navigate to Settings → Features
- Check the Discussions checkbox
Step 2: Install Giscus App
- Visit github.com/apps/giscus
- Click Install
- Select the repository where you want to enable comments
Step 3: Get Your Giscus Configuration
- Go to giscus.app
- Fill in your repository details in the configuration form
- Choose your preferred settings
- Copy the generated values from the script tag
Open your config/params.toml file and update the [giscus] section:
TOML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
| [giscus]
enable = true # Set to true to enable comments
src = "https://giscus.app/client.js"
# Repository settings (from giscus.app)
dataRepo = "yourusername/repo-name" # Your GitHub username/repository
dataRepoId = "R_kgDOQHNo3Q" # Copy from giscus.app
# Discussion category settings
dataCategory = "Announcements" # Choose a category
dataCategoryId = "DIC_kwDOQHNo3c4CxQcB" # Copy from giscus.app
# Mapping and behavior
dataMapping = "pathname" # How to map pages to discussions
dataStrict = "0" # 0 = create discussion if not found
dataReactionsEnabled = "1" # Enable reactions (1 = yes, 0 = no)
dataEmitMetadata = "0" # Emit discussion metadata
dataInputPosition = "bottom" # Comment box position (top/bottom)
# Appearance
dataTheme = "preferred_color_scheme" # Theme (see options below)
dataLang = "en" # Language code
# Loading
dataLoading = "lazy" # Lazy load comments
crossorigin = "anonymous" # CORS setting
|
Example Configuration
Here’s a complete working example:
TOML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
| [giscus]
enable = true
src = "https://giscus.app/client.js"
dataRepo = "johndoe/my-blog"
dataRepoId = "R_kgDOH1234A"
dataCategory = "Blog Comments"
dataCategoryId = "DIC_kwDOH1234c4CaBcD"
dataMapping = "pathname"
dataStrict = "0"
dataReactionsEnabled = "1"
dataEmitMetadata = "0"
dataInputPosition = "bottom"
dataTheme = "preferred_color_scheme"
dataLang = "en"
dataLoading = "lazy"
crossorigin = "anonymous"
|
To disable comments on individual pages, add this to the page’s front matter:
YAML
1
2
3
4
| ---
title: "My Page"
comments: false # Disable comments for this page
---
|
Or in TOML format:
TOML
1
2
3
4
| +++
title = "My Page"
comments = false
+++
|