Hexo個人部落格 - 建立部落格&基本設定

最近練習告一段落，想架個部落格把筆記整理整理
參考網路上架設方式，把自己用到的功能整理起來當作第一篇文章吧 : )

架設 Hexo 部落格簡易教學

1. 建立 GitHub Pages 環境

建立Github Pages

Create a new repository，並將專案名稱取名為 username.github.io。
(假設你的帳號名稱是apple，那麼專案名稱就設定為 apple.github.io)
專案建立完成後，在網址輸入 https://username.github.io/ 就是你的部落格網址囉！

2. 建立 Hexo 環境

安裝相關軟體

以Windows系統為例，需先安裝下列軟體：

Node.js
Git

初始設定

開啟終端機(命令提示字元)，輸入以下指令安裝Hexo：

1	npm install -g hexo-cli

安裝完成後，輸入以下指令來建立部落格：

1
2
3

hexo init name  // name為存放部落格檔案的資料夾，可自訂名稱，若名稱為「Webblog」，指令就為hexo init Webblog
npm install  // 安裝Hexo，若資料夾要移動至非預設磁碟的話，記得切換到該磁碟再安裝
npm install hexo-deployer-git --save  // 安裝 git 部署套件

設定部落格資訊

找到部落格的資料夾後，開啟 _config.yml 這個檔案，打開後找到# Site設定部落格的相關資訊

# Site
title: 部落格名稱
subtitle: 副標題
description: '部落格描述'
keywords: 輸入網站關鍵字(以逗號隔開) 
author: 作者名稱
language: zh-TW // 使用語系
timezone: '' // 留空以使用系統時間

接著，在16行的url記得更換成自己的網址

1	url: https://username.github.io/

這樣就初步完成部落格的設定啦！

3. Hexo 後台管理工具

安裝後台管理工具

安裝 Hexo-admin 的套件
打開終端機(命令提示字元)，輸入

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

進入 Hexo-admin 後台
1
hexo s // 架設本地端伺服器，也可以輸入 hexo server
架設完成後，終端機會顯示「Hexo is running at http://localhost:4000 . Press Ctrl+C to stop.」，便可打開 http://localhost:4000 看到 localhost 的部落格囉！
(※ localhost是只有在「本機」才看得到，並未佈署至 Github ，所以在本機修改完後記得要推到 Github 才算完成唷！)
後台管理頁面
使用 http://localhost:4000/admin 即可進入後台，後台可以看到所有文章內容
停止 localhost 伺服器
在啟動本地端伺服器時，終端機上面就有寫到，「Press Ctrl+C to stop.」按下Ctrl+C就可以終止囉。

4. 將部落格佈署至 Github

網站編輯後，要佈署至Github，這邊的文件也需要做一些設定，在 _config.yml 檔案內找到deploy修改以下資訊。

# Deployment
deploy:
  type: git
  repo: https://github.com/username/username.github.io.git  // 自己Github的帳號
  branch: master

Hexo 可以佈署到很多個地方，GitHub只是其中一種，故此處的type型態是git，若要部屬到其他地方可以參考Hexo 的教學文件：佈署 | Hexo。

佈署至Github

回到終端機，輸入以下三個指令，便可將網頁佈署至Github囉！

1
2
3

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

回到 https://username.github.io 就可以看到剛剛修改的資料囉！(有時會需要一點時間部落格才會上傳完成)

參考來源：https://ed521.github.io/2019/08/hexo-admin/