之前使用的主題是NexT，於是想這次想試試看不同的主題

Butterfly主題客製化

404 Page

theme/_config.yaml自定 404 頁面

1
2
3
4
error_404:
  enable: true
  subtitle: 'Page Not Found'
  background: <img_url>

開啟上方Nav Bar

可依需求取消註解：

1
2
3
4
5
6
7
8
9
10
menu:
  Home: / || fas fa-home
  Archives: /archives/ || fas fa-archive
  Tags: /tags/ || fas fa-tags
  Categories: /categories/ || fas fa-folder-open
  # List||fas fa-list:
  #   Music: /music/ || fas fa-music
  #   Movie: /movies/ || fas fa-video
  Link: /link/ || fas fa-link
  About: /about/ || fas fa-heart

image

更改圖標、頭像

1
2
3
4
5
6
nav:
  logo: /img/logo_small.png # image
  display_title: true
  fixed: false # fixed navigation bar

favicon: /img/logo_small.png

更改主題色

找到./themes/_config.yml中的theme_color block並取消註解

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
theme_color:
  enable: true
  main: "#1F5791"
  paginator: "#435A6C"
  button_hover: "#FF7242"
  text_selection: "#00c4b6"
  link_color: "#99a9bf"
  meta_color: "#858585"
  hr_color: "#A4D8FA"
  code_foreground: "#F47466"
  code_background: "rgba(27, 31, 35, .05)"
  toc_color: "#435A6C"
  blockquote_padding_color: "#1F5791"
  blockquote_background_color: "#1F5791"
  scrollbar_color: "#1F5791"
  meta_theme_color_light: "ffffff"
  meta_theme_color_dark: "#0d0d0d"

顏色選擇可以到這個網站上挑：https://www.peko-step.com/en/tool/tfcolor_en.html

新增頁面

在Hexo裡有些指定保留的頁面，通常已經有設定好在config檔裡了：about, archives, tages, categories，其他頁面若是需要的話都要記得到config下設定好路徑。

  1. 使用指令：hexo new page "about"
  2. 直接在./source下建立資料夾以及index.md
    image

    如果遇到頁面無法正常顯示可至./_config.xml裡檢查目錄設置的狀態，確保新增的頁面都是有指定到正確位置
    image

  3. 在index.md檔中加入相對應的type
    1
    2
    3
    4
    5
    6
    ---
    title: About 關於我
    date: 2024-07-08 14:48:28
    type: "about"
    ---

新增文章

hexo new "<post_name>"

給文章加上標籤(tags)及分類(categories)

1
2
3
4
5
6
7
8
9
10
11
12
---
title: Line Chat Bot 聊天機器人 - 機器人睡著了？使用Scheduler把他叫醒吧！
date: 2022-04-15 14:15:32
tags:
- Line
- ChatBot
- 聊天機器人
- Django
- Heroku
categories:
- Line Chat Bot 聊天機器人
---