按 Enter 键跳转到正文

安装与配置指南

安装

把主题放入 Hugo 站点的 themes/ 目录,然后在 config.toml 声明:

1theme = "period"

配置从模板开始最省事:把 config.toml.example 复制为 config.toml 再改。

核心参数速查

 1[params]
 2  tagline       = "记录设计、代码与生活的个人博客。"  # 页眉标语
 3  description   = "站点描述"                          # 首页 meta/OG/JSON-LD
 4  author        = "Leanku"                            # 默认作者(front matter 可覆盖)
 5  dateFormat    = "2006年1月2日"                      # Go 时间布局
 6  layout        = "right"      # right | left —— 侧边栏位置
 7  fullPost      = false        # true = 列表页显示全文而非摘要
 8  excerptLength = 40           # 自动摘要字数(无 description 时生效)
 9  readMoreText  = "阅读更多"    # 摘要按钮文字
10  displayAuthor = true         # 署名显示作者
11  displayDate   = true         # 署名显示日期
12  lastUpdated   = true         # 显示"最后更新于"
13  scrollToTop   = true         # 返回顶部按钮
14  logo          = ""           # logo 路径(static/ 下);留空用文字标题
15  logoSize      = 168          # logo 宽度 px
16  searchBar     = true         # 页眉搜索按钮
17  footerText    = "版权说明"    # 页脚 credit 条
18  googleFonts   = true         # 加载 Google Fonts(false = 离线系统字体)
19  fontFamily    = "Roboto:300,300italic,400,700"
20  fontSubsets   = "latin,latin-ext"

侧栏组件

1[params.sidebar]
2  recentPosts = 5       # 最近文章;0 = 不显示
3  categories  = true    # 分类列表(带计数)
4  tags        = true    # 标签云
5  archives    = true    # 按月归档(链接到 /archives/#2025-01)
6  [params.sidebar.about]      # 关于组件(参考 laruence.com 紧凑样式)
7    name  = "Leanku"          # 加粗名字
8    image = "images/avatar.jpg"   # 81×50 小头像(object-fit: cover)
9    text  = "简介,支持 Markdown 链接"

导航菜单(含嵌套)

 1[menu]
 2  [[menu.main]]
 3    name       = "主页"
 4    url        = "/"
 5    weight     = 1
 6    identifier = "home"
 7  # 嵌套子菜单:用 parent 指向父项 name
 8  [[menu.main]]
 9    name   = "专题"
10    weight = 8
11  [[menu.main]]
12    name   = "AI"
13    url    = "/post/ai/"
14    parent = "专题"
  • weight 决定顺序;identifierrss 时菜单自动加 fa-rss 图标;
  • 当前页自动高亮(current-menu-item + aria-current="page"),以菜单 url 与页面地址精确匹配为准。

⚠️ TOML 陷阱(必读)

TOML 中一旦出现子表表头,其后的所有键都归属该子表,直到下一个表头:

 1# ✅ 正确:顶层标量在前,子表在后
 2[params]
 3  layout = "right"
 4  [params.social]
 5    rss = "/index.xml"
 6
 7# ❌ 错误:layout 会被解析成 params.social.layout
 8[params]
 9  [params.social]
10    rss = "/index.xml"
11  layout = "right"

同理,[params.seo] 子表内的 [params.seo.verification] 之后的键也须写在它之前。 config.toml.example 已按正确顺序排列,新增键时请遵守。

评论 / 搜索 / 表单开关

 1[params.comments]          # provider = "none" 时零脚本加载
 2  provider = "giscus"      # none | giscus | utterances
 3  repo     = "yourname/your-repo"
 4  repoId   = "R_kgDOxxxxxxx"
 5  category = "Announcements"
 6  categoryId = "DIC_kwDOxxxxxxx"
 7  theme    = "light"       # 勿用 preferred_color_scheme(SSR 下加载不存在的主题文件)
 8
 9[params.search]            # 构建后需运行 npx pagefind --site public
10  provider    = "pagefind" # none | pagefind
11  placeholder = "搜索…"
12
13[params.contactForm]       # 配合 


姓名: 联系表单未启用。请在 config.toml 中设置 params.contactForm.providerendpoint(详见 README)。

短代码
14 provider = "none" # none | formspree | netlify 15 endpoint = "" # formspree: https://formspree.io/f/xxxx

常见问题

现象原因与解决
改配置不生效hugo server 需重启才重载 [permalinks]/[markup] 等配置
菜单不高亮菜单 url 与页面地址不完全一致(大小写、结尾斜杠)
搜索无结果忘记运行 npx pagefind --site public,或 baseURL 与部署域名不一致
评论报 “not installed”giscus App 未安装到该仓库 / 仓库非公开 / Discussions 未开启

发表评论