本配置内容参考 ShokaX 使用指南,再加上我的踩坑形成
话不多说直接进入正题
# 配置文件
需要更改配置文件 _config.yml
、 _config.shokax.yml
。
一下配置皆是经验主义,如果出现问题,哪里有问题就把配置放在两个配置文件里都试试。
# _config.yml
需要填写的地方皆用 {}
占位,需要更换 {}
为自己的内容
# Hexo Configuration | |
## Docs: https://hexo.io/docs/configuration.html | |
## Source: https://github.com/hexojs/hexo/ | |
# Site | |
title: {} #uyume 的记录本 | |
subtitle: {} #' 没有记录的记录本' | |
description: {} #' 记录想法和闲言碎语' | |
keywords: | |
author: {} #uyume | |
language: zh-CN | |
timezone: 'Asia/Shanghai' | |
# URL | |
## Set your site url here. For example, if you use GitHub Page, set url as 'https://username.github.io/project' | |
url: {} # http://yuan-uyume.github.io 你的部署地址 | |
permalink: :year/:month/:day/:title/ | |
permalink_defaults: | |
pretty_urls: | |
trailing_index: true # Set to false to remove trailing 'index.html' from permalinks | |
trailing_html: true # Set to false to remove trailing '.html' from permalinks | |
# Directory | |
source_dir: source | |
public_dir: public | |
tag_dir: tags | |
archive_dir: archives | |
category_dir: categories | |
code_dir: downloads/code | |
i18n_dir: :lang | |
skip_render: | |
# Writing | |
new_post_name: :title.md # File name of new posts | |
default_layout: post | |
titlecase: false # Transform title into titlecase | |
external_link: | |
enable: true # Open external links in new tab | |
field: site # Apply to the whole site | |
exclude: '' | |
filename_case: 0 | |
render_drafts: false | |
post_asset_folder: false | |
relative_link: false | |
future: true | |
highlight: | |
enable: false | |
line_number: true | |
auto_detect: false | |
tab_replace: '' | |
wrap: true | |
hljs: false | |
prismjs: | |
enable: false | |
preprocess: true | |
line_number: true | |
tab_replace: '' | |
# Home page setting | |
# path: Root path for your blogs index page. (default = '') | |
# per_page: Posts displayed per page. (0 = disable pagination) | |
# order_by: Posts order. (Order by date descending by default) | |
index_generator: | |
path: '' | |
per_page: 10 | |
order_by: -date | |
# Category & Tag | |
default_category: uncategorized | |
category_map: | |
tag_map: | |
# Metadata elements | |
## https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta | |
meta_generator: true | |
# Date / Time format | |
## Hexo uses Moment.js to parse and display date | |
## You can customize the date format as defined in | |
## http://momentjs.com/docs/#/displaying/format/ | |
date_format: YYYY-MM-DD | |
time_format: HH:mm:ss | |
## updated_option supports 'mtime', 'date', 'empty' | |
updated_option: 'mtime' | |
# Pagination | |
## Set per_page to 0 to disable pagination | |
per_page: 10 | |
pagination_dir: page | |
# Include / Exclude file(s) | |
## include:/exclude: options only apply to the 'source/' folder | |
include: | |
exclude: | |
ignore: | |
# Extensions | |
## Plugins: https://hexo.io/plugins/ | |
## Themes: https://hexo.io/themes/ | |
theme: shokax | |
# Deployment | |
## Docs: https://hexo.io/docs/one-command-deployment | |
deploy: | |
type: git | |
repo: {} # git@github.com: 用户名 / 仓库名.git | |
branch: {} # master 分支名 | |
algolia: | |
appId: {} # 你的应用 id | |
apiKey: {} # 你的 only search apiky | |
adminApiKey: {} # 你的 adminApiKey | |
chunkSize: 5000 | |
indexName: {} # 你的 index 名称 | |
fields: | |
- title | |
- path | |
- categories | |
- content:strip:truncate,0,2000 | |
- gallery | |
- photos | |
- tags | |
markdown: | |
render: # 渲染器设置 | |
html: true # 过滤 HTML 标签 | |
xhtmlOut: true # 使用 '/' 来闭合单标签 (比如 <br />)。 | |
breaks: true # 转换段落里的 '\n' 到 <br>。 | |
linkify: true # 将类似 URL 的文本自动转换为链接。 | |
typographer: | |
quotes: '“”‘’' | |
plugins: # markdown-it 插件设置 | |
- plugin: | |
name: markdown-it-toc-and-anchor | |
enable: true | |
options: # 文章目录以及锚点应用的 class 名称,shoka 系主题必须设置成这样 | |
tocClassName: 'toc' | |
anchorClassName: 'anchor' | |
- plugin: | |
name: markdown-it-multimd-table | |
enable: true | |
options: | |
multiline: true | |
rowspan: true | |
headerless: true | |
- plugin: | |
name: ./markdown-it-furigana | |
enable: true | |
options: | |
fallbackParens: "()" | |
- plugin: | |
name: ./markdown-it-spoiler | |
enable: true | |
options: | |
title: "你知道得太多了" | |
autoprefixer: | |
exclude: | |
- '*.min.css' | |
minify: | |
html: | |
enable: true | |
exclude: # 排除 hexo-feed 用到的模板文件 | |
- '**/json.ejs' | |
- '**/atom.ejs' | |
- '**/rss.ejs' | |
css: | |
enable: true | |
exclude: | |
- '**/*.min.css' | |
js: | |
enable: true | |
mangle: | |
toplevel: true #如果 js 压缩错误请删除此行 | |
output: | |
compress: | |
ecma: 2018 | |
exclude: | |
- '**/*.min.js' | |
feed: | |
limit: 20 | |
order_by: "-date" | |
tag_dir: false | |
category_dir: false | |
rss: | |
enable: true | |
template: "node_modules/hexo-theme-shokax/layout/_alternate/rss.ejs" | |
output: "rss.xml" | |
atom: | |
enable: true | |
template: "node_modules/hexo-theme-shokax/layout/_alternate/atom.ejs" | |
output: "atom.xml" | |
jsonFeed: | |
enable: true | |
template: "node_modules/hexo-theme-shokax/layout/_alternate/json.ejs" | |
output: "feed.json" |
# _config.shokax.yml
darkmode: true # 黑暗模式 | |
auto_scroll: true # 自动滚动到上次浏览处 | |
experiments: | |
optimizeLongPosts: false # 长文章优化 | |
alternate: {} # 'Yuan u Yume' | |
# category_map: | |
# 指北: zhibei | |
# categories: | |
# - [指北] | |
# 侧边栏 | |
sidebar: | |
position: right | |
avatar: avatar.jpg # 头衔,位置为 /source/_data/assets/avatar.jpg | |
# 社交链接 | |
social: | |
#github: https://github.com/yourname || github || "#191717" | |
#google: https://plus.google.com/yourname || google | |
#twitter: https://twitter.com/yourname || twitter || "#00aff0" | |
#zhihu: https://www.zhihu.com/people/yourname || zhihu || "#1e88e5" | |
#music: https://music.163.com/#/user/home?id=yourid || cloud-music || "#e60026" | |
#weibo: https://weibo.com/yourname || weibo || "#ea716e" | |
#about: https://about.me/yourname || address-card || "#3b5998" | |
#email: mailto:xxx@xx.com || envelope || "#55acd5" | |
#facebook: https://www.facebook.com/yourname || facebook | |
# stackoverflow: https://stackoverflow.com/ || stack-overflow | |
#youtube: https://youtube.com/yourname || youtube | |
#instagram: https://instagram.com/yourname || instagram | |
#skype: skype:yourname?call|chat || skype | |
#douban: https://www.douban.com/people/yourname/ || douban | |
widgets: | |
random_posts: true # 随机文章 | |
recent_comments: true # 显示最近评论 | |
# 页尾全站统计 | |
footer: | |
since: 2023 # 开始时间 | |
count: true # 开启 | |
# 文章界面统计 | |
post: | |
count: true # 开启 | |
performance: | |
# 使用 preconnect 预加载的网址 (不建议超过三个) | |
preConnect: | |
- "https://lf9-cdn-tos.bytecdntp.com" | |
# 使用 dns-prefetch 预解析的网址 | |
dnsPrefetch: | |
- "https://cdn.jsdelivr.net" | |
- "https://unpkg.com" | |
waline: | |
enable: true # 是否启用 | |
serverURL: {} #你部署 waline 服务的地址 例如 waline.vercel.app |
# 评论系统
评论系统我觉得是要拿出来单独说说的
首先,waline 评论系统应该拆成两部分来理解。一是 waline 的功能服务。二是储存服务。
# waline 功能服务
将 waline 部署到 serverless 提供商,获取应用地址填入配置文件,即 waline.serverURL
处。
waline:
enable: true # 是否启用
serverURL: {} #你部署waline服务的地址 例如 waline.vercel.app
网上的 serverless 服务提供商有很多,国内大牌的腾讯云、阿里云等都有提供该服务。不过咱们这里只说说免费的,也不用我说,直接参考 waline 的官方文档即可。waline 的官方文档
值得注意的是 waline 的官方文档中部署到 vercel 的文章默认使用的数据库是 LeanCloud,其中提到设置 Environment Variables 时所用变量皆为 LeanCloud 的配置。此处变量可填写其他数据库的配置。其他数据库的配置
# 储存服务
通过在服务提供商申请免费的云数据库来储存 waline 系统的评论。此处不提供服务提供商推荐,但可参考 waline 的官方部署文档。
# 封面随机图片
/source/_data/images.yml
- https://tc.mwm.moe/i/1/2023/06/17/648d587d65182.jpg | |
- https://tc.mwm.moe/i/1/2023/06/17/648d5886e5359.jpg | |
- https://tc.mwm.moe/i/1/2023/06/17/648d588b262cb.jpg | |
- https://tc.mwm.moe/i/1/2023/06/17/648d588ede725.png | |
- https://tc.mwm.moe/i/1/2023/05/02/6450f81509438.jpg | |
- https://tc.mwm.moe/i/1/2023/05/02/6450f8543a392.jpg | |
- https://tc.mwm.moe/i/1/2023/05/02/6450f8559c343.jpg | |
- https://tc.mwm.moe/i/1/2023/05/02/6450f9bb27870.jpg | |
- https://tc.mwm.moe/i/1/2023/05/02/6450f9bae95f6.jpg | |
- https://tc.mwm.moe/i/1/2023/05/02/6450f9bc4db32.jpg | |
- https://tc.mwm.moe/i/1/2023/05/02/6450f9bd85e48.jpg | |
- https://tc.mwm.moe/i/1/2023/05/02/6450f9c10a4bb.jpg | |
- https://tc.mwm.moe/i/1/2023/05/02/6450f9c17a948.jpg | |
- https://tc.mwm.moe/i/1/2023/04/22/6443a7e74fc63.jpeg | |
- https://tc.mwm.moe/i/1/2023/05/11/645c70451a689.jpg | |
- https://tc.mwm.moe/i/1/2023/05/11/645c704765a26.jpg | |
- https://tc.mwm.moe/i/1/2023/05/11/645c704ad4dc3.jpg | |
- https://tc.mwm.moe/i/1/2023/05/11/645c70521331b.jpg | |
- https://tc.mwm.moe/i/1/2023/05/11/645c7057a99b8.jpg | |
- https://tc.mwm.moe/i/1/2023/07/30/64c63b0271100.jpg |
通过随机图床 api 获取图片 @二次元随机图片 API,随机图片列表
# 网络问题可能会导致的问题
# 点击大图图标位置错位
粗鄙的解决办法
将如上加载失败的 css 文件下载下来直接在主题文件夹 hexo-theme-shokax\source\css\app.styl
中引入
# 本站所用网站
- github 部署 hexo、储存图片 (可能需要魔法)
- vercel 部署 hexo、waline (可能需要魔法)
- railway 部署数据库
- algolia 搜索服务