初入 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>

  4. 重新進入 http://localhost:4000/admin 就會套用了