前言
Hexo博客的Yilia主題中評論系統只提供了暢言、網易雲跟帖、多說和Disqus。
由於多說評論、網易雲跟帖已經關閉系統,暢言需要域名備案,而github是國外的,沒有備案,所以嘗試了其他第三方評論系統——友言。
友言使用極其簡單,本地成功實現,但是上傳上github後發現無法出現評論。
在多次查找與嘗試下,終於成功,下面與大家分享我的方法。
歡迎關注我的博客:destiny'Note
本文引自:Hexo + yilia 主題 +githubpages博客添加友言評論功能
注意:本文是在前面都配置好的情況下進行的,如果最初並沒有配置好,請查看:
hexo+gitHubPages 快速搭建個人博客
一、註冊友言id
1. 註冊
在友言官網上直接使用qq登錄,註冊成功直接出來代碼
2. 獲取你的id
進入後臺管理,你會看到:
獲取到你的id
二、博客文件配置
1. 創建uyan.ejs文件
在hexo\themes\yilia\layout_partial\post\
下新建一個uyan.ejs
的文件
將上述代碼copy到該文件中。
2. 修改article.ejs文件
修改hexo\themes\yilia\layout\_partial\article.ejs
,找到
<% if (!index && post.comments){ %>
在此下方添加下列代碼:
<% if (theme.uyan){ %>
<%- partial('post/uyan', {
key: post.slug,
title: post.title,
url: config.url+url_for(post.path)
}) %>
<% } %>
3. 修改yilia主題配置文件_config.yml
修改hexo\themes\yilia
下的_config.yml
,在空白處,添加如下配置:
uyan: '你的友言id'
注意:
要用引號包含你的id
uyan: 後面必須添加一個空格,這是Hexo博客的配置要求
這樣友言已經配置好了,重新編譯,運行:
hexo clean
hexo g
hexo s
訪問: http://localhost:4000
本地實現評論系統成功!
三、解決Github發生錯誤
上傳到github上後,打開你的github頁面,發現評論並沒有出現。按F12,發現報錯:
The page at 'https...' was loaded over HTTPS,
but requested an insecure stylesheet 'http://..../css/1_6/background.css'.
This request has been blocked; the content must be served over HTTPS.
原因:https下的http加載會被阻塞,也就是無法加載友言的那個js文件
查明之後,發現友言並不支持https,但是仍然有人實現了,並沒有詳細的解說。而我注意到域名的更改,如果改了域名,那麼就不是https下了。實踐證明,是可行的。
1. 域名註冊
這裏不詳細說明,沒有域名可自行百度:騰訊雲、阿里雲、萬網等註冊。
域名不貴,基本就幾塊、十幾塊一年,毫無問題
2. Github綁定域名
添加CNAME文件
注意,
CNAME
文件必須放進博客目錄source
文件夾下,不然會被hexo clean
命令清除
在文件內寫入你的域名,不加www
3. 域名解析
按下圖添加記錄:
現在基本已經成功,你可以訪問你的域名來查看你的博客
四、修改配置文件
查看你的博客後,你會發現,頭像無法顯示,鏈接發生錯誤的情況。
原因:
根鏈接發生錯誤,在不添加域名的時候,你的root
會添加/倉庫名/
,各種鏈接都會自動添加這個根,而在添加域名後,域名直接指向你的倉庫,此時鏈接仍然會自行添加根而發生鏈接錯誤。
博客目錄下的_config.yml文件
修改根爲'/'
root: /
主題目錄下的_config.yml文件
修改根同上,並去掉頭像等鏈接的倉庫名
此時就大功告成了!
參考
爲next添加友言評論支持
hexo yilia 添加友言評論支持
使用GitHub頁面的自定義域
github怎麼綁定自己的域名?