博客使用 utterances 做爲評論系統

utterances 是一款基於 GitHub issues 的評論工具。

相比同類的工具 gitment、gitalk 以及 disqus 評論工具，優勢以下：

1. 極其輕量
2. 加載很是快
3. 配置比較簡單

博以前客一直使用 disqus ,這個工具配置也比較簡單，也是免費的。可是，廣告多，並且加載也比較慢。

體驗了一把 utterances 後，立刻切換到 utterances。

安裝 utterances

utterances 的安裝至關簡單，由於出品了一個 Github App。

首先安裝這個 App ，選擇要關聯評論的倉庫。能夠選擇全部倉庫，也能夠只選擇一個倉庫。選擇一個倉庫比較安全。

安裝完成就是配置成功了，是否是很是簡單。

使用 utterances

在你要使用評論的地方，插入如下代碼：

<script src="https://utteranc.es/client.js" repo="nusr/blog" issue-term="pathname" theme="github-light" crossorigin="anonymous" async> </script>
複製代碼

nusr/blog 是你配置容許訪問的倉庫，格式爲 user-name/repo-name 。

或者動態建立 script 標籤：

<script type="text/javascript"> (function() { // 匿名函數，防止污染全局變量 var utterances = document.createElement('script'); utterances.type = 'text/javascript'; utterances.async = true; utterances.setAttribute('issue-term','pathname') utterances.setAttribute('theme','github-light') utterances.setAttribute('repo','nusr/blog') utterances.crossorigin = 'anonymous'; utterances.src = 'https://utteranc.es/client.js'; // content 是要插入評論的地方 document.getElementById('content').appendChild(utterances); })(); </script>
複製代碼

個人博客是使用 Hugo 搭建的，能夠參考個人配置 config.toml。

配置 utterances

utterances 能夠配置主題，評論映射。

主題 theme 選項以下：

1. github-light
2. github-dark
3. github-dark-orange
4. icy-dark
5. dark-blue
6. photon-dark

評論 issue-term 映射配置選項以下：

1. pathname
2. url
3. title
4. og:title
5. issue-number
6. specific-term

更多配置查看 utteranc.es/

首發 nusr.github.io/