為hexo的even主題新增評論功能
早就想給部落格新增評論功能，一直沒去研究。雖然前端程式碼一點都不會，但好在我會魔改：）
這篇文章記錄一下我為 ofollow,noindex">Even 主題新增 gitment 作為評論系統的過程。首先，我們需要先註冊 OAuth Application ，填的東西如下：
點選 Register application 然後將 client ID 和一個 client secret 記下，等下要用。
然後將下面的程式碼新增到 themes/even/layout/_partial/comments.swig 頁面：
<div id="container"></div> <link rel="stylesheet" href="https://imsun.github.io/gitment/style/default.css"> <script src="https://imsun.github.io/gitment/dist/gitment.browser.js"></script> <script> var gitment = new Gitment({ id: '頁面 ID', // 可選。預設為 location.href owner: '你的 GitHub ID', repo: '儲存評論的 repo', oauth: { client_id: '你的 client ID', client_secret: '你的 client secret', }, }) gitment.render('container') </script>
這裡 第2-3行 有一個 css 和 js 程式，我直接下載到本地，分別儲存在： themes/even/source/css/gitcomment_default.css 、 themes/even/source/js/src/gitment.browser.js .然後我將整個 themes/even/layout/_partial/comments.swig 的程式碼修改如下：
{% if page.comments and not is_home() %}
<div class="comments" id="comments">
{# Gitcomment #}
<div id="container"></div>
<link rel="stylesheet" href="{{ url_for('css') }}/gitcomment_default.css">
<script src="{{ url_for('js/src') }}/gitment.browser.js"></script>
<script>
var gitment = new Gitment({
id: 'location.href', // 可選。預設為 location.href
owner: 'mochazz',
repo: 'mochazz.github.io',
oauth: {
client_id: 'ecxxxxxxxxxxxa5',
client_secret: 'baxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx78',
},
})
gitment.render('container')
</script>
</div>
{% endif %}
然後就可以正常使用了。然而最近 gitment 出了些問題，即我按照上述步驟配置後，在初始化評論處會報 [object ProgressEvent] 錯誤，我到 gitment 專案看 issue 的時候，發現好多人出現這個錯誤，不過在下面的 issue 中有解決方法。首先要在自己的伺服器上搭一個驗證功能，搭建教程及程式碼點 這裡 ，然後找到剛才我們下載的 themes/even/source/js/src/gitment.browser.js 檔案，將其中的驗證伺服器地址修改成你伺服器的地址即可。預設伺服器地址為： https://gh-oauth.imsun.net 。我比較懶，這裡直接用了別人搭建好的地址： https://auth.baixiaotu.cc ，然後就可以使用評論功能了。