7 Star 59 Fork 3

Yue_plus / hexo-theme-arknights

加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
贡献代码
同步代码
取消
提示: 由于 Git 不支持空文件夾,创建文件夹后会生成空的 .keep 文件
Loading...
README
MIT

| 简体中文 | English | 日本語 |

hexo-theme-arknights

预览

如果使用了这个主题,欢迎在这儿贴预览链接~

主题预览图片

安装

环境

使用 hexo-cli 新建博客项目:

hexo init Hexo
cd Hexo
cnpm install
git clone https://github.com/Yue-plus/hexo-theme-arknights.git themes/arknights

安装依赖

npm 用户:

cnpm install hexo-server hexo-browsersync hexo-renderer-pug --save

yarn 用户:

yarn add hexo-server hexo-browsersync hexo-renderer-pug

修改配置文件

修改资源文件

可按需在 Hexo/source/ 目录添加以下文件:

  • CNAME: GitHub Pages 部署时的自定义域名
  • img/ 目录下的 Alipay.pngWeChat.png 为自己的收款二维码(1:1 比例的 png 图片);

可按需修改 Hexo/themes/arknights/source/ 目录下的:

  • favicon.ico:浏览器标签页上的图标(64*64,分辨率高了显示不出)
  • README.md: 部署仓库的 README

写作

  • 参考 写作 | Hexo

  • 在主题仓库的 Hexo 分支有一些 示例文本 可以取用

  • 添加文章标签与分类,更多特性可参考 Hexo | Front-matter ,示例:

    ---
    title: 'Hello World !'
    date: 2020-04-15 21:54:02
    tags: code
    category: Example
    ---
  • <!-- more --> 之前的内容称之为摘要,会显示在首页上,并且可以设置是否也在正文显示。

在导航栏中添加页面

  • 例如:新建一个 about 页面

    • Hexo 目录下执行 hexo new page 'about'
    • 然后 Hexo/source/ 目录下会多一个 about 文件夹
  • 编辑 Hexo/source/about/index.md 文件

  • 编辑 _config.arknights.yml,添加一个链接:

    menu:
      About: /about

禁止归档页翻页

该设置位于 Hexo 配置文件 _config.yml 约第 88 行。

# Pagination
## Set per_page to 0 to disable pagination
per_page: 10
pagination_dir: page

per_page: 改为 0 即可。

评论系统

Valine

本主题支持Valine 。 请参考 Valine 快速开始 修改 Hexo 目录下的 _config.arknights.yml 文件:

valine:
  enable: false
  app_id: # APP ID
  app_key: # APP KEY
  server_url: # APP DOMAIN(LeanCloud 国际版)

开启邮件提醒:zhaojun1998 / Valine-Admin

注意! 当 Valine 使用 LeanCloud 国际版 时,才需要配置 server_url:
该设置可在 LeanCloud 应用中的 设置 -> 应用凭证 -> 域名白名单 -> Request 域名 中找到以 .api.lncldglobal.com 结尾的域名,加上 https:// 前缀即可。

Gitalk

本主题支持 Gitalk 。 请参考 gitalk/readme-cn.md 修改 Hexo 目录下的 _config.arknights.yml 文件:

gitalk:
  enable: false
  client_id: # GitHub 应用 Client ID
  client_secret: # GitHub 应用 Client Secret
  repo: # 用于存放评论数据的 GitHub 仓库
  owner: # 该 GitHub 仓库所有者
  admin: [] # 具有写该 GitHub 仓库权限的用户
            # 例如: [adminA,adminB]
  id: # (可选) 页面的唯一标识
      # 例如: location.pathname

Waline

本主题支持 Waline
请参考 Waline 官方文档 修改 Hexo 目录下的 _config.arknights.yml 文件:

waline:
  enable: false 
  server_url: # Server_Url

Artalk

本主题支持 Artalk
请参考 Artalk 官方文档修改 Hexo 目录下的 _config.arknights.yml 文件:

artalk:
  enable: false
  server: https://artalk.server.instance/ # 你的 Artalk 服务地址
  site_name: My Blog # 站点名称,用于区分多个站点(可选)

数学公式

本主题支持两种方案显示数学公式:

方案一:静态渲染

可以使用 hexo-filter-mathjax Hexo 过滤器静态渲染,来显示数学公式。

