Skip to content

hexo

前置作業

  1. 創建github帳號 :

網址:https://github.com/

  1. 創建gtihub pages:

    • 建立一個新的 repository

    • 將Repository name設為 : 用戶名.github.io ， 然後按Create repository

    • 接著進入專案的setting

    • 往下滑會有github page的設定，點黃色框框裡的Check it out here!

    • 點選Theme Chooser 的choose a theme

    • 按select theme

    • 下滑之後點選Commit changes

    這樣就可以了

  2. 安裝Node js:

    • 網址:https://nodejs.org/en/

  3. 安裝git:

    • 網址:https://git-scm.com/

安裝

  • 開啟Git bash(推薦)或window terminal

  • 在你的terminal中輸入以下指令安裝Hexo

npm install -g hexo-cli
  • 接下來要在一個資料夾將你的hexo部落格初始化
hexo init name //初始化新的 Hexo，會在當前路徑建立一個叫 name 的資料夾，資料夾名稱可以隨意取，例如「myblog」，那麼指令就是 hexo init myblog
cd name  //進入您剛剛建立的 name 資料夾當中，cd 是 change directory 的意思
npm install //安裝 Hexo
npm install hexo-deployer-git --save //安裝 git 部署套件

資料夾位置會在 使用者/使用者姓名

編輯

  • 找到你剛剛創的資料夾，並點開congig.yml檔，編輯你的資訊(6~12 行)。
title: My blog #標題
subtitle: 'Hello world' #副標題
description: 'here is my blog' #網站描述
keywords: #網站關鍵字，方便搜尋
author: sean #作者名字
language: zh-Tw #語言
timezone: ''
  • 接著第 16 行的地方，url 請換成自己網站的連結 https://username.github.io/ ，username是自己的 GitHub 帳號。 
url: https://username.github.io/
  • 為了要部屬至github，在deploy (在文件的底部)，請輸入以下設定，repo 的 username 改成自己的 GitHub 帳號，所以 repo 的連結架構長這樣： https://github.com/自己帳號/專案名稱.git ，輸入完一樣記得按下 Ctrl+S 存檔。
deploy:
  type: git
  repo: https://github.com/username/username.github.io.git
  branch: main //目前最新的預設 branch 是 main，若原本的 branch 為 master，則輸入 master

部屬到github

  • 回到終端機，首先確認終端機的路徑在 test 資料夾根目錄下，並依序輸入以下三個指令：(輸入 hexo d 後會要求登入 GitHub 帳號，如圖所示)

要注意在輸入以下三行時，目錄要在你創建的資料夾中。

hexo cl  //清除之前建立的靜態檔案，也可以輸入 hexo clean
hexo g  //建立靜態檔案，也可以輸入 hexo generate
hexo d  //部署至 Github Pages，也可以輸入 hexo deploy

PS. 若第一次使用 Git，則在執行 hexo d 時會報錯(出現 Auther identity unknown. Please tell me who you are. 錯誤訊息)，這時候就要輸入以下兩行資訊(雙引號內自行修改，輸入指令時雙引號要保留)：

git config --global user.email "you@example.com"
git config --global user.name "Your Name"

這三行是幫我們把網站自動生成並發佈到 https://username.github.io 上的指令，完成後就可以打開瀏覽器看看自己網站發布成功的樣子摟！

admin安裝

  • 安裝後台插件

    開啟你的terminal，並進入你的hexo資料夾，打上下面的指令安裝admin 

    npm install hexo-admin --save  //安裝 hexo-admin 文章管理的後台插件\

  • 進入hexo admin後台

    Hexo 部落格可以在 push 到 GitHub 之前，先透過以下指令在「本地端」查看該部落格的樣子。 

    hexo s  //架設本地端伺服器，也可以輸入 hexo server
    在你的瀏覽器輸入 http://localhost:4000 就能看到該部落格，要注意這個部落格尚未 push 到網路上，都還可以做修改。

    本地伺服器運作的時候，不管是在後台編輯文章，還是正在修改部落樣式，只要直接按下 F5 重新整理頁面，基本上是會即時顯示新的樣式/修改後的文章 (除非更改樣式後有語法錯誤)。

    在網址尾端加入 /admin (例如 http://localhost:4000/admin )就能進入後台，這裡能看到所有文章及其內容。

編輯文件

點選New post創建文章，並幫它命名，命名完之後按enter。

ps:如果按enter沒進入寫文章的畫面，只要按F5就出來了。

進去頁面後，再把標題列修改為「文章標題名稱」；而左方就是用 Markdown 語法來寫文章，右方會即時預覽文章(注意這裡編輯文章都是即時儲存內容的)，最後按下右上角的 Publish 來發布文章。

接著回到localhost:4000，就可以看到你剛剛創建的文章。

若要 push 到 GitHub 上，還是要先停止本地伺服器的運作；要停止本地伺服器，只要在命令提示字元的畫面中按下 Ctrl+C，就可以退出了。

部署至 GitHub的三個指令如下：

hexo cl  //清除之前建立的靜態檔案，也可以輸入 hexo clean
hexo g  //建立靜態檔案，也可以輸入 hexo generate
hexo d  //部署至 Github Pages，也可以輸入 hexo deploy
部署完成後，到自己的 github.io 就能看到剛新增的文章摟！

變更主題

網址 : https://hexo.io/themes/

可以去選擇你喜歡的主題來豐富你的blog，每個主題它都會教你如何部屬它的主題。

ps:點它的圖片會進入主題的範本，點它的藍色名字會進入他的github文檔，進入github文檔才會有詳細的安裝教學，請記得要閱讀仔細。

建議:每次更改自己的blog都要記得備份，以免更改到不能改的東西還能救回來。