hexo-yilia主题支持twikoo评论系统

如果图片无法加载,可到 我的博客 中,查看完整文章

yilia-more 已经增加对 twikoo 的支持,可直接使用

代码修改

  1. layout/_partial/post 路径下新建 twikoo.ejs,添加代码

    <div id="tcomment"></div>
    <script src="https://cdn.staticfile.org/twikoo/1.5.11/twikoo.all.min.js"></script>
    <script>
    twikoo.init({
      envId: '<%= theme.twikoo.envId %>', // 腾讯云环境填 envId;Vercel 环境填地址(https://xxx.vercel.app)
      el: '#tcomment', // 容器元素
      // region: 'ap-guangzhou', // 环境地域,默认为 ap-shanghai,腾讯云环境填 ap-shanghai 或 ap-guangzhou;Vercel 环境不填
      // path: location.pathname, // 用于区分不同文章的自定义 js 路径,如果您的文章路径不是 location.pathname,需传此参数
      // lang: 'zh-CN', // 用于手动设定评论区语言,支持的语言列表 https://github.com/imaegoo/twikoo/blob/main/src/js/utils/i18n/index.js
    })
    </script>
    
  2. layout/_partial/article.ejs 底部增加代码

    <!-- twikoo评论系统 -->
    <% if (theme.twikoo && theme.twikoo.enable && theme.twikoo.envId){ %>
    <%- partial('post/twikoo', {
            key: post.slug,
            title: post.title,
            url: config.url+url_for(post.path)
            }) %>
    <% } %>
    <% } %>
    
  3. _config.yml 增加 twikoo 配置

    twikoo:
      enable: true
      envId:  # 环境id
    
  4. 打包

    npm run dist

envId 获取

云函数手动部署

邮件提醒设置

  • 进入twikoo管理面板

  • 配置管理->邮件通知

    文章可能会存在传图失败的情况,建议访问底部博主的个人博客链接

  • 配置管理-->邮件通知测试

    文章可能会存在传图失败的情况,建议访问底部博主的个人博客链接

    测试成功通过就配置成功了

博主标识设置

完成效果

image-20220727175251903

posted @ 2022-07-29 12:47  布小星  阅读(141)  评论(1编辑  收藏  举报