建议先更换能更好处理数学公式的 markdown 渲染器 hexo-renderer-pandoc

  1. 在 Hexo 目录下执行以下指令:

    # 安装 hexo-filter-mathjax 插件
    cnpm install hexo-filter-mathjax --save
    # 清除缓存
    hexo clean
  2. 把以下内容添加到 Hexo/_config.yml 文件:

    mathjax:
      tags: none # 或 'ams' 或 'all'
      single_dollars: true # 启用单个美元符号作为内联(行内)数学公式定界符
      cjk_width: 0.9 # 相对 CJK 字符宽度
      normal_width: 0.6 # 相对正常(等宽)宽度
      append_css: true # 将 CSS 添加到每个页面
      every_page: false # 如果为 true,那么无论每篇文章的前题中的 `mathjax` 设置如何,每页都将由 mathjax 呈现
  3. 在需要启用 mathjax 的文章的 Front-matter 区内添加 mathjax: true

    ---
    title: On the Electrodynamics of Moving Bodies
    categories: Physics
    date: 1905-06-30 12:00:00
    mathjax: true
    ---

    然后,就可以在文章中使用 LaTeX 语法。

  4. 需要注意,内联数学公式(…… $<数学公式>$ ……)在开头 $ 之后和结尾 $ 之前不能有空格!例如:

    - $ \epsilon_0 $
    + $\epsilon_0$
    - $ \frac{\partial}{\partial t} $
    + $\frac{\partial}{\partial t}$
  5. 需要注意 LaTeX 与 Markdown 语法之间的冲突。如有必要,请使用 \ 进行转义:

    - $\epsilon_0$
    + $\epsilon\_0$
    - \begin{eqnarray*}
    + \begin{eqnarray\*}

方案二:动态渲染

本主题也支持 MathJax ,在用户浏览时动态渲染公式:

  1. 首先要卸载 Hexo 默认自带的 hexo-renderer-marked 渲染器,更换成对 MathJax 支持更好的 hexo-renderer-kramed 渲染器:

    npm uninstall hexo-renderer-marked --save
    npm install hexo-renderer-kramed --save
  2. 修改 Hexo 目录 下的 _config.arknights.yml 文件:

      # 公式支持
      mathjax:
    -   enable: false
    +   enable: true
      version: '2.6.1'  # 重要
  3. 然后,就可以在文章中使用 LaTeX 语法:

    % 单行内联公式
    % 注意需要两边带上 "`" ,且 "`" 与 "$" 之间不能有空格
    `$\sigma$`
    
    % 多行公式
    $$
    \begin{aligned}f(x) &= \sum_{i=1}^{\infty}{\frac{x}{2^i}} \\
    &= x\end{aligned}
    $$
  4. 用这种方案,不会造成 LaTeX 与 Markdown 语法之间的冲突。在文中使用 LaTeX 语法不需要转义。 以下公式可以直接使用,不会造成任何问题:

    \epsilon_0
    \begin{eqnarray*}

hexo-renderer-kramed 插件还有其他可配置项,请参考插件文档: https://github.com/sun11/hexo-renderer-kramed

几种公式显示方案各有优缺点:

  1. 动态渲染方案 LaTeX 语法不需要转义,能更好的支持从其他地方导出的 Markdown 文件。但因为需要在浏览器渲染,页面显示会略有延迟。
  2. 静态渲染方案将公式直接编译在静态文件里,显示性能更优,但语法需要转义。
  3. hexo-renderer-pandoc 快速显示公式而不必经历转义语法的麻烦,但需要安装 Pandoc。

图表支持

修改 Hexo 目录 下的 _config.arknights.yml 文件:

  # 图表支持
  mermaid:
-   enable: false
+   enable: true
    version: '8.13.5'

主题通过 mermaid-js 绘制各种图表。查看示例

支持: 流程图 | 序列图 | 类图 | 状态图 | 实体关系图 | 用户旅程图 | 甘特图 | 指令图 | 饼图

语法:

<div class="mermaid">
  graph LR
  A[Hard edge] -->|Link text| B(Round edge)
  B --> C{Decision}
  C -->|One| D[Result one]
  C -->|Two| E[Result two]
</div>

如果习惯使用 代码块 也完全支持。

字数/阅读时长统计

依赖 hexo-wordcount

npm 用户:

cnpm install hexo-wordcount --save

yarn 用户:

yarn add hexo-wordcount

之后修改 Hexo 目录 下的 _config.arknights.yml 文件:

