hexo-discuss
v1.0.0-beta.0
Published
Discuss comment system for Hexo Plugin.
Downloads
5
Maintainers
lete114Readme
Install
npm install hexo-discuss --saveConfigure
将配置文件写入 Hexo 的配置文件_config.yml
# Discuss 评论系统
## https://discuss.js.org/
discuss:
enable: true # 是否启动评论系统
siblingEl: ".pagination-post" # 如果你没有适合‘el’挂载的 DOM 元素，你可以在这里创建一个
el: "#Discuss-Comments" # 评论挂载的 DOM 元素
serverURLs: # 评论服务端地址
location: # 注入的位置
page: # 注入哪些页面
## 加载的js版本,建议把@latest替换成指定版本如：@0.2.5
source: https://cdn.jsdelivr.net/npm/discuss@latest/dist/Discuss.js
## 更多配置: https://discuss.js.org/Quick-Start.html#%E5%AE%A2%E6%88%B7%E7%AB%AF-client
options:
# 举例
# options:
# path: location.pathname
# lang: en_USsiblingEl
假设你的 hexo 博客 html 基本结构是如下
<html>
<head>
<!-- ... -->
<title>xxx</title>
<!-- ... -->
</head>
<body>
<nav>
<!-- ... -->
</nav>
<main>
<article>
<div class="post-title"></div>
<div class="post-meta"></div>
<div class="post-content"></div>
<div class="post-copyright"></div>
<!-- 该标签可能不存在 <div class="post-comment"></div> -->
<!-- ... -->
</article>
</main>
<footer>
<!-- ... -->
</footer>
<body>
</html>如上 html 结构，你的网站没有<div class="post-comment"></div>可以存放评论的 DOM 元素怎么办？
我们提供了一个配置选项siblingEl，可以帮你自动生成一个用于存放评论的 DOM 元素
如果你的 hexo 主题已有预留给评论系统挂载的 DOM 元素，那么可以忽略该配置，留空即可
# _config.yml
# Discuss 评论系统
## https://discuss.js.org/
discuss:
enable: true
siblingEl: ".post-copyright" # 使用css的class选择器写法，选择某个 DOM 元素
el: "#Discuss-Comments" # 评论需要挂载的 DOM 元素 (可以是id选择器，也可以是class选择器)
# 为了易于理解，已将其它配置省略最后执行hexo g的到的 html 结构如下
会自动帮你创建一个 DOM 元素
<html>
<head>
<!-- ... -->
<title>xxx</title>
<!-- ... -->
</head>
<body>
<nav>
<!-- ... -->
</nav>
<main>
<article>
<div class="post-title"></div>
<div class="post-meta"></div>
<div class="post-content"></div>
<div class="post-copyright"></div>
<div id="Discuss-Comments"></div>
<!-- 该标签可能不存在 <div class="post-comment"></div> -->
<!-- ... -->
</article>
</main>
<footer>
<!-- ... -->
</footer>
<body>
</html>location
location选项可以让评论插入到网站的哪个位置
| 值 | 默认值 | 描述 |
| ---------- | ------ | --------------------- |
| head_begin | | 注入在 <head> 之后 |
| head_end | | 注入在 </head> 之前 |
| body_begin | | 注入在 <body> 之后 |
| body_end | ✅ | 注入在</body> 之前 |
page
page选项可以让评论插入到网站的哪哪些页面
| 值 | 默认值 | 描述 |
| ---------------------- | ------ | -------------------------------------------------------------------------------------- |
| default | ✅ | 注入到每个页面 |
| home | | 只注入到主页（is_home() 为 true 的页面） |
| post | | 只注入到文章页面（is_post() 为 true 的页面） |
| page | | 只注入到独立页面（is_page() 为 true 的页面） |
| archive | | 只注入到归档页面（is_archive() 为 true 的页面） |
| category | | 只注入到分类页面（is_category() 为 true 的页面） |
| tag | | 只注入到标签页面（is_tag() 为 true 的页面） |
| 自定义的 layout 名称 | | 如果你知道是什么的话，你可以填写该选项，如果你不知道，那么很可能该插件无法注入评论系统 |