安裝與使用 Hexo 在 Github 上撰寫部落格 EP.3

EP.3 可以大致分成 2 個部分,分別是:

  1. GitHub 端的連結準備:詳見本文後敘步驟 1 至 3。
  2. 本機端的連結準備與推送:詳見本文後敘步驟 4 至 8。

依據 EP.2 我個人給的建議,我也給這個 Demo 用的 Hexo 部落格網站,命名為 jutedev.github.io(這會是這個部落格的網址)。

  1. 建立好 Repository,點到該 Repository 的「Settings」,找到左下「Pages」那個選項,點「Choose a theme」。
  2. 點好之後,就會跳到下面這個畫面,基本上,直接點完「Select theme」,就可以再從「Settings」回到剛才那個「Pages」選項。
  3. 接著,就能夠看到自己即將發佈部落格的網址,正是 jutedev.github.io。這裡有 2 個重點要注意:其一,注意 Enforce HTTPS 一定要勾選核取;其二,看看「Source」那一項裡面,Branch 的名稱,通常是「gh-pages」,或者是像下圖所示的「main」,無論是那一個名稱,新手我建議直接記下來就好,先不要去改動這個地方。
  4. 完成上面 1 至 3 個步驟後,基本上 GitHub 端的連結準備已經做好,接著就是本機端的連結設定。首先,使用檔案總管,開啟 EP.1 時用 mkdir 這個指令產生的初始資料夾,找到「_config.yml」這個檔案,並使用文字編輯器(我選用 Notepad++)開啟這個檔案。
  5. 先處理網站標題、編輯者、語言與網站網址,在檔案一開始 1 至 16 行就可以找到 title、author、language 與 url,下圖的 language 我並沒有更動,如果想要讓網站以繁體中文顯示的話,請改成 zh-TW。。
  6. 接著來到「_config.yml」這個檔案的第 105 行,預設應該只會寫 type,這裡請自己把下面幾行程式貼過去用。

    type: git
    repository: https://github.com/jutedev/jutedev(記得改成自己的).github.io
    branch: main(記得步驟 3 的提醒,這裡的名稱要設定正確)

  7. 開啟命令提示字元(CMD),直接殺到一開始用 mkdir 新增的初始資料夾,先下一道指令:npm install hexo-deployer-git –save。眼尖的伙伴,應該會看到我立馬下另外一道指令:hexo d,雖然會吃到錯誤訊息,不過,我覺得走這條路,設定起來也算快,這個錯誤訊息是在跟使用者說,還沒有完成 Git 的初次設定,這裡我建議新手先做全域 (global) 設定。

    $ git config --global user.email "jutedev@gmail.com(記得改成自己的)"
    $ git config --global user.name "jutedev(記得改成自己的)"

  8. 再下一次 hexo d 這道指令,會再出現另外一個錯誤訊息:還沒有做完 Git 認證,所以很貼心地提供 2 種方式:要用網頁登入的方式,還是直接在 CMD 裡面輸入帳號密碼,預設 (default) 是網頁登入。在這裡,我選擇第 2 項,設定好 hexo d 會自行繼續走完。

順利的話,走完 8 道程序,就完成本機端與 GitHub 端的連結與推動,看到一個 Hexo 預設佈景的部落格。

發佈留言