post:
  count: true # 是否显示字数统计
  time: true # 是否显示阅读时长统计

浏览量统计

使用 不蒜子 进行浏览量统计。 修改 Hexo 目录 下的 _config.arknights.yml 文件启用该功能:

busuanzi:
  enable: false
  sitePV: true # 站点总访问量
  siteUV: true # 站点访客数
  pagePV: true # 页面访问量

文档加密

经过修改的 hexo-blog-encrypt 插件已适配并集成在本主题中(目前仅支持 default 与 up 主题)。

详细配置参考 hexo-blog-encrypt/ReadMe.zh.md

Hexo/_config.yml 文件中添加以下内容:

# Security
encrypt: # hexo-blog-encrypt
  abstract: 与 Rhodes Island™ 取得弱神经连接时需要口令
  message: 请输入与 Rhodes Island™ 取得弱神经连接时的口令:
  tags:
  - {name: tagName, password: 密码A}
  - {name: tagName, password: 密码B}
  wrong_pass_message: 与 Rhodes Island™ 效验口令失败,请重试。
  wrong_hash_message: 与 Rhodes Island™ 效验口令失败,当前使用临时权限查看。

在文章的 Front-matter 区内设置:

---
title: Hello World
tags:
- 作为日记加密
date: 2016-03-30 21:12:21
password: mikemessi
abstract: 与 Rhodes Island™ 取得弱神经连接时需要口令
message: 请输入与 Rhodes Island™ 取得弱神经连接时的口令:
wrong_pass_message: 与 Rhodes Island™ 效验口令失败,请重试。
wrong_hash_message: 与 Rhodes Island™ 效验口令失败,当前使用临时权限查看。
---

搜索

默认开启,若要关闭,在 Hexo/_config.arknights.yml 文件中:

search:
  enable: false

Front-matter

除了 Hexo 支持的 Front-matter 还支持:

# 文章页右上角发布/更新日期
post-info: true/false

# 侧边栏的目录
post-index: true/false

# 打赏框
reward: true/false

引入自定义 CSS/JS 文件

可以在 Hexo/source/css/ 目录下放入自己的 CSS 文件; 在 Hexo/source/js/ 目录下放入自己的 JavaScript 脚本文件;

然后修改 Hexo/_config.arknights.yml 文件:

  # 在 `<head>` 标签内引入 CSS 样式表
  stylesheets:
+ - /css/custom.css
  
  # 在 `<body>` 尾部引入 JavaScript 脚本
  scripts:
+ - /js/custom.js

资源文件夹是存放用户资源的地方。 除 _posts 文件夹之外,开头命名为 _ (下划线)的文件/文件夹和隐藏的文件将会被忽略。 Markdown 和 HTML 文件会被解析并放到 public 文件夹,而其他文件会被拷贝过去。

——来自 Hexo 官方文档

参与开发

欢迎提交 IssuesPR

分支说明

分支 说明
main 相对稳定的版本
gh-pages gh-page 托管
hexo Hexo 目录,这里有可以用于测试主题的 .md 文件

开发中可能遇见的问题及解决方法

修改 TS 文件不生效

TypeScript 需要手动编译,请全局安装 typescript 后在 arknights\source\js\_src 目录下执行 tsc 以编译。

运行 hexo serve --debug 时,长文章渲染不全

这是由热重载插件 hexo-browsersync 导致的,不会影响发布。

解决方法:禁用该插件。(反正不影响发布,不管也行)

参与开发可能需要的文档

贡献者

支援主题开发

喜欢这个主题的话可以:

  • 给颗小星星吧 (/▽\)
  • 开发者的B服ID:24444750
  • 加入 QQ 群:618221514

    群内开发为主,吹水晒卡,分享线索7也都欢迎哦~ d=====( ̄▽ ̄*)b

  • 打赏、赞助: 收款二维码
MIT License Copyright (c) 2020 Yue_plus Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

简介

明日方舟罗德岛阵营的 Hexo 主题,支持数学公式、Valine&Gitalk&Waline评论系统、Mermaid图表 展开 收起
MIT
取消

发行版

暂无发行版

贡献者

全部

近期动态

加载更多
不能加载更多了
TypeScript
1
https://gitee.com/yue_plus/hexo-theme-arknights.git
git@gitee.com:yue_plus/hexo-theme-arknights.git
yue_plus
hexo-theme-arknights
hexo-theme-arknights
main

搜索帮助