Hike News
Hike News

Hexo 主題設定

資料夾架構

跟 Hexo 要建立文章相關的資料夾

  • public 資料夾 - 生成靜態網站

  • scaffolds 資料夾 - 樣版

  • source / _posts 資料夾 - 文章內容都放在這裡

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
├── .deploy_git
├── .git
├── node_modules
├── public # hexo g 生成靜態網站
├── scaffolds # 指令產生的草稿、頁面、文章都會依照資料夾內的文件建立
| ├── draft.md
| ├── page.md
| └── post.md # 生成文章的樣版
├── source
| ├── _drafts
| └── _posts # 文章資料夾
├── themes # theme 版型資料夾
| └── landscape # 預設 theme
| └── _config.yml # 版型樣式 設定
├── .gitignore
├── _config.yml # 基本部署 設定
├── db.json
├── package.json
└── package-lock.json

基本部署 設定

  • 版型列表 - https://hexo.io/themes/
  • 編寫格式為 yaml
  • 內容 “ : “ 後面都必需保留一格半型空格
  • 預設設定
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
# Site
title: 標題 / 網站名
subtitle: 副標題 / 顯示在頁首
description: 網站描述 (SEO、告訴搜尋引擎這個網站的描述)
keywords: 關鍵字
author: 作者
language: 網站語言 (台灣:zh-tw)
timezone: 時區

# URL
# 例如 url 是 'http://UserName.github.io/repository/'
# root 就是倉庫名稱 '/repository/'
url: http://UserName.github.io/
root: /repository
permalink: 文章網址的永久連結格式(預設使用 YYYY\MM\DD\文章名稱)/
permalink_defaults: 永久連結網址的預設值
# 格式可參考官方教學
# https://hexo.io/zh-tw/docs/permalinks.html

# Extensions
theme: 套用版型

# Deployment 上傳路徑
deploy:
type: git
repository: 部署的儲存庫路徑 / https://github.com/UserName/repository.git
branch: gh-pages 分支
message: 部署訊息

避免出錯,在每次的修改設定後,都需要再執行清除先前的資料

1
hexo clean

清除後再生成新的資料

1
2
3
4
5
hexo generate # 產生新的靜態檔案
hexo deploy # 發布至遠端

# 簡短的指令
hexo d -g # 生成 public 並提交

文章佈局

  • 預設佈局 layout

    • post : 文章
    • page : 頁面
    • draft : 草稿
  • 鷹架 Scaffold : 可依照文章需要的格式去新增文章,就不用再微調

    • 這會依照 scaffolds 資料夾內建立好的預設檔案新增文章
    1
    2
    3
    hexo new photo "My Gallery"
    # photo 是必須事先建立編排好的格式 .md 檔案
    # "My Gallery" 是新增的文章檔名

新增草稿

在 Bash 輸入指令後會建立在 source / _drafts / 資料夾內

1
hexo new draft 文章名稱

只要在草稿 _drafts 資料夾內的文章,預設是不會出現在網頁上

草稿轉文章

輸入執行 layout 是要移動到的佈局、title 是要移動的檔名

1
hexo publish [layout] <title>

就會發現草稿的檔案和相關連資料夾會一起移動到 _posts 資料夾

另外也可以手動搬移,只要從 _drafts 把文章放到 _posts 資料夾內就可以了

新增文章

在 Bash 輸入指令後會建立在 source / _posts / 資料夾內

1
hexo new 文章名稱

文章都是用 Markdown 語法撰寫

刪除文章

  • 只要到 source / _post 刪除本地文件
  • 執行清除資料夾再上傳,文章就會不見了
1
2
3
hexo clean
hexo g
hexo d

建立頁面

和文章不同,這是在建立 theme 的 menu 頁面 archives、categories、tags、about …

在沒建立前,新增的 menu 都會出現 404 頁面

所以在 _config.yml

1
2
3
4
5
6
7
8
9
10
menu:
Home: /

# 下面新增的 menu ,都需要產生頁面
Archives: /archives
Categories: /categories
Tags: /tags
About: /about
Link: /link
...

在 Bash 執行產生

1
hexo new page 頁面名稱

需要在這些頁面隱藏留言、評論功能時,就需加上 comments: false 關閉

1
2
3
title: categories
date: 2020-03-07 12:34:56
comments: false

categories 分類頁面

在 Bash 輸入

1
hexo new page categories

在產生的 source/categories/inex.md 儲存以下內容

1
2
3
title: categories
date: 2020-03-07 22:52:41
type: "categories"

如何使用分類,只要在文章開頭加上 categories 和分類名稱就可以了

若是有 2 個以上分類時注意,要使用中括號 “ [ ] “ ,陣列型式包著分類名稱

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
# 陣列中只有一個名稱時,像下面例子會是 2 個分類
categories:
- [Dog]
- [Cat]

# 陣列中有 2 個名稱時,這會是一個有上下層關連的分類
categories:
- [Animal, Dog] # Animal 是父層,Dog 是子層
- [Animal, Cat]

# 錯誤的分類,沒使用中括號時 Dog 是父層、 Cat 是在 Dog 下的子層
# 像下面例子就只會是 1 個分類
categories:
- Dog
- Cat

tags 頁面

在 Bash 輸入

1
hexo new page tags

在產生的 source/tags/inex.md 儲存以下內容

1
2
3
title: tags
date: 2019-04-01 22:55:41
type: "tags"

在文章開頭加上 tags 和標籤,當多個標籤時只要像下面作法就可以了

1
2
3
4
5
6
7
8
9
10
11
# 一個 tag
tags: Dog

# 多個 tag
tags:
- Dog
- Cat
- Bear
- Fox
- Bat
- Deer

about 關於頁面

1
hexo new page about

編輯 source /about/ index.md 內容

若是沒出現 about 選單的話,可能是沒開啟 about 頁

到 themes/ 套用版型名稱 /_config.yml 移除 menu > about 前的 # 註解就會看到

1
2
menu:
about: /about