初入 hexo-admin

發表於 分類於

hexo-admin 是方便管理 hexo 網站的一個套件，比起使用指令來新增頁面，並自行修改 Markdown 文件，hexo-admin 使用 GUI 進行文章與頁面的新增，並可以直接對現有的 .md 文件進行編輯和預覽，並可以一鍵發布草稿，簡化了發布文章的流程，操作上也比較直觀。

安裝

  1. 進入本地端的 hexo 資料夾
  2. 使用 npm install -save hexo-admin 安裝 hexo-admin
  3. 完成安裝

使用

  1. 進入本地端的 hexo 資料夾
  2. 執行 hexo s 或 hexo s -g 開啟 local 測試伺服器
  3. 透過瀏覽器進入 http://localhost:4000/admin 使用 hexo-admin

使用 hexo-admin 遇到的一些問題

hexo-admin 跑版問題

我個人是習慣使用 firefox 瀏覽器，但是在使用 hexo-admin 時發現了 hexo-admin有跑版的現象，但是怎麼找都找不到有遇到類似的問題，只好自行研究了

暫時的解決方法：

  1. 先進入 hexo\node_modules\hexo-admin\www 裡面會有進入 admin畫面的基本頁面資訊
  2. 使用 notepad++ 之類的軟體開啟 index.php檔案
  3. 在 <header> 的最下方加入下面這一段：
1
2
3
4
5
6
7
8
9
10
11
12
13
<script>
// 由於火狐在新增 my-extension-installed 的時機是在頁面載入並執行後
// 所以這邊使用 setTimeout 延遲修改，可以依據個人狀況修改延遲時間
setTimeout(function() {
    // 隱藏用來判斷火狐擴充元件的元素
    var ext = document.getElementById("my-extension-installed");
    ext && (ext.style.display = "none");

    // 將 admin 主體套用 100% 的高度
    var app = document.getElementsByClassName("app");
    app && (app[0].parentNode.style["height"] = "100%");
}, 100);
</script>
  1. 重新進入 http://localhost:4000/admin 就會套用了