如何使用utterances給靜態(tài)博客實(shí)現(xiàn)評(píng)論功能

這篇文章將為大家詳細(xì)講解有關(guān)如何使用utterances給靜態(tài)博客實(shí)現(xiàn)評(píng)論功能，小編覺(jué)得挺實(shí)用的，因此分享給大家做個(gè)參考，希望大家閱讀完這篇文章后可以有所收獲。

了解utterances

utterances是一款基于Github Issue的Github工具,優(yōu)點(diǎn)主要是無(wú)廣告、加載快、配置簡(jiǎn)單，輕量開(kāi)源!由于我沒(méi)有使用過(guò)其他評(píng)論工具的經(jīng)驗(yàn)，因此只講述一下utterances自身的優(yōu)點(diǎn)，具體對(duì)比情況無(wú)法給出，但是看到有的博主表示之前使用disqus,但是廣告多，加載也比較慢，體驗(yàn)了一把utterances 后，馬上切換到utterances。相信utterances足夠讓我使用很久了。

安裝utterances

由于utterances是一款Github App，因此安裝utterances^[1]非常簡(jiǎn)單，只需要授權(quán)特定repo權(quán)限給utterances就可以了,注意一個(gè)點(diǎn)：授權(quán)的這個(gè)repo必須是public的，可以選擇多個(gè)repo，但是建議選擇一個(gè)就可以了，也比較安全。

給出我授權(quán)的repo作為參考，我是選擇博客的repo作為utterances評(píng)論的存放點(diǎn)(在博客評(píng)論的內(nèi)容都會(huì)以issue的形式發(fā)布在repo下).

到目前為止utterances就已經(jīng)安裝好了，接下來(lái)是需要在博客將評(píng)論的客戶(hù)端顯示出來(lái)。

配置utterances評(píng)論顯示

可以配置在你希望顯示評(píng)論的地方，這里給出一個(gè)簡(jiǎn)單的實(shí)現(xiàn)：配置在footer.html的頂部(顯示在每篇文章的底部).

把具體的倉(cāng)庫(kù)改成自己授權(quán)給utterances的倉(cāng)庫(kù)即可。

<script src="https://utteranc.es/client.js"repo="liangyuanpeng/liangyuanpeng.github.io"issue-term="title"theme="github-light"crossorigin="anonymous"async></script>

這是當(dāng)前最簡(jiǎn)單的方式，更優(yōu)雅的方式是以配置文件的方式實(shí)現(xiàn)，例如：

html中的配置模板

{{ if .Site.Params.utteranc.enable }}<script src="https://utteranc.es/client.js"repo="{{ .Site.Params.utteranc.repo }}"issue-term="{{ .Site.Params.utteranc.issueTerm }}"theme="{{ .Site.Params.utteranc.theme }}"crossorigin="anonymous"async></script>{{ end }}

配置文件中的配置項(xiàng)：

## 配置 utteranc評(píng)論,教程參考 https://utteranc.es/[params.utteranc]  enable = false  repo = "liangyuanpeng/liangyuanpeng.github.io" ##換成自己得  issueTerm = "title"  theme = "github-light"

這樣的話(huà)需要修改倉(cāng)庫(kù)或者主題都可以很方便的修改一下配置文件就可以了，同時(shí)也可以選擇不開(kāi)啟評(píng)論。

評(píng)論顯示的主題有多種，具體可以在utterances官方^[2]查看，這里給出當(dāng)前時(shí)間點(diǎn)的一個(gè)列表：

1.github-light2.github-dark3.github-dark-orange4.icy-dark5.dark-blue6.photon-dark7.preferred-color-scheme8.boxy-light

映射到issue也有幾種方式:

1.pathname2.url3.title4.og:title5.issue-number6.specific-term

我選擇的是title的方式，對(duì)應(yīng)評(píng)論會(huì)以文章標(biāo)題作為issue的標(biāo)題創(chuàng)建在對(duì)應(yīng)倉(cāng)庫(kù)下。

到目前為止，給hugo靜態(tài)博客添加評(píng)論的功能已經(jīng)做好了，不需要服務(wù)器就可以擁有評(píng)論功能，實(shí)用！

關(guān)于“如何使用utterances給靜態(tài)博客實(shí)現(xiàn)評(píng)論功能”這篇文章就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，使各位可以學(xué)到更多知識(shí)，如果覺(jué)得文章不錯(cuò)，請(qǐng)把它分享出去讓更多的人看到。