Mkdocs Material 添加Gitalk评论系统

申请clientID 和clientSecret

添加替换模板

参见：

在项目根目录下创建 overrides/main.html

目录结构如图

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23


{% extends "base.html" %}

{% block content %}
  {{ super() }}
<h2 id="__comments">{{ lang.t("meta.comments") }}</h2>
  <link rel="stylesheet" href="https://unpkg.com/gitalk/dist/gitalk.css">
  <script src="https://unpkg.com/gitalk/dist/gitalk.min.js"></script>
  <div id="gitalk-container"></div>

  <script>
const gitalk = new Gitalk({
  clientID: 'GitHub Application Client ID',
  clientSecret: 'GitHub Application Client Secret',
  repo: 'GitHub repo',      // The repository of store comments,
  owner: 'GitHub repo owner',
  admin: ['GitHub repo owner and collaborators, only these guys can initialize github issues'],
  id: location.pathname,      // Ensure uniqueness and length less than 50
  distractionFreeMode: false  // Facebook-like distraction free mode
})

gitalk.render('gitalk-container')
  </script>
{% endblock %}

参见 Gitalk：

link_preview

在mkdocs.yml中修改：

1
2
3


theme:
  custom_dir: overrides
  name: material

完成！