hexo-theme-hydrogen

1 | 概述

前由 hexo-theme-starter 改进，后删除全部代码改用 stylus + pug 重写的轻量博客主题。

1 - 功能列表

1. [x] 基础页面 (index, post, about)
2. [x] 分类功能，附属页面 (category)
3. [x] 标签功能，附属页面 (tag, tags)
4. [x] 友情链接功能，附属页面 (friends)
5. [x] 搜索功能
6. [x] 暗色/亮色主题
7. [x] 评论系统
8. [x] 文章图片放大预览

2 | 依赖

以下是hydrogen主题所需要的依赖

• hexo-renderer-markdown-it 或者 hexo-renderer-marked
• hexo-renderer-pug
• hexo-renderer-stylus
• hexo-generator-index
• hexo-generator-tag
• hexo-generator-category
• hexo-generator-json-content

3 | 安装

通过git克隆下载主题文件

git clone https://github.com/CoderFrish/hexo-theme-hydrogen.git themes/hydrogen

通过npm下载主题文件

npm(pnpm/yarn) install hexo-theme-hydrogen

设置网页当前主题

- theme: 原来的主题
+ theme: hydrogen

4 | 如何使用

1 - 如何创建关于页

创建个index.md 在 source/about 文件夹里面，如果可以的话可以直接在 source 文件夹里面创建 about.md

以下是关于页的基本格式

---
layout: about
---

#{你的markdown内容}

2 - 关于如何使用数学表达式

如果你安装的是 hexo-renderer-marked 渲染器，那么请卸载掉它，并且安装 hexo-renderer-markdown-it 渲染器

安装指令

npm(yarn/pnpm) uninstall hexo-renderer-marked

npm(yarn/pnpm) install hexo-renderer-markdown-it

于此同时，安装katex支持数学公式的相关依赖

npm(yarn/pnpm) install katex @renbaoshuo/markdown-it-katex

在根目录的 _config.yml 配置文件中添加下行

+ markdown:
+   plugins:
+     - name: '@renbaoshuo/markdown-it-katex'

3 - 关于如何使用友链

在 source 文件夹里面创建 _data/friends.json

格式

[
  {
    "avatar": "图标",
    "description": "介绍",
    "url": "网址",
    "title": "标题"
  }
]

5 | 预期

1 - 未来会实现的功能列表

• 归档功能，附属页面 (archives, archive)
• 更多的通讯方式小部件

2 - 正在打算的事情

• 重新设计标签页
• 简化并优化代码