利用Gitalk来为Oneindex网盘实现评论功能。

I、简介


Gitalk demo
Gitalk 是一个基于 GitHub Issue 和 Preact 开发的评论插件。

Github地址:https://github.com/gitalk/gitalk

特性

  • 使用 GitHub 登录
  • 支持多语言 [en, zh-CN, zh-TW, es-ES, fr, ru]
  • 支持个人或组织
  • 无干扰模式(设置 distractionFreeMode 为 true 开启)
  • 快捷键提交评论 (cmd|ctrl + enter)

II、安装

首先,需要选择一个公共github存储库(已存在或创建一个新的github存储库)用于存储评论,然后需要创建 GitHub Application,如果没有 点击这里申请Authorization callback URL 填写当前使用插件页面的域名。

New OAuth Application

然后进入网站根目录下的/view文件夹,选择你当前使用主题的文件夹,classic为默认主题,我使用的是nexmoe主题。接着进入相应的主题文件夹并编辑其下的 layout.php文件,在 </head>前引入以下内容。

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.css">
  <script src="https://cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.min.js"></script>

  <!-- or -->

  <link rel="stylesheet" href="https://unpkg.com/gitalk/dist/gitalk.css">
  <script src="https://unpkg.com/gitalk/dist/gitalk.min.js"></script>

根据自身情况二选一引用即可。

<?php view::section('content');?>后添加以下代码

<div id="gitalk-container"></div>
<script type="text/javascript">
var gitalk = new Gitalk({
        clientID: 'GitHub Application Client ID',
        clientSecret: 'GitHub Application Client Secret',
        repo: '用于存储评论的仓库名',
        owner: 'GitHub用户名',
        admin: ['GitHub用户名'],
        id: 'oneindex',
        distractionFreeMode: true,
        createIssueManually: true
    });
gitalk.render('gitalk-container');
</script>

根据之前申请的GitHub Application,填写 clientIDclientSecret等信息。

gitalk评论
最后打开你的oneindex首页,等待最下方gitalk评论加载完毕,点击初始化issue,再刷新页面即可。

如果觉得我的文章对你有用,请随意赞赏