1.文章搜索功能

方案一 fusejs、markjs 参考链接:https://zhuanlan.zhihu.com/p/569677497

方案二(本网站使用) algolia 使用hugo 命令后,public文件夹下生成index.json文件 参考链接https://ieblyang.github.io/hugo-algolia/#4-%E7%94%9F%E6%88%90%E7%B4%A2%E5%BC%95%E6%96%87%E4%BB%B6

2.字数浏览量统计

方案一 不蒜子 themes\Sakura\layouts\partials\footer.html 引入

方案二 waline自带的统计功能

3.首页

3.1导航栏

themes\Sakura\layouts_default\baseof.html 中引入 themes\Sakura\layouts\partials\header.html 中定义

3.2首页文章列表 分页功能

themes\Sakura\layouts\index.html 使用hugo提供的分页器实现

3.3 首页文章卡片

文章卡片用于首页展示最新文章样式 themes\Sakura\layouts\partials\widgets\post\post-card.html

首页中文章卡片和网站首页底部的评论数和阅读数都是首页上引入id=waline的 waline功能实现的

4.文章样式

themes\Sakura\layouts\posts\single.html 文章统计信息 字数 hugo自带、评论数 waline功能、访问次数 不蒜子实现、阅读时间 hugo自带

5.目录、标签 分类样式

6.评论功能

单个文章themes\Sakura\layouts\posts\single.html 评论模块themes\Sakura\layouts\partials\comment.html waline 辅助提供文章浏览数和文章评论数功能 我自己的waline评论部署到vercel上了

7.footer页脚部分

themes\Sakura\layouts\partials\footer.html

7.1 网站统计信息

文章数 hugo提供变量 访问总次数 访客总人数

7.2网站介绍信息

7.3备案号

7.4加载脚本

8.文章归档页面 /archives

主要功能:文章发布历史归档页面 匹配模板样式关系: content\archives\index.md 表示新页面,md文件前置元数据参数layout指archives优先匹配themes\Sakura\layouts_default\archives.html 参考:
匹配规则见官方文档https://gohugo.io/templates/lookup-order/ themes\Sakura\layouts_default\archives.html页面样式内容介绍

按照文章创建时间遍历网站所有文章https://gohugo.io/variables/pages/

.Date支持方法https://gohugo.io/methods/time/ {{ $post.Date | time.Format “:time_medium”}} //返回日期 11:44:58 pm

参考https://gohugo.io/functions/time/format/

9.回忆录

10.友链

11. 主题切换按钮

位置 themes\Sakura\layouts_default\baseof.html 可以参考这篇文章,这个是hexo的但hugo也一样 Sakura主题添加背景切换功能


Be Water, My Friend.