_config.yml配置文件說明
站點(diǎn)基本信息
# 站點(diǎn)名稱
title: 王某某的筆記
# 站點(diǎn)副標(biāo)題
subtitle: 記錄我的編程之路
# 站點(diǎn)描述
description: 這是一個(gè)使用 Hexo 構(gòu)建的博客,用于分享我的編程經(jīng)驗(yàn)和學(xué)習(xí)筆記德迹。
# 作者名稱
author: 王某某
# 站點(diǎn)語言
language: zh-CN
站點(diǎn)的 URL 結(jié)構(gòu)
# URL 前綴芽卿,例如如果站點(diǎn)部署在子目錄下,需要設(shè)置此項(xiàng)
root: /
# 生成文件的目錄
public_dir: public
# Source 文件夾
source_dir: source
# 默認(rèn)布局
default_layout: post
# permalink 配置
permalink: :year/:month/:day/:title/
這里將permalink:
permalink: :title/
設(shè)置站點(diǎn)的時(shí)間格式和時(shí)區(qū)
# 時(shí)間格式
date_format: YYYY-MM-DD
time_format: HH:mm:ss
# 時(shí)區(qū)設(shè)置
timezone: Asia/Shanghai
配置站點(diǎn)的分頁功能
# 每頁顯示的文章數(shù)
per_page: 10
# 分頁路徑
pagination_dir: page
配置404頁面
在站點(diǎn)根目錄創(chuàng)建一個(gè)名為404的新文件夾浦辨,然后在其中創(chuàng)建一個(gè)新頁面:
cd hexo-site
hexo new page 404
確保relative_link已禁用
relative_link: false
能否將用戶重定向到 404 頁面取決于網(wǎng)站托管服務(wù)商或 Web 服務(wù)器的設(shè)置,而非 Hexo 的設(shè)置沼沈。例如流酬,如果您使用 Nginx 作為服務(wù)器,您還需要在nginx.conf文件中配置 404 頁面列另。
使用NexT主題
NexT 主題
github地址:
https://github.com/next-theme/hexo-theme-next
詳細(xì)安裝說明:
https://theme-next.js.org/docs/getting-started/installation.html
安裝
使用npm安裝
cd hexo-site
npm install hexo-theme-next
或者你可以克隆整個(gè)存儲庫:
cd hexo-site
git clone https://github.com/next-theme/hexo-theme-next themes/next
啟用主題
修改:Hexo的 _config.yml 文件
theme: next
默認(rèn)主題是:landscape
復(fù)制主題配置文件
將主題的配置文件復(fù)制到根目錄芽腾,命名為:_config.next.yml
cd hexo-site
## npm方式安裝則:
cp ./node_modules/hexo-theme-next/_config.yml _config.next.yml
## git克隆則:
cp ./themes/next/_config.yml _config.next.yml
然后相關(guān)配置都是修改 _config.next.yml 這個(gè)配置文件
選擇方案
Scheme 是 NexT 支持的一個(gè)功能,通過使用 Scheme页衙,NexT 可以為您提供不同的視圖摊滔。
到目前為止阴绢,NexT 支持 4 種方案,它們是:
- Muse→ Default Scheme艰躺,這是NexT的初始版本呻袭。使用黑白色調(diào),主要看起來很干凈腺兴。
- Mist→ Muse 的更緊湊版本左电,具有整潔的單列視圖。
- Pisces→ 雙列方案页响,像鄰居的女兒一樣新鮮篓足。
- Gemini→ 看起來像雙魚座,但有明顯的帶陰影的柱塊闰蚕,看起來更加敏感栈拖。
可以通過編輯來更改方案NexT 配置文件,搜索scheme關(guān)鍵字
# Schemes
scheme: Muse
#scheme: Mist
scheme: Pisces
#scheme: Gemini
這里選Pisces
側(cè)邊欄頭像設(shè)置
# Sidebar Avatar
avatar:
# Replace the default image and set the url here.
url: /images/avatar.jpg
# If true, the avatar will be displayed in circle.
rounded: true
# If true, the avatar will be rotated with the cursor.
rotated: false
將頭像圖片avatar.jpg 放到 ./source/images/ 目錄中
配置菜單項(xiàng)
菜單設(shè)置項(xiàng)包含 3 個(gè)值:
Key: /link/ || icon
- Key→ 是菜單項(xiàng)的名稱(home没陡、archives等)涩哟。如果在語言中可以找到此菜單的翻譯,則將加載此翻譯诗鸭;如果沒有染簇,Key則將使用名稱。
- 分隔符之前的值||(/link/)→ 是您網(wǎng)站內(nèi)相對 URL 的目標(biāo)鏈接强岸。
- ||分隔符 ( ) →后的值icon是 Font Awesome 圖標(biāo)的名稱锻弓。該圖標(biāo)的名稱可以在Font Awesome [https://fontawesome.com/search]
中找。
默認(rèn)情況下蝌箍,所有菜單項(xiàng)均被注釋掉青灼,以確保您可以在備用主題配置中覆蓋它們。
這里修改為:
menu:
home: / || fa fa-home
about: /about/ || fa fa-user
tags: /tags/ || fa fa-tags
categories: /categories/ || fa fa-th
archives: /archives/ || fa fa-archive
社交鏈接
# 社交鏈接設(shè)置
social:
GitHub: https://github.com/wangwen135 || fa fa-github
Weibo: https://weibo.com/your-username || fa fa-weibo
Zhihu: https://www.zhihu.com/people/your-username || fa fa-zhihu
Email: mailto:your-email@example.com || fa fa-envelope
配置Tags頁面
Next主題默認(rèn)沒有Tags頁面妓盲,點(diǎn)擊左側(cè)菜單“標(biāo)簽”會進(jìn)入一個(gè)404頁面
只需要增加一個(gè)tags頁面杂拨,將頁面類型設(shè)置為tags 即可
先增加頁面
> hexo new page tags
INFO Validating config
INFO Created: D:\code\blog\blog1\source\tags\index.md
再修改頁面 ./source/tags/index.md ,設(shè)置類型
---
title: tags
date: 2024-07-24 22:18:58
type: "tags"
comments: false
---
上面菜單已經(jīng)配置好了悯衬,直接重啟看效果
配置Categories頁面
默認(rèn)也是沒有Categories頁面的
配置同 tags弹沽,type設(shè)置為:categories
增加頁面
hexo new page categories
頁面./source/categories/index.md 內(nèi)容修改為:
---
title: categories
date: 2024-07-24 22:29:50
type: "categories"
comments: false
---
配置About頁面
categories和tags是系統(tǒng)已經(jīng)定義好的類型,系統(tǒng)會自動(dòng)填充內(nèi)容到里面筋粗。
about頁面就不行了策橘,得自己寫
首先創(chuàng)建頁面
hexo new page about
然后再修改頁面:./source/about/index.md
內(nèi)容如:
---
title: about
date: 2024-07-22 22:40:20
---
### 關(guān)于我
程序員 主要做Java
----
### 關(guān)于本博客
2024年使用Hexo + Next 重建
帖子元數(shù)據(jù)設(shè)置
NexT 支持帖子創(chuàng)建日期、帖子更新日期和帖子類別顯示娜亿。
# Post meta display settings
post_meta:
item_text: true
created_at: true
updated_at:
enable: false
another_day: true
categories: true
關(guān)閉“更新于”
文章字?jǐn)?shù)統(tǒng)計(jì)
安裝:hexo-word-counter
npm install hexo-word-counter
hexo clean
Hexo配置(_config.yml)中增加:
#文章字?jǐn)?shù)和閱讀時(shí)間
symbols_count_time:
# 是否顯示文章的字符數(shù)
symbols: true
# 是否顯示文章的預(yù)計(jì)閱讀時(shí)間
time: true
# 是否顯示全部文章的總字符數(shù)(站點(diǎn)底部)
total_symbols: false
# 是否顯示全部文章總閱讀時(shí)間(站點(diǎn)底部)
total_time: true
# AWL 代表 Average Words per Line(每行的平均單詞數(shù))丽已,用于估算閱讀時(shí)間。通常用于更精確的閱讀時(shí)間估算买决。
awl: 4
# WPM 代表 Words Per Minute(每分鐘的單詞數(shù))沛婴,用于計(jì)算閱讀時(shí)間吼畏。
wpm: 275
Next中有默認(rèn)設(shè)置
symbols_count_time:
separated_meta: true
item_text_total: false
Next默認(rèn)顯示字?jǐn)?shù)和閱讀時(shí)長
其他設(shè)置
測試時(shí)注意:這些設(shè)置一般需要重啟服務(wù)后才能生效
回到頂部
back2top:
# 控制“返回頂部”按鈕是否啟用
enable: true
# 控制“返回頂部”按鈕是否顯示在側(cè)邊欄
sidebar: false
# 控制“返回頂部”按鈕上是否顯示滾動(dòng)百分比標(biāo)簽
scrollpercent: false
閱讀進(jìn)度條
reading_progress:
enable: true
啟用書簽支持
bookmark:
enable: true
用戶只需點(diǎn)擊頁面左上角的書簽圖標(biāo)即可保存滾動(dòng)位置。當(dāng)他們下次訪問你的博客時(shí)嘁灯,他們可以自動(dòng)恢復(fù)到上一次滾動(dòng)位置泻蚊。
深色模式
# Dark Mode
darkmode: false