在上一篇部落格《程式設計師如何從0到1搭建自己的技術部落格》中,我們瞭解瞭如何快速的從0到1搭建一個個人部落格。
其實細心的你會發現,該部落格用到了一個評論外掛,這個外掛就是Gitalk。
如果想要在部落格中正確的使用該外掛,還是需要修改下_config.yml裡關於Gitalk的配置的。
也許你會好奇Gitalk是什麼?有什麼用途?
我們開啟下Gitalk的官網gitalk.github.io/,就能看到答案。

Gitalk其實就是一個評論外掛,訪問網站的使用者可以使用GitHub賬號登入後進行文章評論,博主也可以進行回覆,增進交流。
那麼接下來我們詳細講解下,如何在部落格中使用Gitalk外掛。
1.申請OAuth Application

申請完成後,可以在GitHub-->Settings-->Developer settings看到:

在詳情頁,可以看到剛剛申請的clientID與clientSecret:

2.修改_config.yml關於Gitalk的配置
為方便對比展示,我這裡擷取下我的修改記錄:



3.開啟GitHub倉庫的Issues功能

只有開啟該配置,每次開啟新發布的部落格(新頁面),都會生成一個新的Issues,該頁面所有的評論都會彙總在該Issues下:

4.最終生成的程式碼
<link rel="stylesheet" href="http://www.zwwhnly.com/assets/css/gitalk.css">
<script src="http://www.zwwhnly.com/assets/js/gitalk.min.js"></script>
<div id="gitalk-container"></div>
<script>
var gitalk = new Gitalk({
id: '/spring/2019/03/06/javaconfig-bean.html', // 自動生成每個頁面的地址,注意不要重複
clientID: 'clientID',
clientSecret: 'clientSecret',
repo: 'zwwhnly.github.io', // GitHub倉庫名
owner: 'zwwhnly', // GitHub使用者名稱
admin: ['zwwhnly'], // GitHub使用者名稱
perPage: 50
})
gitalk.render('gitalk-container');
</script>
複製程式碼
如果是其他的網站,直接新增以上程式碼(稍作修改)就可以開始使用Gitalk。
5.效果預覽
