---
title: 为网站添加评论系统
comments: true
tags:
- Mkdocs
---
官方文档：[Adding a comment system](https://squidfunk.github.io/mkdocs-material/setup/adding-a-comment-system/)
这里我同样推荐[giscus](https://giscus.app/zh-CN)
利用 GitHub Discussions 实现的评论系统，让访客借助 GitHub 在你的网站上留下评论和反应吧！本项目深受 utterances 的启发。
* 开源。🌏
* 无跟踪，无广告，永久免费。📡 🚫
* 无需数据库。所有数据均储存在 GitHub Discussions 中。:octocat:
* 支持自定义主题！🌗
* 支持多种语言。🌐
* 高可配置性。🔧
* 自动从 GitHub 拉取新评论与编辑。🔃
* 可自建服务！🤳
言归正传
## 第一步
mkdocs.yml中添加
```
theme:
name: material
custom_dir: docs/overrides #主要是这一行
```
参考下图新建overrides文件，在此文件下参考下图新建覆盖html文件
树状结构如下:
```
$ tree -a
.
├── .github
│ ├── .DS_Store
│ └── workflows
│ └── PublishMySite.yml
├── docs
│ └── index.md
│ └──overrides
│ └──assets
│ └──main.html
│ └──partials
│ └──comments.html
│
└── mkdocs.yml
```
在comments.html中
```html hl_lines="4-18"
{% if page.meta.comments %}
{% endif %}
```
## 第二步
打开 走完这个页面的流程就会得到(这会在你的Github创建新的仓库，建议自己先去新建个 Discussions)
```html
```
复制将此代码，替换最上面👆🏻comments.html中高亮的代码
终端里`mkdocs server`一下
## 最后
在你想插入评论的地方的元数据：`comments: true `
```
---
title: 留言板
hide:
# - navigation # 显示右
# - toc #显示左
# - footer
# - feedback
comments: true #默认不开启评论
---
```
## 效果
完美!快速相应
这是图片↑↑↑
## 其他评论系统
把想要内嵌的评论代码放在相应页面即可
比如[twikoo](https://twikoo.js.org/)
去看它的官方配置文档很简单就配置好了
```html
```
我感觉twikoo也好看！