Hexo的hexo-theme-matery主题配置评论

0. 前言

之前写过一篇文章用Hexo搭建个人博客,介绍如何用Hexo搭建个人博客网站,使用了hexo-theme-matery主题,今天介绍一下这个主题下使用的评论插件。

1. 评论插件

matery主题集成了各种评论模块,例如 gitalkgitmentdisqusliverevalinewalineTwikooutteranc 等,今天要介绍的 utteranc 这种插件是集成在github种的评论插件,并且能够做到github邮箱通知。下面就来详细介绍一下utteranc如何配置

1.1 新建一个评论仓库

首先创建一个公开的评论仓库<自定义名称> !注意一定要公开,否则别人无法评论

1.2 安装utteranc

  • 进入utteranc,点击install
  • 选择刚刚创建的自定义评论仓库
  • repo输入自己刚刚新建的仓库
  • 其他按照自己的需要挑战,把最后生成的配置,copy 下来
ini 复制代码
<script src="https://utteranc.es/client.js"
        repo="ZBIGBEAR/sync_test"
        issue-term="pathname"
        theme="github-light"
        crossorigin="anonymous"
        async>
</script>

1.3 添加配置到matery主题

  • 修改matery主题的配置文件 themes/hexo-theme-matery/_config.yml ,开启utteranc功能
yaml 复制代码
# utteranc config, default disabled
# utteranc 评论模块的配置,默认为不激活
utteranc:
  enable: true
  • 修改博客文章 themes/hexo-theme-matery/layout/_partial/post-detail.ejs
scss 复制代码
<% if (theme.utteranc && theme.utteranc.enable) { %>
<%- partial('_partial/utteranc') %>
<% } %>

该处改动的目的是为了在所有博客文章中统一在底部加入一个评论模块,这个改动很关键、所放位置也很重要。

  • 新增一个文件 themes/hexo-theme-matery/layout/_partial/utteranc.ejs
ini 复制代码
<div class="card" data-aos="fade-up">
    <div id="utteranc-container" class="card-content">
        <script src="https://utteranc.es/client.js"
                repo="jijunhao/utterances"
                issue-term="pathname"
                theme="github-light"
                crossorigin="anonymous"
                async>
        </script>
    </div>
</div>

所有的留言都会出现在自定义评论仓库 issues 的,并且会每次给邮箱发消息。

  • 如果博客中还有单独的一个留言板模块,需要改 themes/hexo-theme-matery/layout/contact.ejs
scss 复制代码
<% if (theme.utteranc && theme.utteranc.enable) { %>
    <%- partial('_partial/utteranc') %>
<% } %>

最后重启hexo,就能在网页拥有评论功能了。

2. 参考

1\][用Hexo搭建个人博客](https://juejin.cn/post/7338651990476324903 "https://juejin.cn/post/7338651990476324903") \[2\][Hexo-Matery主题评论插件](https://link.juejin.cn?target=https%3A%2F%2Fwww.cnblogs.com%2Fjijunhao%2Fp%2F17235903.html "https://www.cnblogs.com/jijunhao/p/17235903.html")

相关推荐
荣达1 小时前
koa洋葱模型理解
前端·后端·node.js
AAA修煤气灶刘哥2 小时前
Kafka 入门不踩坑!从概念到搭环境,后端 er 看完就能用
大数据·后端·kafka
月小水长2 小时前
大模型接入自定义 MCP Server,我开发了个免费使用的基金涨跌归纳和归因分析的 Agent
人工智能·后端
yinke小琪2 小时前
说说hashCode() 和 equals() 之间的关系
java·后端·面试
花果山最Man的男人2 小时前
@Autowired注解使用说明
后端
京东云开发者2 小时前
如何秒级实现接口间“幂等”补偿:一款轻量级仿幂等数据校正处理辅助工具
后端
会飞的架狗师2 小时前
【MySQL体系】第1篇:从MySQL架构原理到存储的解析
后端·mysql
用户8356290780512 小时前
用Python高效处理Excel数据:Excel数据读取指南
后端·python
IT技术小密圈2 小时前
图解系统设计: 五分钟从单体架构到微服务(上)
后端