hexo-theme-reimu

一款博丽灵梦风格的Hexo主题
融合了landscape、Tangyuxian和Shoka三个主题

Demo

English README

欢迎提交ISSUE和PR！

进展

• waline评论系统
• twikoo评论系统（未测试）
• gitalk评论系统（未测试）
• giscus评论系统（未测试）
• 黑夜模式（实验性）
• 更多动画效果
• google字体
• 加载动画

截图

结构

.
├── _screenshot 截图
├── _example    示例source文件夹内结构
├── _config.yml 主题配置
├── languages
├── layout
├── scripts
└── source

安装

使用npm

npm install hexo-theme-reimu --save

或直接克隆本仓库至/themes文件夹下并重命名为reimu

git clone https://github.com/D-Sketon/hexo-theme-reimu.git

并修改 _config.yml 中的theme

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: reimu

使用

基本结构

为了保证显示正确，请参考 _example 在 _source 中分别建立 _data、about 和 friend 文件夹

_data

• avatar 文件夹中存储作者头像，默认命名 avatar.jpg，可在 内层 _config.yml 中做如下配置

avatar: "avatar.jpg" # 默认就是在avatar文件夹内寻找，请不要包含路径，否则会404

• covers 文件夹中存储文章封面
• covers.yml 中存储文章封面url

about

index.md 作为关于页面

friend

index.md 作为友链页面，在 _data.yml 中填入友链信息即可在页面上显示对应好友卡片

封面、头图和图标

封面

封面显示逻辑如下

• 如果文章的Front matter中包含cover的url，则该文章头图和首页缩略图均显示该url

---
title: Hello World
cover: https://example.com
---

• 如果文章的Front matter中包含cover为false，则该文章不显示头图（首页上仍然是随机图片）

---
title: Hello World
cover: false
---

• 如果文章的Front matter中包含cover为rgb(xxx,xxx,xxx)，则该文章头图为对应的渐变纯色（首页上仍然是随机图片）

---
title: Hello World
cover: rgb(255,117,117)
---

• 否则查找 covers 文件夹和 covers.yml，并从中随机挑选图片
• 若上述文件均不存在，则显示头图

头图

头图保存于 themes/reimu/source/images/banner.jpg，可在内层 _config.yml中修改

banner: "/images/banner.jpg"

图标

图标保存于 themes/reimu/source/images/favicon.ico，可在内层 _config.yml中修改

favicon: "/images/favicon.ico"

置顶

在文章的Front-matter中添加 sticky: true

---
title: Hello World
sticky: true
---

代码高亮

为保证代码块的正确显示，请保证外层 _config.yml 中为如下配置

highlight:
  enable: true
  wrap: true
  hljs: false
prismjs:
  enable: false

站内评论

若基于 Valine
请参考其官方文档完成 LeanCloud 的配置，并在内层 _config_yml 中将 valine.enable 改为 true，并填入自己的 appId 和 appKey

valine:
  enable: true
  appId: 'your appId'
  appKey: 'your appKey'

若基于 Waline
请参考其官方文档完成 LeanCloud 的配置，并在内层 _config_yml 中将 waline.enable 改为 true，并填入自己的 serverURL

waline:
  enable: true
  serverURL: 'your server url'
  lang: zh-CN
  locale: {} # https://waline.js.org/guide/features/i18n.html#%E8%87%AA%E5%AE%9A%E4%B9%89%E8%AF%AD%E8%A8%80
  emoji:
    - https://unpkg.com/@waline/emojis@1.0.1/weibo
    - https://unpkg.com/@waline/emojis@1.0.1/alus
    - https://unpkg.com/@waline/emojis@1.0.1/bilibili
    - https://unpkg.com/@waline/emojis@1.0.1/qq
    - https://unpkg.com/@waline/emojis@1.0.1/tieba
    - https://unpkg.com/@waline/emojis@1.0.1/tw-emoji
  meta: 
    - nick
    - mail
    - link
  requiredMeta:
    - nick
    - mail
  wordLimit: 0
  pageSize: 10

若基于 twikoo
请参考其官方文档完成 腾讯云 或 Vercel 部署，并在内层 _config_yml 中将 twikoo.enable 改为 true，并填入自己的 envId

twikoo:
  enable: true
  envId:  # 腾讯云环境填 envId；Vercel 环境填地址（https://xxx.vercel.app）
  region: 

站内搜索

站内搜索基于 Algolia，请安装 hexo-algolia

npm install hexo-algolia --save

并参考其 README 和 为Hexo增加algolia搜索功能 完成对 Algolia 账号的配置，并在外层 _confg.yml 中添加如下配置

algolia:
  applicationID: 'your applicationID'
  apiKey: 'your apiKey'
  adminApiKey: 'your adminApiKey'
  indexName: 'your indexName'
  chunkSize: 5000

在内层 _config_yml 中将 algolia_search.enable 改为 true

algolia_search:
  enable: true

注意：搜索跳转链接为永久链接，所以请保证外层 _config.yml 中的 url 填写正确

数学公式

数学公式基于 Katex，请安装 hexo-renderer-markdown-it-plus

npm uninstall hexo-renderer-marked --save
npm install hexo-renderer-markdown-it-plus --save

在内层 _config_yml 中将 math.enable 改为 true

math:
  enable: true

Mermaid

请安装 hexo-filter-mermaid-diagrams

npm install hexo-filter-mermaid-diagrams --save

在内层 _config_yml 中将 mermaid.enable 改为 true

mermaid:
  enable: true

RSS

请安装 hexo-generator-feed

npm install hexo-generator-feed --save

并参考其 README 在外层 _config.yml 完成对 feed 的配置
在内层 _config.yml 中填入生成的 xml

rss: atom.xml

许可