diff --git a/atom.xml b/atom.xml index 34d2f6a65..7836647b6 100644 --- a/atom.xml +++ b/atom.xml @@ -38,7 +38,7 @@ https://volantis.js.org/blogs/2021-4-14-photos/ 2021-04-14T00:00:00.000Z - 2021-05-11T15:17:11.735Z + 2021-05-17T08:08:37.075Z 经过折腾，目前相册功能可用了，就是还不支持分类和懒加载，等后续完善吧。

]]> @@ -57,7 +57,7 @@ https://volantis.js.org/blogs/2021-4-1-hls/ 2021-04-01T00:00:00.000Z - 2021-05-11T15:17:11.735Z + 2021-05-17T08:08:37.075Z 在文章中插入m3u8视频的时候，由于Chrome等浏览器原生播放不了这种格式，所以需要添加hls.js等让其支持播放，如果你也遇到了这样的问题就来看看吧。

]]> @@ -76,7 +76,7 @@ https://volantis.js.org/blogs/2021-3-31-highlightjs/ 2021-03-31T00:00:00.000Z - 2021-05-11T15:17:11.735Z + 2021-05-17T08:08:37.075Z 在使用主题内的highlightjs的时候，你是否也遇到了它不换行、没有行号等问题？点进来看看吧。

]]> @@ -95,7 +95,7 @@ https://volantis.js.org/blogs/2021-2-30-slider/ 2021-03-30T00:00:00.000Z - 2021-05-11T15:17:11.735Z + 2021-05-17T08:08:37.075Z 这篇教程是基于heson大佬的这篇 给Hexo Volantis主题添加图片轮播功能 创作的，由我将新的轮播模板迁移至主题内，由inkss大佬完善。在这感谢两位大佬，如果你也需要轮播插件，就进来看看吧。

]]> @@ -114,7 +114,7 @@ https://volantis.js.org/blogs/2021-3-7-framei8/ 2021-03-07T00:00:00.000Z - 2021-05-11T15:17:11.735Z + 2021-05-17T08:08:37.075Z 我在主题文档中看到了frame标签，可以更高大上得展示我们的截图/录屏等。可是目前主题内仅内置了一个iPhone11的框架，想要使用其他的框架就得对齐修改，我经过折腾基本实现了，写下了这篇文章。

]]> @@ -280,7 +280,7 @@ https://volantis.js.org/blogs/2020-07-03-valine/ 2020-07-03T00:00:00.000Z - 2021-05-11T15:17:11.735Z + 2021-05-17T08:08:37.075Z Valine 评论由于可以匿名，发言成本低、质量低，使用 app 可以方便的删除垃圾评论。

操作演示

App 只支持数据存储于 LeanCloud 的评论系统。

App 登录前需要配置 AppID 和 AppKey，由于字符比较长，输入不方便，所以支持 URL Scheme 配置。将 URL 生成一个二维码，然后用手机扫码就可以打开 App 并自动配置好。

格式为：

valine://cfg/id=7yIoRlSmfX09vQCERsuWzFnx-MdYXbMMI&key=3zCL5GFePTUjwbqLop44QFbr&alias=测试项目

也可以把管理员用户的账号和密码配置上，扫码直接登录，但是注意不要泄露出去：

valine://cfg/id=7yIoRlSmfX09vQCERsuWzFnx-MdYXbMMI&key=3zCL5GFePTUjwbqLop44QFbr&alias=测试项目&user=me@xaoxuu.com&psw=q

注意：这个管理员用户并不是 LeanCloud 的账号，而是当前 Valine 数据库中的 _User 表中的一个用户，可以在 App 中注册，然后在 LeanCloud 上把注册的用户设置为管理员。

设置管理员的方法：在 _Role 表中新建一个 admin 角色，然后在 admin 角色的 users 列中点击 Relations 把自己刚注册的用户添加进去，这个用户就有了修改和删除评论数据的权限。

App 测试版地址

Valine for iOS Valine for Android
]]> @@ -316,7 +316,7 @@ https://volantis.js.org/news/2020-04-04/ 2020-04-04T00:00:00.000Z - 2021-05-11T15:17:11.735Z + 2021-05-17T08:08:37.075Z 由于主题目前仍处于青少年阶段，更新迭代速度比较快，所以不会保留旧版本的文档，如果需要查看旧版本的文档，请下载主题文档的源码，回退到旧版本，本地运行查看。

]]> @@ -339,7 +339,7 @@ https://volantis.js.org/news/2020-03-10-2.0/ 2020-03-10T00:00:00.000Z - 2021-05-11T15:17:11.735Z + 2021-05-17T08:08:37.075Z 本次更新内容非常多，主要升级了导航栏、使用新的语言重写了全部样式。旧版本 Volantis 用户，请您卸载掉旧的样式渲染插件，并安装新的：

  1. 卸载 less

    npm uninstall hexo-renderer-less --save

  2. 安装 stylus

    npm install hexo-renderer-stylus --save

新功能

导航栏

导航栏获得了史诗级的增强，可以设置N级子菜单。考虑到实用性，不太建议使用过多或者过深的菜单（超出屏幕的部分无法被看到）。

样式设置

现在可以在主题配置文件中设置更多的样式：

封面

封面可以在主题配置文件中设置在首页、归档页面、其它页面默认是否显示。
封面中可以同时显示logo图片、标题、副标题了。

小部件

grid小部件可以设置 fixed: true 来固定网格宽度（适合文字长短不一的场景）。

其它

可以设置「评论」的标题和副标题。
可以创建多种颜色的折叠框。
友链增加分组描述。

功能调整与优化

样式渲染器

使用 stylus 重写了所有样式，无需安装less插件了。相较于1.7.4，css文件体积缩小了19.75%。

主题配置文件

]]> @@ -364,7 +364,7 @@ https://volantis.js.org/news/2020-03-06-2.0-beta/ 2020-03-06T19:43:00.000Z - 2021-05-11T15:17:11.735Z + 2021-05-17T08:08:37.075Z Beta6
Beta5
  • 导航栏二级N级菜单
  • 支持微信二维码分享（需安装二维码生成插件）
Beta4
  • 优化样式
  • 更多样式可以在主题配置文件中自定义
  • 调整主题配置文件
Beta3
  • 优化样式
  • grid 部件新增 fixed: true 参数，用于固定宽度。
Beta2
  • 可以创建多种颜色的折叠框
  • 友链增加分组描述
Beta1
  • 新版本使用 stylus 完全重写了样式。
  • 可在主题配置文件中修改配色、标题等多种样式（需要关闭CDN）。
    已知的BUG有：
  • Container左侧的图标（图片）始终显示不出来，原因未知。
>div.info
  background-color: alpha($color-mac-cyan, 20%)
  border-left: $borderradius-codeblock solid $color-mac-cyan
  border-radius: $borderradius-codeblock
  >:before
    ...(省略无关代码)
    background-size: 16px 16px
    background-position: 4px 4px
    background-repeat: no-repeat
    background-color: $color-mac-cyan
    background-image: url("data:image/svg+xmlbase64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHdpZHRoPSIxNzkyIiBoZWlnaHQ9IjE3OTIiIHZpZXdCb3g9IjAgMCAxNzkyIDE3OTIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTEyMTYgMTM0NHYxMjhxMCAyNi0xOSA0NXQtNDUgMTloLTUxMnEtMjYgMC00NS0xOXQtMTktNDV2LTEyOHEwLTI2IDE5LTQ1dDQ1LTE5aDY0di0zODRoLTY0cS0yNiAwLTQ1LTE5dC0xOS00NXYtMTI4cTAtMjYgMTktNDV0NDUtMTloMzg0cTI2IDAgNDUgMTl0MTkgNDV2NTc2aDY0cTI2IDAgNDUgMTl0MTkgNDV6bS0xMjgtMTE1MnYxOTJxMCAyNi0xOSA0NXQtNDUgMTloLTI1NnEtMjYgMC00NS0xOXQtMTktNDV2LTE5MnEwLTI2IDE5LTQ1dDQ1LTE5aDI1NnEyNiAwIDQ1IDE5dDE5IDQ1eiIgZmlsbD0iI2ZmZiIvPjwvc3ZnPg==")

我试过把url里面的内容换成网络图片的URL是可以正常显示的。
源码在： themes/volantis/source/css/_third-party/container.styl

]]> diff --git a/blogs/2020-07-03-valine/index.html b/blogs/2020-07-03-valine/index.html index d360774cf..6ec38cb53 100644 --- a/blogs/2020-07-03-valine/index.html +++ b/blogs/2020-07-03-valine/index.html @@ -1 +1 @@ -如何快速优雅地删除 Valine 的垃圾评论 - Volantis

如何快速优雅地删除 Valine 的垃圾评论

Mr. X

进阶玩法

发布于：2020年7月3日

次浏览

Valine 评论由于可以匿名，发言成本低、质量低，使用 app 可以方便的删除垃圾评论。

操作演示

App 只支持数据存储于 LeanCloud 的评论系统。

App 登录前需要配置 AppID 和 AppKey，由于字符比较长，输入不方便，所以支持 URL Scheme 配置。将 URL 生成一个二维码，然后用手机扫码就可以打开 App 并自动配置好。

格式为：

valine://cfg/id=7yIoRlSmfX09vQCERsuWzFnx-MdYXbMMI&key=3zCL5GFePTUjwbqLop44QFbr&alias=测试项目

也可以把管理员用户的账号和密码配置上，扫码直接登录，但是注意不要泄露出去：

valine://cfg/id=7yIoRlSmfX09vQCERsuWzFnx-MdYXbMMI&key=3zCL5GFePTUjwbqLop44QFbr&alias=测试项目&user=me@xaoxuu.com&psw=q

注意：这个管理员用户并不是 LeanCloud 的账号，而是当前 Valine 数据库中的 _User 表中的一个用户，可以在 App 中注册，然后在 LeanCloud 上把注册的用户设置为管理员。

设置管理员的方法：在 _Role 表中新建一个 admin 角色，然后在 admin 角色的 users 列中点击 Relations 把自己刚注册的用户添加进去，这个用户就有了修改和删除评论数据的权限。

App 测试版地址

Valine for iOS Valine for Android

博客内容遵循 署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 协议

本文永久链接是：https://volantis.js.org/blogs/2020-07-03-valine/

本页文档最后更新于：2021年5月11日

评论

\ No newline at end of file +如何快速优雅地删除 Valine 的垃圾评论 - Volantis

如何快速优雅地删除 Valine 的垃圾评论

Mr. X

进阶玩法

发布于：2020年7月3日

次浏览

Valine 评论由于可以匿名，发言成本低、质量低，使用 app 可以方便的删除垃圾评论。

操作演示

App 只支持数据存储于 LeanCloud 的评论系统。

App 登录前需要配置 AppID 和 AppKey，由于字符比较长，输入不方便，所以支持 URL Scheme 配置。将 URL 生成一个二维码，然后用手机扫码就可以打开 App 并自动配置好。

格式为：

valine://cfg/id=7yIoRlSmfX09vQCERsuWzFnx-MdYXbMMI&key=3zCL5GFePTUjwbqLop44QFbr&alias=测试项目

也可以把管理员用户的账号和密码配置上，扫码直接登录，但是注意不要泄露出去：

valine://cfg/id=7yIoRlSmfX09vQCERsuWzFnx-MdYXbMMI&key=3zCL5GFePTUjwbqLop44QFbr&alias=测试项目&user=me@xaoxuu.com&psw=q

注意：这个管理员用户并不是 LeanCloud 的账号，而是当前 Valine 数据库中的 _User 表中的一个用户，可以在 App 中注册，然后在 LeanCloud 上把注册的用户设置为管理员。

设置管理员的方法：在 _Role 表中新建一个 admin 角色，然后在 admin 角色的 users 列中点击 Relations 把自己刚注册的用户添加进去，这个用户就有了修改和删除评论数据的权限。

App 测试版地址

Valine for iOS Valine for Android

博客内容遵循 署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 协议

本文永久链接是：https://volantis.js.org/blogs/2020-07-03-valine/

本页文档最后更新于：2021年5月17日

评论

\ No newline at end of file diff --git a/blogs/2021-2-30-slider/index.html b/blogs/2021-2-30-slider/index.html index 92175da0e..0c00d85ba 100644 --- a/blogs/2021-2-30-slider/index.html +++ b/blogs/2021-2-30-slider/index.html @@ -1 +1 @@ -为volantis主题添加图片轮播和热门文章 - Volantis
\ No newline at end of file +为volantis主题添加图片轮播和热门文章 - Volantis
\ No newline at end of file diff --git a/blogs/2021-3-31-highlightjs/index.html b/blogs/2021-3-31-highlightjs/index.html index c3b9dad82..4812ae60c 100644 --- a/blogs/2021-3-31-highlightjs/index.html +++ b/blogs/2021-3-31-highlightjs/index.html @@ -1 +1 @@ -volantis主题修改代码高亮样式 - Volantis
\ No newline at end of file +volantis主题修改代码高亮样式 - Volantis
\ No newline at end of file diff --git a/blogs/2021-3-7-framei8/index.html b/blogs/2021-3-7-framei8/index.html index fe24df693..035cc1088 100644 --- a/blogs/2021-3-7-framei8/index.html +++ b/blogs/2021-3-7-framei8/index.html @@ -1 +1 @@ -使用volantis更优雅地展示截图/录屏 - Volantis

使用volantis更优雅地展示截图/录屏

GOOPHER

进阶玩法

发布于：2021年3月7日

次浏览

我在主题文档中看到了frame标签，可以更高大上得展示我们的截图/录屏等。可是目前主题内仅内置了一个iPhone11的框架，想要使用其他的框架就得对齐修改，我经过折腾基本实现了，写下了这篇文章。

去源站阅读

博客内容遵循 署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 协议

本文永久链接是：https://volantis.js.org/blogs/2021-3-7-framei8/

本页文档最后更新于：2021年5月11日

评论

\ No newline at end of file +使用volantis更优雅地展示截图/录屏 - Volantis

使用volantis更优雅地展示截图/录屏

GOOPHER

进阶玩法

发布于：2021年3月7日

次浏览

我在主题文档中看到了frame标签，可以更高大上得展示我们的截图/录屏等。可是目前主题内仅内置了一个iPhone11的框架，想要使用其他的框架就得对齐修改，我经过折腾基本实现了，写下了这篇文章。

去源站阅读

博客内容遵循 署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 协议

本文永久链接是：https://volantis.js.org/blogs/2021-3-7-framei8/

本页文档最后更新于：2021年5月17日

评论

\ No newline at end of file diff --git a/blogs/2021-4-1-hls/index.html b/blogs/2021-4-1-hls/index.html index d9ca68b35..c1c06ea01 100644 --- a/blogs/2021-4-1-hls/index.html +++ b/blogs/2021-4-1-hls/index.html @@ -1 +1 @@ -为volantis添加hls.js以在Chrome上播放m3u8视频 - Volantis

为volantis添加hls.js以在Chrome上播放m3u8视频

GOOPHER

进阶玩法

发布于：2021年4月1日

次浏览

在文章中插入m3u8视频的时候，由于Chrome等浏览器原生播放不了这种格式，所以需要添加hls.js等让其支持播放，如果你也遇到了这样的问题就来看看吧。

去源站阅读

博客内容遵循 署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 协议

本文永久链接是：https://volantis.js.org/blogs/2021-4-1-hls/

本页文档最后更新于：2021年5月11日

评论

\ No newline at end of file +为volantis添加hls.js以在Chrome上播放m3u8视频 - Volantis

为volantis添加hls.js以在Chrome上播放m3u8视频

GOOPHER

进阶玩法

发布于：2021年4月1日

次浏览

在文章中插入m3u8视频的时候，由于Chrome等浏览器原生播放不了这种格式，所以需要添加hls.js等让其支持播放，如果你也遇到了这样的问题就来看看吧。

去源站阅读

博客内容遵循 署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 协议

本文永久链接是：https://volantis.js.org/blogs/2021-4-1-hls/

本页文档最后更新于：2021年5月17日

评论

\ No newline at end of file diff --git a/blogs/2021-4-14-photos/index.html b/blogs/2021-4-14-photos/index.html index bb57af485..aa4d38531 100644 --- a/blogs/2021-4-14-photos/index.html +++ b/blogs/2021-4-14-photos/index.html @@ -1 +1 @@ -为volantis添加瀑布流相册 - Volantis
\ No newline at end of file +为volantis添加瀑布流相册 - Volantis
\ No newline at end of file diff --git a/content.json b/content.json index eeea33045..05091e306 100644 --- a/content.json +++ b/content.json @@ -1 +1 @@ -{"meta":{"title":"Volantis","subtitle":"","description":"Volantis 是一个功能丰富、高度模块化的 Hexo 博客主题。得益于其强大的模块化特性，您可以轻松搭建一个极简风格的博客，也可以仿照官网搭建一个多人协作的、包含文档模块的大体量综合型博客。","author":"Volantis Team","url":"https://volantis.js.org","root":"/"},"pages":[{"title":"","date":"2021-05-11T15:17:11.735Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"404.html","permalink":"https://volantis.js.org/404","excerpt":"","text":"404 很抱歉，您访问的页面不存在 可能是输入地址有误或该地址已被删除"},{"title":"鸣谢项目和社区贡献者","date":"2021-05-11T15:17:11.735Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"contributors/index.html","permalink":"https://volantis.js.org/contributors/","excerpt":"Volantis 社区的发展离不开团队大佬们的无私奉献和社区小伙伴们的热情互助。每一个心怀梦想、有着独特见解的朋友都可以成为团队的一员。目前 Volantis 社区正处于建设初期，我们缺少各方面的人才，如果您使用主题至少一个月且长期活跃于社区，例如： 解答 issues / discussions 提交有效的建议 官网文档补全/纠错 发现并收录有意思的文章（搭建博客方面）到官网 我们非常欢迎您的加入，请在论坛发帖告诉我们。","text":"Volantis 社区的发展离不开团队大佬们的无私奉献和社区小伙伴们的热情互助。每一个心怀梦想、有着独特见解的朋友都可以成为团队的一员。目前 Volantis 社区正处于建设初期，我们缺少各方面的人才，如果您使用主题至少一个月且长期活跃于社区，例如： 解答 issues / discussions 提交有效的建议 官网文档补全/纠错 发现并收录有意思的文章（搭建博客方面）到官网 我们非常欢迎您的加入，请在论坛发帖告诉我们。 感谢开发者 感谢社区建设者 如何参与社区建设社区建设主要包括 Issues Discussions(论坛) 官网博客收录 官网文档维护 几个方面。 如何维护文档目前 Volantis 4.x 已是已知的 Hexo 主题中文档最全面的，但仍有部分功能缺少明确的文档、部分文档已经过时，如果您发现了遗漏或者错误之处，我们非常希望您能够帮忙完善一下。 Volantis 官网支持 CI ，您可以直接在线编辑源码： 在线编辑文档https://github.com/volantis-x/community/tree/master/source 如何收录博客每位用户在使用或更新主题的时候都需要阅读官网的文档，收录的相关内容能帮助用户更高效地上手，同时也能够提高被收录的文章的曝光率。如果在官网能看到更多的有价值的文章，就会有更多 Volantis 用户或者非 Volantis 用户来访问。 如果您有或者发现了与 Hexo 博客搭建相关的文章，可以转载外链到 Volantis 官网，示例如下： _posts/blogs/2020-05-17-pjax.md---title: Volantis 主题部署 Pjaxdate: 2020-05-17updated: 2020-08-07categories: [开发心得]author: inksslink: https://inkss.cn/blog/76993423/description: 本篇文章记录了我对 Volantis 主题做 Pjax 兼容的种种，大抵算是种记录吧~headimg: # 可以设置文章头图backup: https://archive.vn/U36NG # 将页面存档到 archive.tody 网页快照档案馆的存档链接 https://archive.tody--- 如果这篇文章的作者是第一次出现在官网，还需要在 _data/author.yml 文件中添加作者信息，例如： _data/author.yml...inkss: name: 枋柚梓 avatar: https://cdn.jsdelivr.net/gh/inkss/common@1.4.2/hexo/img/static/avatar.jpg url: https://inkss.cn 注意事项文章存放在 _posts/blogs/ 目录中，且文件名格式为「年-月-日-文章话题」。鼓励原创文章，摘要部分300字符以内。如果想不出摘要可以不写，不要在摘要里重复一遍文章标题。最好选择一个文章分类，如果现有的分类中没有合适的，可以自己新增。如果有文章头图，请确保图片内最多只有一个单词或短语，图片不清晰或者与文章无关的话不建议使用。不仅限于自己的文章，可以在征得文章作者同意的情况下将其链接收录到官网。 在线编辑文档https://github.com/volantis-x/community/tree/master/source/_posts/blogs"},{"title":"","date":"2021-05-11T15:17:11.735Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"examples/index.html","permalink":"https://volantis.js.org/examples/","excerpt":"示 例 博 客 社区维护团队的博客MHuiG划水Colsrch开发者inkss摸鱼W4J1e打杂volantis-x.js.orgTest Site For Development 使用 Volantis 的博客示例","text":"示 例 博 客 社区维护团队的博客MHuiG划水Colsrch开发者inkss摸鱼W4J1e打杂volantis-x.js.orgTest Site For Development 使用 Volantis 的博客示例 如何添加自己的博客链接 第一步：新建 Issue 按照格式填写并提交 { "title": "", "description": "", "screenshot": "", "url": "", "avatar": "", "version": "版本：^4.0"}为了提高图片加载速度，建议优化图片尺寸：打开 压缩图 上传自己的截图，将图片的高度调整到 360px 后下载。将压缩后的图片上传到 去不图床 并使用此图片链接作为截图链接。 第二步：刷新 回来刷新即可生效。 如何更新自己的博客链接 如果是自己创建的 issue ，可以自己修改。 如果是管理员创建的，请自己重新创建一份，然后让管理员删掉旧的。"},{"title":"常见问题与反馈渠道","date":"2021-05-11T15:17:11.735Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"faqs/index.html","permalink":"https://volantis.js.org/faqs/","excerpt":"通常来说，一个全新的工程全部使用默认配置是正常没有故障的。如果无法使用或者效果与示例有较大区别，可以使用 Hexo 官方提供的用于单元测试的博客应用本主题查看样式是否正常，对比 _config.yml 文件排查问题。 Hexo 官方的单元测试项目： https://github.com/hexojs/hexo-theme-unit-test 向开发者反馈问题","text":"通常来说，一个全新的工程全部使用默认配置是正常没有故障的。如果无法使用或者效果与示例有较大区别，可以使用 Hexo 官方提供的用于单元测试的博客应用本主题查看样式是否正常，对比 _config.yml 文件排查问题。 Hexo 官方的单元测试项目： https://github.com/hexojs/hexo-theme-unit-test 向开发者反馈问题 如何更新主题使用主题的时候，尽量 fork 主题到自己的 GitHub，然后进行修改并使用。这样做的好处是：当主题进行重要更新的时候可以根据需要拉取合并代码，使自己 DIY 的主题能够通过更新获取 BUG 修复或者新特性。 如果不懂请自行搜索关键词：fork 更新 实用小技巧所有需要写在主题配置文件中的配置都可以写在站点配置文件的 theme_config: 中，在 Hexo 5.0 后，还可以写在 _config.volantis.yml 文件中，详见 Hexo 官方文档：覆盖主题配置https://hexo.io/zh-cn/docs/configuration#%E8%A6%86%E7%9B%96%E4%B8%BB%E9%A2%98%E9%85%8D%E7%BD%AE也可以直接查看本站源码中站点配置文件的写法：_config.volantis.yml 无法成功运行本地预览 可能是没有安装依赖，请按照「开始」页面中的步骤进行安装，并安装所需依赖。 如果开启了某些第三方服务，请查看文档中是否要求安装插件。 如果报错信息有 lastIndex，你可以尝试把博客根目录配置文件中找到 highlight，并将 auto_detect 设置为 false。 主题配置修改没有生效请确认文档中要求修改的是博客主目录的配置文件 blog/_config.yml 还是主题的配置文件 blog/_config.volantis.yml。 主题样式修改没有生效如果主题配置文件中开启了 cdn 服务，那么修改本地的样式是不会生效的，需要关闭 cdn 服务。 修改什么都没有生效需要 hexo clean 然后重新 hexo s 如果安装了「相关文章推荐」插件后，每次修改 md 文件后都需要重新 hexo s 关掉 CDN 之后样式错乱 请前往文档「开始」页面，检查是否安装了必要的依赖包。 搜索无法使用 请前往文档「开始」页面，检查是否安装了必要的依赖包。 检查根目录配置文件是否有 search 字段冲突。 如果以上两步都无法找到问题，请下载示例源码进行对比。 搜索结果链接不正确请检查根目录配置文件中的链接是否正确，如： blog/_config.ymlurl: https://xaoxuu.comroot: / 教程与指南 Hexo 官方文档 | Valine 官方文档请一定要阅读官方文档！ 可供交流的渠道解决问题 渠道 方式 用途 Issues @volantis-x/hexo-theme-volantis 和开发者沟通的唯一渠道，用于跟进和解决问题 请不要发送邮件开源项目的开发者很反感别人不通过正确的途径如 Issues 而是通过私人邮件询问开源项目问题，所以一般不会回复此类邮件。 交流 渠道 方式 用途 论坛 @volantis-x/discussions 慢，相对正式，方便检索，可以给其他用户参考 QQ群 1146399464 (验证码: vlts-2021) 非正式，即时通讯，易于斗图；不利于给其他用户参考 佛系互动 渠道 方式 用途 评论区 留言 可以测试、灌水、推广自己的博客。"},{"title":"文章分类","date":"2021-05-11T15:17:11.735Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"blog/categories/index.html","permalink":"https://volantis.js.org/blog/categories/","excerpt":"","text":""},{"title":"所有标签","date":"2021-05-11T15:17:11.735Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"blog/tags/index.html","permalink":"https://volantis.js.org/blog/tags/","excerpt":"","text":""},{"title":"进阶设定","date":"2021-05-11T15:17:11.735Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"v2/advanced-settings/index.html","permalink":"https://volantis.js.org/v2/advanced-settings/","excerpt":"","text":"建议有一定基础知识的朋友进行尝试。 将主题添加为子模块 git submodule add https://github.com/volantis-x/hexo-theme-volantis themes/volantis 为网站提速加载速度 尝试安装 hexo-all-minifier 插件来压缩文件。 减少不必要的 js 插件，例如字数统计、动态背景。 查找并解决拖慢速度的资源，以 Chrome 浏览器为例： 页面中点击右键，选择「检查」。 在右边的窗口中「Network」选项卡，并勾选「Disable cache」。 刷新网页，查看加载速度慢的资源。 加载缓慢的图片，建议使用 CDN。 加载缓慢的可以不用的 js 插件，建议舍弃。 加载缓慢却必须使用的 js 插件，建议下载并自己上传至 jsdelivr。 运行速度 访问具有动态特效背景（如雪花、粒子等）的网站时，手机很快会发烫变卡，笔记本很快会风扇狂转并且浏览器提示建议关闭此页面。如果你希望网站有好的使用体验请尽量不要安装这类插件。 强烈推荐安装 hexo-offline 插件，初次加载速度不变，后期切换页面和刷新网页速度越来越快。 推荐安装图片懒加载插件 hexo-lazyload-image（需同时安装 hexo-fs 依赖库）。 优化 SEO在 front-matter 中，可以设置 keywords、description、robots 和 seo_title。其中 seo_title 仅仅用作网页标题，优先级高于 title。 文章内部不要使用 H1 标题。 通过死链检测工具检查并删除无法访问的链接。 安装 SEO 优化插件： hexo-autonofollow hexo-generator-seo-friendly-sitemap 页面不要堆砌关键词，不要频繁更改路径。 使用 CDN对于大部分将博客 deploy 到 GitHub 的用户来说，直接加载本地资源速度比较慢，可以使用 jsdelivr 为开源项目提供的 CDN 服务。 开启方法blog/_config.ymluse_cdn: true 如果你需要对样式进行 DIY，可以只关闭 style 文件的 CDN。 自定义 CDN如果你把对应的文件上传到自己的 CDN 服务器，可以把对应的链接改为自己的 CDN 链接。 安装「相关文章」插件 安装插件 npm i -S hexo-related-popular-posts 在需要显示的位置添加 related_posts 例如放在侧边栏： blog/themes/volantis/_config.ymllayout: on_page: sidebar: [related_posts] 插件的自定义配置方法： hexo-related-popular-posts 分析与统计默认支持 不蒜子 的访问统计，可以自行添加百度统计和 Google Analytics。 字数和阅读时长 安装以下插件：npm i --save hexo-wordcount 修改配置文件，将 wordcount 插件打开blog/themes/volantis/_config.ymlplugins: ... # 文章字数统计、阅读时长，开启需要安装插件: npm i --save hexo-wordcount wordcount: true 然后修改配置文件，将 wordcount 写入需要显示的 meta 位置：blog/themes/volantis/_config.yml# 布局layout: on_list: meta: [..., wordcount, ...] on_page: meta: header: [..., wordcount, ...] footer: [..., wordcount, ...] 百度统计blog/_config.ymlbaidu_analytics_key: 百度统计的key Google Analyticsblog/_config.ymlgoogle_analytics_key: Google Analytics Key CNZZ 统计请参考 ZYMIN 的这篇教程：《hexo+ejs+material x 添加CNZZ统计代码》 网站运行时间等请参考 TRHX 的这篇教程：《Hexo 博客主题个性化》 更多 DIY 玩法详见 @TRHX 的这篇博客：《Hexo 博客主题个性化》 内含卡片半透明、增加卡通人物、自定义鼠标样式、鼠标特效、烟花特效、彩色滚动字体、网站运行时间、动态浏览器标题、雪花飘落特效等多种详细教程。"},{"title":"开始使用","date":"2021-05-11T15:17:11.735Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"v2/getting-started/index.html","permalink":"https://volantis.js.org/v2/getting-started/","excerpt":"","text":" Volantis2 A Wonderful Theme for Hexo Volantis，一个高度模块化和可定制化、功能相对完善的 Hexo 博客主题，既可以用作个人博客，也适合用来搭建文档。 这些是使用了本主题的博客： 示例博客 能力要求自建博客需要一定的相关知识，在开始前，请务必确保： 已掌握 markdown 语法 已阅读 Hexo 官方文档 会使用终端（命令行），会使用 git 会阅读文档、搜索文档 为了更好地使用，还建议掌握以下知识： 规范地使用 GitHub Issues（解决文档中没有的问题） GitHub Fork、Pull Request 操作（使主题保持更新） 环境要求如果您从旧版本更新或着其它主题迁移，请确保环境版本不要太低，否则会产生兼容性问题。 Hexo: 4.2hexo-cli: 3.1node.js: 12.16 # LTS版npm: 6.13 下载与安装脚本自动安装手动安装在博客路径打开终端，下载安装并应用主题： curl -s https://volantis.js.org/start | bash 如果您还没有博客，执行这行命令将会自动检测并安装所需环境，初始化博客，然后下载安装并应用主题。 脚本更多使用方法：#hexo.sh第1/3步：下载主题源码到 themes/ 文件夹 git clone https://github.com/volantis-x/hexo-theme-volantis themes/volantis 第2/3步：修改站点配置文件 blog/_config.ymltheme: volantis 第3/3步：检查并安装依赖 安装 Hexo 搜索的依赖包：npm i -S hexo-generator-search hexo-generator-json-content 安装 stylus 渲染器：npm i -S hexo-renderer-stylus 升级小助手升级前请查看 更新日志 2.6.3 -> 2.6.6 不需要额外处理。 2.6.2 -> 2.6.3 全局搜索 seotitle 并替换为 seo_title。group 组件的索引规则有变，使用 group 组件的文章内，group: group_name 对应的组件名必须是 group_name。group 组件的列表名优先显示文章的 short_title 其次是 title。 许可协议本主题采用 MIT开源许可协议 ，永久无限制免费使用。 MIT开源许可协议被授权人有权利使用、复制、修改、合并、出版发行、散布、再授权及贩售软件及软件的副本。被授权人可根据程式的需要修改授权条款为适当的内容。在软件和软件的所有副本中都必须包含版权声明和许可声明。"},{"title":"页面配置","date":"2021-05-11T15:17:11.735Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"v2/page-settings/index.html","permalink":"https://volantis.js.org/v2/page-settings/","excerpt":"","text":"如无特殊说明，本页面的配置信息写在 页面 文件的 front-matter 中。 布局模板 取值 含义 page 独立页面 post 文章页面 category 分类页面 tag 标签页面 links 友链页面 list 列表页面 page & postpost 页面布局几乎与 page 页面相同，但是有以下细微区别： post 文章有 title 时，向下滚动网页，导航栏会向上移出屏幕显出文章标题，而 page 不会。 主题配置中的 article_footer 只作用于 post，如果 page 也要显示，可以在 front-matter 中设置meta: article_footer: [xxx] front-matterfront-matter 是文件最上方以 --- 分隔的区域，用于指定个别文件的变量。更多请见 Hexo 官方文档：#front-matter 查看全部取值 字段含义值类型默认值layout布局模版String-title页面标题String-seo_title网页标题Stringpage.titleshort_title页面标题（在group列表中显示）Stringpage.titledate创建时间Date文件创建时间updated更新日期Date文件修改时间link外部文章网址String-music内部音乐控件[Object]-robotsrobotsString-keywords页面关键词String-description页面描述、摘要String-cover是否显示封面Booltruemeta文章或页面的meta信息Bool, Arraytheme.layout.*.metasidebar页面侧边栏Bool, Arraytheme.layout.*.sidebarbody页面主体元素Arraytheme.layout.on_page.bodymathjax是否渲染公式Bool, Stringfalsethumbnail缩略图Stringfalseicons图标Array[]layout:post 时特有的字段：字段含义值类型默认值author文章作者[Object]config.authorcategories分类String, Array-tags标签String, Array-toc是否生成目录Booltruetop是否置顶Boolfalseauthor字段含义值类型默认值name作者名Stringconfig.authoravatar头像Stringconfig.avatarurl链接Stringconfig.urlmusic字段是否必须值类型server是netease, tencent, kugou, xiami, baidutype是song, playlist, album, search, artistid是song id / playlist id / album id / search keyword 独立页面除了归档页面是自动生成的，其它独立页面都需要手动创建 md 文件。 归档页面归档页面是自动生成的，并且初始化的时候已经生成，路径如下： blog/_config.yml# Directoryarchive_dir: archives 关于页面Create file if not exists: source/about/index.md---layout: pagetitle: 关于meta: header: [] footer: []sidebar: []valine: placeholder: 有什么想对我说的呢？---下面写关于自己的内容 分类页面Create file if not exists: source/categories/index.md---layout: categoryindex: truetitle: 所有分类--- 标签页面Create file if not exists: source/tags/index.md---layout: tagindex: truetitle: 所有标签--- 列表页面Create file if not exists: source/mylist/index.md---layout: listgroup: mylistindex: true--- 结果就是筛选出所有文章中 front-matter 部分含有 group: mylist 的文章。 友链页面Create file if not exists: source/friends/index.md---layout: links # 必须title: 我的朋友们 # 可选，这是友链页的标题links: - group: 分组1 icon: fas fa-user-tie desc: 这个分组的描述 items: - name: # 博客名 avatar: # 头像链接 url: # 博客链接 backgroundColor: '#3E74C9' # 卡片背景颜色 textColor: '#fff' # 卡片文字颜色 tags: [标签1, 标签2] # 标签 desc: 描述文字 - group: 分组2 icon: fas fa-user-tie desc: 这个分组的描述 items: - name: # 博客名 avatar: # 头像链接 url: # 博客链接 backgroundColor: '#3E74C9' # 卡片背景颜色 textColor: '#fff' # 卡片文字颜色 tags: [标签1, 标签2] # 标签 desc: 描述文字---这里写友链上方的内容。<!-- more -->这里可以写友链页面下方的文字备注，例如自己的友链规范、示例等。 姓名、头像、链接是必填项，其它选填。 404页面Create file if not exists: source/404.md---layout: pagetitle: 404 Not Foundbody: [article, comments]meta: header: [] footer: []sidebar: []valine: path: /404.html placeholder: 请留言告诉我您要访问哪个页面找不到了---{% p center huge, 404 %}{% p center bold, 很抱歉，您访问的页面不存在 %}{% p center small, 可能是输入地址有误或该地址已被删除 %} 页面元素排列默认是文章+评论： front-matter---body: [article, comments]--- 如果你想把相关文章卡片显示在评论前，可以这样写： front-matter---body: [article, related_posts, comments]--- 如果想全局修改，在主题配置文件中的 layout.on_page.body 中设置。 文章属性文章置顶在 front-matter 中设置以下值： front-mattertop: true 如果想自定义置顶标签的文字，可以直接设置为字符串，例如： front-mattertop: 近期更新 文章分类多个分类有两种关系，一种是层级（等同于文件夹），一种是并列（等同于标签）。 多级分类： front-matter---categories: [分类A, 分类B]--- 或者 front-matter---categories: - 分类A - 分类B--- 并列分类 front-mattercategories: - [分类A] - [分类B] 多级+并列分类 front-mattercategories: - [分类A, 分类B] - [分类C, 分类D] 文章摘要在文章中插入 <!-- more -->，前面的部分即为摘要。 某篇文章源码---title: xxxdate: 2020-02-21---这是摘要<!-- more -->这是正文 注意： <!-- more --> 前后一定要有空行，不然可能导致显示错位。 设置文章作者由于支持多个作者在一个站点发布文章，所以可以设置单独一篇文章的作者： front-matter---author: name: 作者 avatar: https://img.vim-cn.com/a1/d53c11fb5d4fd69529bc805d385fe818feb3f6.png url: https://baidu.com--- 显示迷你音乐播放器标题右边显示迷你音乐播放器，支持的字段有：server、type、id。 front-matter---music: server: netease # netease, tencent, kugou, xiami, baidu type: song # song, playlist, album, search, artist id: 16846091 # song id / playlist id / album id / search keyword--- 实际效果见： #contributors 显示 meta 标签文章顶部和底部的日期、分类、更新日期、标签、分享等属于 meta 标签，默认跟随主题配置文件，可在 front-matter 中关闭。 front-matter---top_meta: falsebottom_meta: false--- 标题右边显示缩略图front-matter---thumbnail: https://img.vim-cn.com/17/0c7b02722686d1527a1df807dae0794d995860.png--- 缩略图仅在文章列表和文章页面显示，不会在归档页面显示。 标题右边显示图标front-matter---icons: [fas fa-fire red, fas fa-star green]--- 图标仅在归档页面中显示，可以用来标注热门文章。 可以通过 red / blue / green / yellow / orange / theme / accent 来设置图标的颜色 meta 区域显示外链按钮例如当前文档页面的设置： front-matter---meta: footer: [btns]btns: repo: https://github.com/volantis-x/hexo-theme-volantis bug: https://github.com/volantis-x/hexo-theme-volantis/issues/ doubt: https://github.com/volantis-x/hexo-theme-volantis/issues/ idea: https://github.com/volantis-x/hexo-theme-volantis/issues/--- 按钮的颜色、图标、标题在主题配置文件中设置。 是否要显示封面如果某个页面需要封面，可以这样写： front-matter---cover: true--- 引入外部文章利用 link，搭配自定义的文章作者信息，你可以在文章列表中显示外部文章或者网址，例如： front-matter---layout: postdate: 2017-07-05title: [转]如何搭建基于Hexo的独立博客categories: [Dev, Hexo]tags: - Hexoauthor: name: xaoxuu avatar: https://cdn.jsdelivr.net/gh/xaoxuu/assets@master/avatar/avatar.png url: https://xaoxuu.comlink: https://xaoxuu.com/blog/2017-07-05-hexo-blog/---![](https://img.vim-cn.com/d9/a9af7dc49fc0af8ca3e6dd2450a2f7095a87db.png) 显示侧边栏通过自由设置边栏卡片来删减对应页面的冗余信息，提高有价值的信息在页面中的权重。 如果某个页面不需要侧边栏，可以这样写： front-matter---sidebar: []--- 某个页面想指定显示某几个侧边栏，就这样写: front-matter---sidebar: [grid, toc, tags] # 放置任何你想要显示的侧边栏部件--- 关闭评论可以 front-matter---comments: false--- 也可以 front-matter---body: [article]--- 只显示留言板如果你想创建一个只有留言板的页面 front-matter---body: [comments]---"},{"title":"站点配置","date":"2021-05-11T15:17:11.735Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"v2/site-settings/index.html","permalink":"https://volantis.js.org/v2/site-settings/","excerpt":"","text":"如无特殊说明，本页面的配置信息写在 博客根目录 的 _config.yml 文件中。 网站标题blog/_config.yml# 网站标题title: my blog 网站图标简单方式完全自定义blog/_config.yml# 网站图标，更多尺寸等图标请使用import方式批量导入favicon: https://cdn.jsdelivr.net/gh/xaoxuu/assets@master/favicon/favicon.icoblog/_config.ymlimport: meta: - <meta name="msapplication-TileColor" content="#ffffff"> - <meta name="msapplication-config" content="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/browserconfig.xml"> - <meta name="theme-color" content="#ffffff"> link: - <link rel="apple-touch-icon" sizes="180x180" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/apple-touch-icon.png"> - <link rel="icon" type="image/png" sizes="32x32" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-32x32.png"> - <link rel="icon" type="image/png" sizes="16x16" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-16x16.png"> - <link rel="manifest" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/site.webmanifest"> - <link rel="mask-icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/safari-pinned-tab.svg" color="#5bbad5"> - <link rel="shortcut icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon.ico"> Import可以在无需修改主题文件的情况下在 head 和 body 中添加各种标签。meta 和 link 对应 head 中的 <meta> 和 <link> 标签。script 可以在 body 末尾导入 js 文件。 blog/_config.ymlimport: meta: - <meta name="msapplication-TileColor" content="#ffffff"> - <meta name="msapplication-config" content="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/browserconfig.xml"> - <meta name="theme-color" content="#ffffff"> link: - <link rel="apple-touch-icon" sizes="180x180" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/apple-touch-icon.png"> - <link rel="icon" type="image/png" sizes="32x32" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-32x32.png"> - <link rel="icon" type="image/png" sizes="16x16" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-16x16.png"> - <link rel="manifest" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/site.webmanifest"> - <link rel="mask-icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/safari-pinned-tab.svg" color="#5bbad5"> - <link rel="shortcut icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon.ico"> script: 更多配置更多请见 Hexo 官方文档：#Hexo配置"},{"title":"进阶设定","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/advanced-settings/index.html","permalink":"https://volantis.js.org/v3/advanced-settings/","excerpt":"","text":"使用数据文件有时您可能需要在主题中使用某些资料，而这些资料并不在文章内，并且是需要重复使用的，那么您可以考虑使用 Hexo 3.0 新增的「数据文件」功能。此功能会载入 source/_data 内的 YAML 或 JSON 文件，如此一来您便能在网站中复用这些文件了。 举例来说，在 source/_data 文件夹中新建 menu.yml 文件： Home: /Gallery: /gallery/Archives: /archives/ 您就能在模板中使用这些资料： <% for (var link in site.data.menu) { %> <a href="<%= site.data.menu[link] %>"> <%= link %> </a><% } %> 渲染结果如下 : <a href="/"> Home </a><a href="/gallery/"> Gallery </a><a href="/archives/"> Archives </a> Volantis 的数据文件source/_data/layout.ymlsource/_data/menu.ymlsource/_data/widget.yml 设置子模块 将主题添加为子模块 git submodule add git@github.com:theme-volantis/hexo-theme-volantis themes/volantisorgit submodule add https://github.com/volantis-x/hexo-theme-volantis.git themes/volantis 为网站提速加载速度 尝试安装 hexo-all-minifier 插件来压缩文件。 减少不必要的 js 插件，例如字数统计、动态背景。 查找并解决拖慢速度的资源，以 Chrome 浏览器为例： 页面中点击右键，选择「检查」。 在右边的窗口中「Network」选项卡，并勾选「Disable cache」。 刷新网页，查看加载速度慢的资源。 加载缓慢的图片，建议使用 CDN。 加载缓慢的可以不用的 js 插件，建议舍弃。 加载缓慢却必须使用的 js 插件，建议下载并自己上传至 jsdelivr。 运行速度 访问具有动态特效背景（如雪花、粒子等）的网站时，手机很快会发烫变卡，笔记本很快会风扇狂转并且浏览器提示建议关闭此页面。如果你希望网站有好的使用体验请尽量不要安装这类插件。 推荐安装图片懒加载插件 hexo-lazyload-image（需同时安装 hexo-fs 依赖库）。 优化 SEOblog/_config.volantis.ymlseo: # When there are no keywords in the article's front-matter, use tags as keywords. use_tags_as_keywords: true # When there is no description in the article's front-matter, use excerpt as the description. use_excerpt_as_description: true robots: home_first_page: index,follow home_other_pages: noindex,follow archive: noindex,follow category: noindex,follow tag: noindex,follow # robots can be written in front-matter 在 front-matter 中，可以设置 keywords、description、robots 和 seo_title。其中 seo_title 仅仅用作网页标题，优先级高于 title。 文章内部不要使用 H1 标题。 通过死链检测工具检查并删除无法访问的链接。 安装 SEO 优化插件： hexo-autonofollowhttps://github.com/liuzc/hexo-autonofollow hexo-generator-seo-friendly-sitemaphttps://github.com/ludoviclefevre/hexo-generator-seo-friendly-sitemap 页面不要堆砌关键词，不要频繁更改路径。 使用 CDN对于大部分将博客 deploy 到 GitHub 的用户来说，直接加载本地资源速度比较慢，可以使用 jsdelivr 为开源项目提供的 CDN 服务。 开启方法blog/_config.ymluse_cdn: true 如果你需要对样式进行 DIY，可以只关闭 style 文件的 CDN。 自定义 CDN如果你把对应的文件上传到自己的 CDN 服务器，可以把对应的链接改为自己的 CDN 链接。 安装「相关文章」插件 安装插件 npm i -S hexo-related-popular-posts 在需要显示的位置添加 related_posts 例如放在侧边栏： blog/_config.volantis.ymllayout: on_page: sidebar: [related_posts] 插件的自定义配置方法： hexo-related-popular-postshttps://github.com/tea3/hexo-related-popular-posts 分析与统计默认支持 不蒜子 的访问统计，可以自行添加百度统计和 Google Analytics。 字数和阅读时长 安装以下插件：npm i --save hexo-wordcount 修改配置文件，将 wordcount 插件打开blog/_config.volantis.ymlplugins: ... # 文章字数统计、阅读时长，开启需要安装插件: npm i --save hexo-wordcount wordcount: true 然后修改配置文件，将 wordcount 写入需要显示的 meta 位置：blog/_config.volantis.yml# 布局layout: on_list: meta: [..., wordcount, ...] on_page: meta: header: [..., wordcount, ...] footer: [..., wordcount, ...] 百度统计blog/_config.ymlbaidu_analytics_key: 百度统计的key Google Analyticsblog/_config.ymlgoogle_analytics_key: Google Analytics Key CNZZ 统计请参考 ZYMIN 的这篇教程： Hexo hexo+ejs+material x 添加CNZZ统计代码https://zymin.cn/arcticle/hexo+ejs+material.html 更多 DIY 玩法详见 @TRHX 的这篇博客： Hexo 博客主题个性化https://www.itrhx.com/2018/08/27/A04-Hexo-blog-topic-personalization/ 内含卡片半透明、增加卡通人物、自定义鼠标样式、鼠标特效、烟花特效、彩色滚动字体、网站运行时间、动态浏览器标题、雪花飘落特效等多种详细教程。"},{"title":"安装与版本更新","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/getting-started/index.html","permalink":"https://volantis.js.org/v3/getting-started/","excerpt":"","text":" Volantis3 A Wonderful Theme for Hexo 5 Volantis，一个高度模块化和可定制化、功能相对完善的 Hexo 博客主题，既可以用作个人博客，也适合用来搭建文档。 这些是使用了本主题的博客： 示例博客 能力要求 !!!自建博客需要一定的相关知识，在开始前，请务必确保： 已掌握 markdown 语法 已阅读 Hexo 官方文档 会使用终端（命令行），会使用 git 会阅读文档、搜索文档 为了更好地使用，还建议掌握以下知识： 会阅读源码，知道本站源码在哪里，会参照源码仿写、对比差异 规范地使用 GitHub Issues（解决文档中没有的问题） GitHub Fork、Pull Request 操作（使主题保持最新） 环境要求如果您从旧版本更新或着其它主题迁移，请确保环境版本不要太低，否则会产生兼容性问题。 Hexo: 4.2 ~ 5.xhexo-cli: 3.1 ~ 4.xnode.js: 12.16 ~ latest # 推荐使用 LTS 版npm: 6.13 ~ latest 下载与安装全新博客安装从其它主题迁移第 1/2 步：修改站点配置文件 在 blog/_config.yml 文件中找到并修改：theme: volantis 第 2/2 步：下载主题 在终端中输入：npm i hexo-theme-volantis 如果您是 Mac 用户，可以使用脚本完成全部流程 在博客路径打开终端，下载安装并应用主题：curl -s https://volantis.js.org/start | bash这行命令将会自动检测并安装所需环境，初始化博客，然后下载安装并应用主题。脚本详细使用方法：#hexo.sh 第 1/3 步：修改站点配置文件 在 blog/_config.yml 文件中找到并修改：theme: volantis 第 2/3 步：下载主题 如果您已经升级到 Hexo 5.0.2 及以上，可以直接使用 npm 命令安装：npm i hexo-theme-volantis对于旧版本，需要下载主题源码到 themes/ 文件夹：git clone https://github.com/volantis-x/hexo-theme-volantis themes/volantis如果您无法访问 GitHub 可以使用国内镜像源：git clone https://e.coding.net/volantis/volantis/volantis.git themes/volantis 第 3/3 步：检查并安装依赖 安装 Hexo 搜索的依赖包：npm i hexo-generator-search hexo-generator-json-content安装 Stylus 渲染器：npm i hexo-renderer-stylus 版本更新请对照 更新日志 进行更新，下面是更新之后需要注意的事项： 2020-08-09 2.6.6 -> 3.0.0 如果有 hexo-lazyload-image 插件，需要重新安装最新版本并增加设置 lazyload.isSPA: true 。2.x 版本的 css 和 js 不适用于 3.x 版本，如果使用了 use_cdn: true 则需要删除。2.x 版本的 fancybox 标签在 3.x 版本中被重命名为 gallery 。2.x 版本的置顶 top: true 改为了 pin: true 并且同样适用于 layout: page 的页面。如果使用了 hexo-offline 插件，建议卸载，3.0 版本使用了 pjax 服务。欢迎补充 许可协议本主题采用 MIT开源许可协议 ，永久无限制免费使用。 MIT开源许可协议被授权人有权利使用、复制、修改、合并、出版发行、散布、再授权及贩售软件及软件的副本。被授权人可根据程式的需要修改授权条款为适当的内容。在软件和软件的所有副本中都必须包含版权声明和许可声明。"},{"title":"进阶设定","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v4/advanced-settings/index.html","permalink":"https://volantis.js.org/v4/advanced-settings/","excerpt":"","text":"设置子模块 将主题添加为子模块 git submodule add https://github.com/volantis-x/hexo-theme-volantis.git themes/volantis 多人协同默认的作者信息在主题配置文件中设置： blog/themes/volantis/_config.yml# 文章布局article: ... body: ... meta_library: author: avatar: name: 请设置文章作者 url: / Volantis 支持多个作者在一个站点发布文章，其他作者信息需要写在数据文件中，例如： blog/source/_data/author.ymlJon: name: Jon Snow avatar: https://cn.bing.com/th?id=AMMS_fc8f99fd41ebd737a71c4e13806db9a0&w=110&h=110&c=7&rs=1&qlt=80&pcl=f9f9f9&cdv=1&dpr=2&pid=16.1 url: https://gameofthrones.fandom.com/wiki/Jon_SnowDany: name: Daenerys Targaryen avatar: https://tse1-mm.cn.bing.net/th?id=OIP.Yax4wLzIFbcBVUa_RsKywQHaLH&w=80&h=80&c=8&rs=1&qlt=90&dpr=2&pid=3.1&rm=2 url: https://gameofthrones.fandom.com/wiki/Daenerys_Targaryen 在文章的 front-matter 中新增 author 即可： ---title: Jon Snow | Game of Thrones Wiki | Fandomauthor: Jon--- 为网站提速加载速度 减少不必要的 js 插件，例如字数统计、动态背景。 查找并解决拖慢速度的资源，以 Chrome 浏览器为例： 页面中点击右键，选择「检查」。 在右边的窗口中「Network」选项卡，并勾选「Disable cache」。 刷新网页，查看加载速度慢的资源。 加载缓慢的图片，建议使用 CDN。 加载缓慢的可以不用的 js 插件，建议舍弃。 加载缓慢却必须使用的 js 插件，建议下载并自己上传至 jsdelivr。 运行速度 访问具有动态特效背景（如雪花、粒子等）的网站时，手机很快会发烫变卡，笔记本很快会风扇狂转并且浏览器提示建议关闭此页面。如果你希望网站有好的使用体验请尽量不要安装这类插件。 优化 SEOblog/_config.volantis.ymlseo: # When there are no keywords in the article's front-matter, use tags as keywords. use_tags_as_keywords: true # When there is no description in the article's front-matter, use excerpt as the description. use_excerpt_as_description: true robots: home_first_page: index,follow home_other_pages: noindex,follow archive: noindex,follow category: noindex,follow tag: noindex,follow # robots can be written in front-matter 在 front-matter 中，可以设置 keywords、description、robots 和 seo_title。其中 seo_title 仅仅用作网页标题，优先级高于 title。 文章内部不要使用 H1 标题。 通过死链检测工具检查并删除无法访问的链接。 安装 SEO 优化插件： hexo-autonofollowhttps://github.com/liuzc/hexo-autonofollow hexo-generator-seo-friendly-sitemaphttps://github.com/ludoviclefevre/hexo-generator-seo-friendly-sitemap 页面不要堆砌关键词，不要频繁更改路径。 使用 CDN对于大部分将博客 deploy 到 GitHub 的用户来说，直接加载本地资源速度比较慢，可以使用 jsdelivr 为开源项目提供的 CDN 服务。 开启方法blog/_config.volantis.yml# use_cdn: /source/js/* 中的JS文件(JS Only)使用jsdelivr的min版本加速# 默认使用 https://cdn.jsdelivr.net/npm/hexo-theme-volantis@<%- theme.info.theme_version %>/source/js/*.min.js 的CDN压缩版本(min.js)，注意版本号对应关系！！可以通过修改以下配置项覆盖# 开发者注意 use_cdn 设置为 falseuse_cdn: trueinfo: theme_version: 'x.x.x' # This is theme's version. cdn: js: # https://cdn.jsdelivr.net/npm/hexo-theme-volantis@<%- theme.info.theme_version %>/source/js/app.min.js # 注意版本!!! css: first: # /css/first.css (默认不提供CDN，first.css 中为首屏渲染的样式，内含 cover navbar search 的样式。) style: # /css/style.css (默认不提供CDN，style.css 为异步延迟加载的样式。) 如果你需要对样式进行 DIY，可以只关闭 style 文件的 CDN。 如果你需要对样式进行 DIY，请注意首屏渲染和异步延迟加载的差异。 自定义 CDN如果你把对应的文件上传到自己的 CDN 服务器，可以把对应的链接改为自己的 CDN 链接。 尝试使用 Terser 压缩 ES6安装压缩工具npm install -g gulpnpm install --save-dev gulp gulp-html-minifier-terser gulp-htmlclean gulp-htmlmin gulp-minify-css gulp-terser gulp 配置文件blog/gulpfile.jsvar gulp = require('gulp');var minifycss = require('gulp-minify-css');var htmlmin = require('gulp-html-minifier-terser');var htmlclean = require('gulp-htmlclean');var terser = require('gulp-terser');// 压缩css文件const minify_css = () => ( gulp.src(['./public/**/*.css']) .pipe(minifycss()) .pipe(gulp.dest('./public')));// 压缩html文件const minify_html = () => ( gulp.src(['./public/**/*.html','!./public/{lib,lib/**}']) .pipe(htmlclean()) .pipe(htmlmin({ removeComments: true, minifyJS: true, minifyCSS: true, minifyURLs: true, })) .pipe(gulp.dest('./public')))// 压缩js文件const minify_js = () => ( gulp.src(['./public/**/*.js', '!./public/**/*.min.js','!./public/{lib,lib/**}']) .pipe(terser()) .pipe(gulp.dest('./public')))module.exports = { minify_html: minify_html, minify_css: minify_css, minify_js: minify_js};gulp.task('one', gulp.parallel( minify_html, minify_css, minify_js))gulp.task('default', gulp.series('one')); 运行压缩gulp 安装 Service Worker 服务blog/_config.yml# 全局导入import: script: - <script>"serviceWorker"in navigator&&navigator.serviceWorker.register("/sw.js").then(function(n){n.onupdatefound=function(){var e=n.installing;e.onstatechange=function(){switch(e.state){case"installed":navigator.serviceWorker.controller?console.log("Updated serviceWorker."):console.log("serviceWorker Sucess!");break;case"redundant":console.log("The installing service worker became redundant.")}}}}).catch(function(e){console.log("Error during service worker registration:",e)}); </script> 在blog/source中创建sw.js文件。 内容如下： importScripts('https://cdn.jsdelivr.net/npm/workbox-cdn@5.1.3/workbox/workbox-sw.js');workbox.setConfig({ modulePathPrefix: 'https://cdn.jsdelivr.net/npm/workbox-cdn@5.1.3/workbox/'});const { core, precaching, routing, strategies, expiration, cacheableResponse, backgroundSync } = workbox;const { CacheFirst, NetworkFirst, NetworkOnly, StaleWhileRevalidate } = strategies;const { ExpirationPlugin } = expiration;const { CacheableResponsePlugin } = cacheableResponse;const cacheSuffixVersion = '-000010', // 缓存版本号 极端重要，修改静态文件后发布网页一定要修改缓存版本号 maxEntries = 100;self.addEventListener('activate', (event) => { event.waitUntil( caches.keys().then((keys) => { return Promise.all(keys.map((key) => { if (!key.includes(cacheSuffixVersion)) return caches.delete(key); })); }) );});core.setCacheNameDetails({ prefix: 'volantis', // 极端重要 自己拟定一个名字 suffix: cacheSuffixVersion});core.skipWaiting();core.clientsClaim();precaching.cleanupOutdatedCaches();/* * Precache * - Static Assets */precaching.precacheAndRoute( // 极端重要 定义首次缓存的静态文件 如果开启CDN需要修改为CDN链接 [ { url: '/css/first.css', revision: null }, { url: '/css/style.css', revision: null }, { url: '/js/app.js', revision: null }, ],);/* * Cache File From CDN * * Method: CacheFirst * cacheName: static-immutable * cacheTime: 30d */// cdn.jsdelivr.net - cors enabledrouting.registerRoute( /.*cdn\\.jsdelivr\\.net/, new CacheFirst({ cacheName: 'static-immutable' + cacheSuffixVersion, fetchOptions: { mode: 'cors', credentials: 'omit' }, plugins: [ new ExpirationPlugin({ maxAgeSeconds: 30 * 24 * 60 * 60, purgeOnQuotaError: true }) ] }));// m7.music.126.net - cors enabledrouting.registerRoute( /.*m7\\.music\\.126\\.net/, new CacheFirst({ cacheName: 'static-immutable' + cacheSuffixVersion, fetchOptions: { mode: 'cors', credentials: 'omit' }, plugins: [ new ExpirationPlugin({ maxAgeSeconds: 30 * 24 * 60 * 60, purgeOnQuotaError: true }) ] }));/* * No Cache * * Method: networkOnly */routing.registerRoute( /.*baidu\\.com.*/, new NetworkOnly());/* * Others img fonts * Method: staleWhileRevalidate */routing.registerRoute( // Cache image fonts files /.*\\.(?:png|jpg|jpeg|svg|gif|webp|ico|eot|ttf|woff|woff2|mp3)/, new StaleWhileRevalidate());/* * Static Assets * Method: staleWhileRevalidate */routing.registerRoute( // Cache CSS files /.*\\.(css|js)/, // Use cache but update in the background ASAP new StaleWhileRevalidate());/* * sw.js - Revalidate every time * staleWhileRevalidate */routing.registerRoute( '/sw.js', // 本文件名 new StaleWhileRevalidate());/* * Default - Serve as it is * networkFirst */routing.setDefaultHandler( new NetworkFirst({ networkTimeoutSeconds: 3 })); 安装「相关文章」插件 安装插件 npm i -S hexo-related-popular-posts 插件的自定义配置方法： hexo-related-popular-postshttps://github.com/tea3/hexo-related-popular-posts 如果您使用了头图，可以在站点配置文件中添加以下设置来让相关文章显示正确的文章头图： blog/_config.ymlpopularPosts: eyeCatchImageAttributeName: headimg 注意需要升级到 5.0.1 及以上版本才可以支持自定义头图，详见 #29 分析与统计默认支持 不蒜子 的访问统计，可以自行添加百度统计和 Google Analytics。 字数和阅读时长 安装以下插件：npm i --save hexo-wordcount 修改配置文件，将 wordcount 插件打开blog/_config.volantis.ymlplugins: ... # 文章字数统计、阅读时长，开启需要安装插件: npm i --save hexo-wordcount wordcount: enable: #true 然后修改配置文件，将 wordcount 写入需要显示的 meta 位置：blog/_config.volantis.yml# 文章布局article: ... # 文章详情页面的文章卡片本体布局方案 body: # 文章顶部信息 # 从 meta_library 中取 top_meta: [..., wordcount, ...] ... # 文章底部信息 # 从 meta_library 中取 bottom_meta: [..., wordcount, ...] CNZZ 统计请参考 ZYMIN 的这篇教程： Hexo hexo+ejs+material x 添加CNZZ统计代码https://zymin.cn/arcticle/hexo+ejs+material.html 更多进阶玩法详见 @TRHX 的这篇博客： Hexo 博客主题个性化https://www.itrhx.com/2018/08/27/A04-Hexo-blog-topic-personalization/ 内含卡片半透明、增加卡通人物、自定义鼠标样式、鼠标特效、烟花特效、彩色滚动字体、网站运行时间、动态浏览器标题、雪花飘落特效等多种详细教程。 主题官网 #进阶玩法https://volantis.js.org/categories/进阶玩法/"},{"title":"","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v4/getting-started/index.html","permalink":"https://volantis.js.org/v4/getting-started/","excerpt":"","text":" Volantis4 A Wonderful Theme for Hexo Volantis 是一个功能丰富、高度模块化的 Hexo 博客主题。得益于其强大的模块化特性，您可以轻松搭建一个极简风格的博客，也可以仿照官网搭建一个多人协作的、包含文档模块的大体量综合型博客。 示例博客https://volantis.js.org/examples/ 所有的 Volantis 用户都可以按照格式自行创建 Issue 来将自己的博客添加到官网的示例博客页面中。 准备工作能力条件环境配置条件自建博客需要一定的相关知识，在开始前，请务必确保您会使用 markdown 语法，掌握简单的 git 知识，最最重要的是，遇到困难知道该怎么寻求解决： 翻阅和搜索文档 搜索 issues 中是否有解决办法 新建 issue 并按照要求进行操作，详尽地描述您遇到的问题 如果您没有使用过 Hexo 也不要着急，可以先通读一遍 Hexo 中文文档，要想使用地得心应手，最好参照团队提供的开源项目的源码进行搭建： Demo 源码 ｜ 官网源码如果您从旧版本更新或着其它主题迁移，请确保环境版本不要太低，否则会产生兼容性问题。 Hexo: 4.2 ~ 5.xhexo-cli: 3.1 ~ 4.xnode.js: 12.16 ~ latest # 推荐使用 LTS 版npm: 6.13 ~ latest 快速体验如果您已经具备环境配置条件，可以在终端中输入下面这行代码，稍等片刻即可尝鲜体验： git clone https://github.com/volantis-x/demo.git && cd demo && npm i && hexo s 下载与安装全新博客安装从其它主题迁移第 1/2 步：修改站点配置文件 在 blog/_config.yml 文件中找到并修改：theme: volantis 第 2/2 步：下载主题 在终端中输入：npm i hexo-theme-volantis 如果您是 Mac 用户，可以使用脚本完成全部流程 在博客路径打开终端，下载安装并应用主题：curl -s https://volantis.js.org/start | bash这行命令将会自动检测并安装所需环境，初始化博客，然后下载安装并应用主题。脚本详细使用方法：#hexo.sh 第 1/3 步：修改站点配置文件 在 blog/_config.yml 文件中找到并修改：theme: volantis 第 2/3 步：下载主题 如果您已经升级到 Hexo 5.0.2 及以上，可以直接使用 npm 命令安装：npm i hexo-theme-volantis对于旧版本，需要下载主题源码到 themes/ 文件夹：git clone https://github.com/volantis-x/hexo-theme-volantis themes/volantis如果您无法访问 GitHub 可以使用国内镜像源：git clone https://e.coding.net/volantis-x/p/hexo-theme-volantis.git themes/volantis 第 3/3 步：检查并安装依赖 安装 Hexo 搜索的依赖包：npm i hexo-generator-search hexo-generator-json-content安装 Stylus 渲染器：npm i hexo-renderer-stylus 版本更新注意事项使用主题的时候，尽量 fork 主题到自己的 GitHub，然后进行修改并使用。这样做的好处是：当主题进行重要更新的时候可以根据需要拉取合并代码，使自己 DIY 的主题能够通过更新获取 BUG 修复或者新特性。 如果不懂请自行搜索关键词：fork 更新 实用小技巧所有需要写在主题配置文件中的配置都可以写在站点配置文件的 theme_config: 中，在 Hexo 5.0 后，还可以写在 _config.volantis.yml 文件中，详见 Hexo 官方文档：覆盖主题配置https://hexo.io/zh-cn/docs/configuration#%E8%A6%86%E7%9B%96%E4%B8%BB%E9%A2%98%E9%85%8D%E7%BD%AE也可以直接查看本站源码中站点配置文件的写法：_config.volantis.yml 请对照 更新日志 进行更新，下面是更新之后需要注意的事项： 2021-01-15 4.2.0 -> 4.3.0 更多关于Volantis的小版本更新请点击上方更新日志按钮增加 disqusjs 评论系统；增加 waline 评论系统；增加 旧版 Internet Explorer 淘汰行动 ；增加 Tidio聊天功能；增加 twitoo waline valine minivaline 文章阅读量统计；增加 bbtalk.js；修复#514 #538 #567 #431 #468；修复关闭 pjax 时 cover样式失效 和 报错 的问题 。 2020-09-26 3.0.0 -> 4.0.0 4.0.0 的配置文件改动非常大，强烈建议不要在旧的配置文件上改。原数据文件中的配置项不再支持，请在配置文件中进行设置。主题配置文件进行了重新设计，需要「完全」重新配置一遍。友链使用数据文件，并支持 issues 标签实现动态自助友链。原 meta 自定义布局现在只支持文章内部的 top_meta 和 bottom_meta 。文章列表页面布局现在只能在有限范围内进行自定义。侧边栏组件现在只支持侧边栏位置；文章末尾有专用的组件。如果安装了懒加载插件，需要卸载掉，使用主题内置的懒加载（和插件冲突）。如果想要关闭评论，需要改为 comments: false 。如果要隐藏文章顶部或者底部的 meta 标签，需设置 top_meta: false 或者 bottom_meta: false 。如果需要同时隐藏标题和顶部的 meta 标签也可以把 title: xxx 改为 seo_title: xxx 。作者的信息使用数据文件进行定义，文章中只需要写 author: xxx 而不需要重复写作者的信息了。现在只有 gallery 标签的图片支持放大。友链页面 layout: links 改为 layout: friends。 许可协议本主题采用 MIT开源许可协议 ，永久无限制免费使用。 MIT开源许可协议被授权人有权利使用、复制、修改、合并、出版发行、散布、再授权及贩售软件及软件的副本。被授权人可根据程式的需要修改授权条款为适当的内容。在软件和软件的所有副本中都必须包含版权声明和许可声明。 配置与使用配置与使用/v4/site-settings/"},{"title":"页面配置","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v4/page-settings/index.html","permalink":"https://volantis.js.org/v4/page-settings/","excerpt":"","text":"页面布局模板布局模板 取值 含义 page 独立页面 post 文章页面 docs 文档页面 category 分类页面 tag 标签页面 friends 友链页面 list 列表页面 page & post & docs这三种页面相同，但是有以下细微区别： post 文章有 title 时，向下滚动网页，导航栏会向上移出屏幕显出文章标题，而 page 和 docs 不会。 post 文章末尾最多可以显示「参考资料」、「相关文章」、「版权标识」、「打赏」四个模块。 docs 文章末尾最多可以显示「参考资料」一个模块。 除了归档页面是自动生成的，其它独立页面都需要手动创建 md 文件。 归档页面归档页面是自动生成的，并且初始化的时候已经生成，路径如下： blog/_config.yml# Directoryarchive_dir: archives 关于页面Create file if not exists: source/about/index.md---layout: docsseo_title: 关于bottom_meta: falsesidebar: []valine: placeholder: 有什么想对我说的呢？---下面写关于自己的内容 分类页面Create file if not exists: source/categories/index.md---layout: categoryindex: truetitle: 所有分类--- 标签页面Create file if not exists: source/tags/index.md---layout: tagindex: truetitle: 所有标签--- 列表页面Create file if not exists: source/mylist/index.md---layout: listgroup: mylistindex: true--- 结果就是筛选出所有文章中 front-matter 部分含有 group: mylist 的文章。 友链页面创建页面文件Create file if not exists: source/friends/index.md---layout: friends # 必须title: 我的朋友们 # 可选，这是友链页的标题---这里写友链上方的内容。<!-- more -->这里可以写友链页面下方的文字备注，例如自己的友链规范、示例等。 选择布局方案在主题配置文件中找到以下内容： pages: # 友链页面配置 friends: layout_scheme: traditional # simple: 简单布局, traditional: 传统布局, sites: 网站卡片布局 目前提供三种布局方案： simple: 简单布局，只有头像和标题。 traditional: 传统布局，是 Volantis 旧版本的风格。 sites: 网站卡片布局，是 Volantis 4.x 新增的网站卡片标签的样式。 设置数据源静态数据源动态数据源友链的数据源写在以下路径，如果没有请自行创建： blog/source/_data/friends.yml 内容格式为： blog/source/_data/friends.yml- group: # 分组标题 description: # 分组描述 items: - title: # 名称 avatar: # 头像 url: # 链接 screenshot: # 截图 keywords: # 关键词 description: # 描述 - title: # 名称 avatar: # 头像 url: # 链接 screenshot: # 截图 keywords: # 关键词 description: # 描述 不同的布局方式，会用到一部分的字段，一般来说，title、avatar 和 url 都是必须的。这些数据被转成 HTML 标签插入到友链页面的 <!-- more --> 部分。使用 issues 标签可以从 issues 中获取 JSON 数据解析并生成 HTML 填充到页面中，使用方法如下： {% issues sites | api=https://api.github.com/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=active %} 这样添加友链的方式就变成了：对方提 Issue ，自己审核，然后添加 active 标签，然后刷新网页就生效了。更新友链内容也变得十分方便， Issue 的创建者拥有修改和关闭的权限。 新建一个 GitHub 或者 Gitee 仓库，创建 Issues 模板，如下： { "title": "", "screenshot": "", "url": "", "avatar": "", "description": "", "keywords": ""} 关于如何使用 issues 标签，详见这篇文章： 静态博客使用 Issues API 发布动态、友链、书签https://xaoxuu.com/blog/2020-08-23-issues-api/ 建议两者是可以同时使用的哦，建议开放 issues 友链给大家，常联系的自己再保存到静态友链。实测 GitHub API 速度和稳定性不如 Gitee ，如果追求稳定建议使用 Gitee。 404页面Create file if not exists: source/404.md---cover: truerobots: noindex,nofollowsitemap: falseseo_title: 404 Not Foundbottom_meta: falsesidebar: []valine: path: /404.html placeholder: 请留言告诉我您要访问哪个页面找不到了---{% p logo center huge, 404 %}{% p center bold, 很抱歉，您访问的页面不存在 %}{% p center small, 可能是输入地址有误或该地址已被删除 %} front-matterfront-matter 是文件最上方以 --- 分隔的区域，用于指定个别文件的变量。更多请见 Hexo 官方文档：#front-matter 字段 含义 值类型 默认值 layout 布局模版 String - title 页面标题 String - seo_title 网页标题 String page.title short_title 页面标题（在group列表中显示） String page.title date 创建时间 Date 文件创建时间 updated 更新日期 Date 文件修改时间 link 外部文章网址 String - music 内部音乐控件 [Object] - robots robots String - keywords 页面关键词 String - description 页面描述、摘要 String - cover 是否显示封面 Bool true top_meta 是否显示文章或页面顶部的meta信息 Bool true bottom_meta 是否显示文章或页面底部的meta信息 Bool true sidebar 页面侧边栏 Bool, Array theme.layout.*.sidebar body 页面主体元素 Array theme.layout.on_page.body mathjax 是否渲染公式 Bool, String false thumbnail 缩略图 String false icons 图标 Array [] pin 是否置顶 Bool false headimg 文章头图 url - layout:post 时特有的字段： 字段 含义 值类型 默认值 author 文章作者 [Object] config.author categories 分类 String, Array - tags 标签 String, Array - toc 是否生成目录 Bool true music 字段 是否必须 值类型 server 是 netease, tencent, kugou, xiami, baidu type 是 song, playlist, album, search, artist id 是 song id / playlist id / album id / search keyword 文章置顶在 front-matter 中设置以下值： front-matterpin: true 文章分类多个分类有两种关系，一种是层级（等同于文件夹），一种是并列（等同于标签）。 多级分类： front-matter---categories: [分类A, 分类B]--- 或者 front-matter---categories: - 分类A - 分类B--- 并列分类 front-mattercategories: - [分类A] - [分类B] 多级+并列分类 front-mattercategories: - [分类A, 分类B] - [分类C, 分类D] 文章摘要在文章中插入 <!-- more -->，前面的部分即为摘要。 某篇文章源码---title: xxxdate: 2020-02-21---这是摘要<!-- more -->这是正文 注意： <!-- more --> 前后一定要有空行，不然可能导致显示错位。 设置文章作者Volantis 支持多个作者在一个站点发布文章，其他作者信息需要写在数据文件中，例如： blog/source/_data/author.ymlJon: name: Jon Snow avatar: https://cn.bing.com/th?id=AMMS_fc8f99fd41ebd737a71c4e13806db9a0&w=110&h=110&c=7&rs=1&qlt=80&pcl=f9f9f9&cdv=1&dpr=2&pid=16.1 url: https://gameofthrones.fandom.com/wiki/Jon_SnowDany: name: Daenerys Targaryen avatar: https://tse1-mm.cn.bing.net/th?id=OIP.Yax4wLzIFbcBVUa_RsKywQHaLH&w=80&h=80&c=8&rs=1&qlt=90&dpr=2&pid=3.1&rm=2 url: https://gameofthrones.fandom.com/wiki/Daenerys_Targaryen 在文章的 front-matter 中新增 author 即可： front-matter---title: Jon Snow | Game of Thrones Wiki | Fandomauthor: Jon--- 引入外部文章利用 link，搭配自定义的文章作者信息，你可以在文章列表中显示外部文章或者网址，例如： blog/source/_data/author.ymlxaoxuu: name: xaoxuu avatar: https://cdn.jsdelivr.net/gh/xaoxuu/assets@master/avatar/avatar.png url: https://xaoxuu.com front-matter---layout: postdate: 2017-07-05title: [转]如何搭建基于Hexo的独立博客categories: [Dev, Hexo]tags: - Hexoauthor: xaoxuulink: https://xaoxuu.com/blog/2017-07-05-hexo-blog/---![](https://img.vim-cn.com/d9/a9af7dc49fc0af8ca3e6dd2450a2f7095a87db.png) 置顶对于任何文章或者页面，设置 pin: true 即可置顶在首页。 front-matter---pin: true--- 这会导致一个小问题：首页 post 卡片数量多于设定值，如果有强迫症希望每一个分页数量一致，可以安装插件来实现，详见：#421 不归档存放在 _posts 文件夹下的文章一般都会出现在归档页，如果某篇文章不希望出现在归档页面： front-matter---archive: false--- 页面自定义布局显示迷你音乐播放器标题右边显示迷你音乐播放器，支持的字段有：server、type、id。 front-matter---music: server: netease # netease, tencent, kugou, xiami, baidu type: song # song, playlist, album, search, artist id: 16846091 # song id / playlist id / album id / search keyword--- 实际效果见： #contributors 显示 meta 标签文章顶部和底部的日期、分类、更新日期、标签、分享等属于 meta 标签。 front-matter---top_meta: falsebottom_meta: false--- 如果一个页面没有 title 则不会显示 top_meta ，像404、关于页面就可以完全隐藏： front-matter---seo_title: 关于top_meta: falsebottom_meta: false--- 标题右边显示缩略图front-matter---thumbnail: https://img.vim-cn.com/17/0c7b02722686d1527a1df807dae0794d995860.png--- 缩略图仅在文章列表和文章页面显示，不会在归档页面显示。 标题右边显示图标front-matter---icons: [fas fa-fire red, fas fa-star green]--- 图标仅在归档页面中显示，可以用来标注热门文章。 可以通过 red / blue / green / yellow / orange / theme / accent 来设置图标的颜色 是否要显示封面如果某个页面需要封面，可以这样写： front-matter---cover: true--- 显示侧边栏通过自由设置边栏卡片来删减对应页面的冗余信息，提高有价值的信息在页面中的权重。 如果某个页面不需要侧边栏，可以这样写： front-matter---sidebar: []--- 某个页面想指定显示某几个侧边栏，就这样写: front-matter---sidebar: [grid, toc, tags] # 放置任何你想要显示的侧边栏部件--- 关闭评论front-matter---comments: false--- 渲染公式默认是不渲染的，如果文章内有公式，需要在 front-matter 中设置开启。即便开启了，文章列表中也不会进行渲染，请注意不要把公式写在文章开头。 example.md:---title: 渲染公式（MathJax）date: 2020-02-23mathjax: true # false: 不渲染, true: 渲染---添加一段描述性文字<!-- more -->$$t+1=2$$$$\\mbox{积累因子}=\\begin{cases}1+ni & \\mbox{单利}\\\\\\\\(1+i)^n & \\mbox{复利}\\end{cases}$$$$\\begin{equation}\\sum_{i=0}^n F_i \\cdot \\phi (H, p_i) - \\sum_{i=1}^n a_i \\cdot ( \\tilde{x_i}, \\tilde{y_i}) + b_i \\cdot ( \\tilde{x_i}^2 , \\tilde{y_i}^2 )\\end{equation}$$$$\\begin{equation}\\beta^*(D) = \\mathop{argmin} \\limits_{\\beta} \\lambda {||\\beta||}^2 + \\sum_{i=1}^n max(0, 1 - y_i f_{\\beta}(x_i))\\end{equation}$$ 查看公式渲染效果 $$t+1=2$$$$\\mbox{积累因子}=\\begin{cases}1+ni & \\mbox{单利}\\\\(1+i)^n & \\mbox{复利}\\end{cases}$$$$\\begin{equation}\\sum_{i=0}^n F_i \\cdot \\phi (H, p_i) - \\sum_{i=1}^n a_i \\cdot ( \\tilde{x_i}, \\tilde{y_i}) + b_i \\cdot ( \\tilde{x_i}^2 , \\tilde{y_i}^2 )\\end{equation}$$$$\\begin{equation}\\beta^*(D) = \\mathop{argmin} \\limits_{\\beta} \\lambda {||\\beta||}^2 + \\sum_{i=1}^n max(0, 1 - y_i f_{\\beta}(x_i))\\end{equation}$$ 如果公式仍无法正确渲染可以阅读 @MicDZ 的这篇文章： 在Material-X上使用KaTeXhttps://www.micdz.cn/article/katex-on-volantis/"},{"title":"站点配置","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v4/site-settings/index.html","permalink":"https://volantis.js.org/v4/site-settings/","excerpt":"","text":"博客根目录下的 _config.yml 文件通常负责站点相关配置、第三方 npm 插件相关的配置。 网站标题blog/_config.yml# 网站标题title: my blog 网站图标简单方式完全自定义blog/_config.yml# 网站图标，更多尺寸等图标请使用import方式批量导入favicon: https://cdn.jsdelivr.net/gh/xaoxuu/assets@master/favicon/favicon.icoblog/_config.ymlimport: meta: - <meta name="msapplication-TileColor" content="#ffffff"> - <meta name="msapplication-config" content="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/browserconfig.xml"> - <meta name="theme-color" content="#ffffff"> link: - <link rel="apple-touch-icon" sizes="180x180" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/apple-touch-icon.png"> - <link rel="icon" type="image/png" sizes="32x32" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-32x32.png"> - <link rel="icon" type="image/png" sizes="16x16" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-16x16.png"> - <link rel="manifest" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/site.webmanifest"> - <link rel="mask-icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/safari-pinned-tab.svg" color="#5bbad5"> - <link rel="shortcut icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon.ico"> 多语言设置blog/_config.ymllanguage: - zh-CN - en - zh-HK - zh-TW 对应的翻译文件路径： themes/volantis/languages/ 使用 Import 导入外部文件Volantis 用户可以在不修改主题文件的情况下向 head 和 body 中添加各种标签。meta 和 link 对应 head 中的 <meta> 和 <link> 标签。script 可以在 body 末尾导入 js 代码。 blog/_config.ymlimport: meta: - <meta name="msapplication-TileColor" content="#ffffff"> - <meta name="msapplication-config" content="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/browserconfig.xml"> - <meta name="theme-color" content="#ffffff"> link: - <link rel="apple-touch-icon" sizes="180x180" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/apple-touch-icon.png"> - <link rel="icon" type="image/png" sizes="32x32" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-32x32.png"> - <link rel="icon" type="image/png" sizes="16x16" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-16x16.png"> - <link rel="manifest" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/site.webmanifest"> - <link rel="mask-icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/safari-pinned-tab.svg" color="#5bbad5"> - <link rel="shortcut icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon.ico"> script: - <script></script> 更多Hexo 官方文档 #配置https://hexo.io/zh-cn/docs/configuration"},{"title":"进阶设定","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v5/advanced-settings/index.html","permalink":"https://volantis.js.org/v5/advanced-settings/","excerpt":"","text":"设置子模块 将主题添加为子模块 git submodule add https://github.com/volantis-x/hexo-theme-volantis.git themes/volantis 多人协同默认的作者信息在主题配置文件中设置： blog/themes/volantis/_config.yml# 文章布局article: ... body: ... meta_library: author: avatar: name: 请设置文章作者 url: / Volantis 支持多个作者在一个站点发布文章，其他作者信息需要写在数据文件中，例如： blog/source/_data/author.ymlJon: name: Jon Snow avatar: https://cn.bing.com/th?id=AMMS_fc8f99fd41ebd737a71c4e13806db9a0&w=110&h=110&c=7&rs=1&qlt=80&pcl=f9f9f9&cdv=1&dpr=2&pid=16.1 url: https://gameofthrones.fandom.com/wiki/Jon_SnowDany: name: Daenerys Targaryen avatar: https://tse1-mm.cn.bing.net/th?id=OIP.Yax4wLzIFbcBVUa_RsKywQHaLH&w=80&h=80&c=8&rs=1&qlt=90&dpr=2&pid=3.1&rm=2 url: https://gameofthrones.fandom.com/wiki/Daenerys_Targaryen 在文章的 front-matter 中新增 author 即可： ---title: Jon Snow | Game of Thrones Wiki | Fandomauthor: Jon--- 为网站提速加载速度 减少不必要的 js 插件，例如字数统计、动态背景。 查找并解决拖慢速度的资源，以 Chrome 浏览器为例： 页面中点击右键，选择「检查」。 在右边的窗口中「Network」选项卡，并勾选「Disable cache」。 刷新网页，查看加载速度慢的资源。 加载缓慢的图片，建议使用 CDN。 加载缓慢的可以不用的 js 插件，建议舍弃。 加载缓慢却必须使用的 js 插件，建议下载并自己上传至 jsdelivr。 运行速度 访问具有动态特效背景（如雪花、粒子等）的网站时，手机很快会发烫变卡，笔记本很快会风扇狂转并且浏览器提示建议关闭此页面。如果你希望网站有好的使用体验请尽量不要安装这类插件。 优化 SEOblog/_config.volantis.ymlseo: # When there are no keywords in the article's front-matter, use tags as keywords. use_tags_as_keywords: true # When there is no description in the article's front-matter, use excerpt as the description. use_excerpt_as_description: true robots: home_first_page: index,follow home_other_pages: noindex,follow archive: noindex,follow category: noindex,follow tag: noindex,follow # robots can be written in front-matter 在 front-matter 中，可以设置 keywords、description、robots 和 seo_title。其中 seo_title 仅仅用作网页标题，优先级高于 title。 文章内部不要使用 H1 标题。 通过死链检测工具检查并删除无法访问的链接。 安装 SEO 优化插件： hexo-autonofollowhttps://github.com/liuzc/hexo-autonofollow hexo-generator-seo-friendly-sitemaphttps://github.com/ludoviclefevre/hexo-generator-seo-friendly-sitemap 页面不要堆砌关键词，不要频繁更改路径。 使用 CDN对于大部分将博客 deploy 到 GitHub 的用户来说，直接加载本地资源速度比较慢，可以使用 jsdelivr 为开源项目提供的 CDN 服务。 开启方法blog/_config.volantis.yml# 本地静态文件使用jsdelivr的min版本加速 https://www.jsdelivr.com/features# 默认使用 https://cdn.jsdelivr.net/npm/hexo-theme-volantis@<%- theme.info.theme_version %>/source/js/*.min.js 的CDN压缩版本(min.js)，注意版本号对应关系！！可以通过修改以下配置项覆盖# 开发者注意 cdn.enable 设置为 falsecdn: enable: false prefix: # CDN 前缀，为空使用默认值，链接最后不加 "/",例如： https://cdn.jsdelivr.net/gh/volantis-x/volantis-x.github.io@gh-page 填写最后编译生成的源码CDN地址前缀，此路径下应该含有/js与/css目录,该配置默认值是："https://cdn.jsdelivr.net/npm/hexo-theme-volantis@"+ theme.info.theme_version +"/source" # 以下配置可以覆盖 cdn.prefix,配置项的值可以为空，但是要使用CDN必须依据路径填写配置项的键 set: js: app: #/js/app.js css: style: #/css/style.css # (异步加载样式) 如果你需要对样式进行 DIY，可以只关闭 style 文件的 CDN。 从V5版本开始，首屏样式采用硬编码的方式写在HTML中。首屏样式内含 cover navbar search 的样式，其他样式放入/css/style.css异步加载。 如果你需要对样式进行 DIY，请注意首屏渲染和异步延迟加载的差异。 可以对 style.css 使用 HTTP/2 Server Push，但是此方案并不推荐。我们已经对style.css进行了preload处理，推荐使用对服务器压力成本较小的 CDN 服务。 自定义 CDN如果你把对应的文件上传到自己的 CDN 服务器，可以把对应的链接改为自己的 CDN 链接。 尝试使用 Terser 压缩 ES6安装压缩工具npm install -g gulpnpm install --save-dev gulp gulp-html-minifier-terser gulp-htmlclean gulp-htmlmin gulp-minify-css gulp-terser gulp 配置文件 gulp 配置文件 blog/gulpfile.jsvar gulp = require('gulp');var minifycss = require('gulp-minify-css');var htmlmin = require('gulp-html-minifier-terser');var htmlclean = require('gulp-htmlclean');var terser = require('gulp-terser');// 压缩css文件const minify_css = () => ( gulp.src(['./public/**/*.css']) .pipe(minifycss()) .pipe(gulp.dest('./public')));// 压缩html文件const minify_html = () => ( gulp.src(['./public/**/*.html','!./public/{lib,lib/**}']) .pipe(htmlclean()) .pipe(htmlmin({ removeComments: true, minifyJS: true, minifyCSS: true, minifyURLs: true, })) .pipe(gulp.dest('./public')))// 压缩js文件const minify_js = () => ( gulp.src(['./public/**/*.js', '!./public/**/*.min.js','!./public/{lib,lib/**}']) .pipe(terser()) .pipe(gulp.dest('./public')))module.exports = { minify_html: minify_html, minify_css: minify_css, minify_js: minify_js};gulp.task('one', gulp.parallel( minify_html, minify_css, minify_js))gulp.task('default', gulp.series('one')); 运行压缩gulp 安装 Service Worker 服务方案一 安装插件安装 hexo-offline-popup 或者 hexo-offline 插件，初次加载速度不变，后期切换页面和刷新网页速度越来越快。 方案二 使用 workbox 自定义配置 step 1. 修改 blog/_config.yml 文件。 blog/_config.yml# 全局导入import: script: - <script>"serviceWorker"in navigator&&navigator.serviceWorker.register("/sw.js").then(function(n){n.onupdatefound=function(){var e=n.installing;e.onstatechange=function(){switch(e.state){case"installed":navigator.serviceWorker.controller?console.log("Updated serviceWorker."):console.log("serviceWorker Sucess!");break;case"redundant":console.log("The installing service worker became redundant.")}}}}).catch(function(e){console.log("Error during service worker registration:",e)}); </script> step 2. 在 blog/source 中创建 sw.js 文件。 blog/source/sw.jsimportScripts('https://cdn.jsdelivr.net/npm/workbox-cdn@5.1.3/workbox/workbox-sw.js');workbox.setConfig({ modulePathPrefix: 'https://cdn.jsdelivr.net/npm/workbox-cdn@5.1.3/workbox/'});const { core, precaching, routing, strategies, expiration, cacheableResponse, backgroundSync } = workbox;const { CacheFirst, NetworkFirst, NetworkOnly, StaleWhileRevalidate } = strategies;const { ExpirationPlugin } = expiration;const { CacheableResponsePlugin } = cacheableResponse;const cacheSuffixVersion = '-000010', // 缓存版本号 极端重要，修改静态文件后发布网页一定要修改缓存版本号 maxEntries = 100;self.addEventListener('activate', (event) => { event.waitUntil( caches.keys().then((keys) => { return Promise.all(keys.map((key) => { if (!key.includes(cacheSuffixVersion)) return caches.delete(key); })); }) );});core.setCacheNameDetails({ prefix: 'volantis', // 极端重要 自己拟定一个名字 suffix: cacheSuffixVersion});core.skipWaiting();core.clientsClaim();precaching.cleanupOutdatedCaches();/* * Precache * - Static Assets */precaching.precacheAndRoute( // 极端重要 定义首次缓存的静态文件 如果开启CDN需要修改为CDN链接 [ { url: '/css/first.css', revision: null }, { url: '/css/style.css', revision: null }, { url: '/js/app.js', revision: null }, ],);/* * Cache File From CDN * * Method: CacheFirst * cacheName: static-immutable * cacheTime: 30d */// cdn.jsdelivr.net - cors enabledrouting.registerRoute( /.*cdn\\.jsdelivr\\.net/, new CacheFirst({ cacheName: 'static-immutable' + cacheSuffixVersion, fetchOptions: { mode: 'cors', credentials: 'omit' }, plugins: [ new ExpirationPlugin({ maxAgeSeconds: 30 * 24 * 60 * 60, purgeOnQuotaError: true }) ] }));// m7.music.126.net - cors enabledrouting.registerRoute( /.*m7\\.music\\.126\\.net/, new CacheFirst({ cacheName: 'static-immutable' + cacheSuffixVersion, fetchOptions: { mode: 'cors', credentials: 'omit' }, plugins: [ new ExpirationPlugin({ maxAgeSeconds: 30 * 24 * 60 * 60, purgeOnQuotaError: true }) ] }));/* * No Cache * * Method: networkOnly */routing.registerRoute( /.*baidu\\.com.*/, new NetworkOnly());/* * Others img fonts * Method: staleWhileRevalidate */routing.registerRoute( // Cache image fonts files /.*\\.(?:png|jpg|jpeg|svg|gif|webp|ico|eot|ttf|woff|woff2|mp3)/, new StaleWhileRevalidate());/* * Static Assets * Method: staleWhileRevalidate */routing.registerRoute( // Cache CSS files /.*\\.(css|js)/, // Use cache but update in the background ASAP new StaleWhileRevalidate());/* * sw.js - Revalidate every time * staleWhileRevalidate */routing.registerRoute( '/sw.js', // 本文件名 new StaleWhileRevalidate());/* * Default - Serve as it is * networkFirst */routing.setDefaultHandler( new NetworkFirst({ networkTimeoutSeconds: 3 })); 如果你使用了此方案，修改静态文件后发布网页一定要修改缓存版本号。 安装「相关文章」插件 安装插件 npm i -S hexo-related-popular-posts 插件的自定义配置方法： hexo-related-popular-postshttps://github.com/tea3/hexo-related-popular-posts 如果您使用了头图，可以在站点配置文件中添加以下设置来让相关文章显示正确的文章头图： blog/_config.ymlpopularPosts: eyeCatchImageAttributeName: headimg 注意需要升级到 5.0.1 及以上版本才可以支持自定义头图，详见 #29 分析与统计默认支持 不蒜子 的访问统计，可以自行添加百度统计和 Google Analytics。 字数和阅读时长 安装以下插件：npm i --save hexo-wordcount 修改配置文件，将 wordcount 插件打开blog/_config.volantis.ymlplugins: ... # 文章字数统计、阅读时长，开启需要安装插件: npm i --save hexo-wordcount wordcount: enable: #true 然后修改配置文件，将 wordcount 写入需要显示的 meta 位置：blog/_config.volantis.yml# 文章布局article: ... # 文章详情页面的文章卡片本体布局方案 body: # 文章顶部信息 # 从 meta_library 中取 top_meta: [..., wordcount, ...] ... # 文章底部信息 # 从 meta_library 中取 bottom_meta: [..., wordcount, ...] CNZZ 统计请参考 ZYMIN 的这篇教程： Hexo hexo+ejs+material x 添加CNZZ统计代码https://zymin.cn/arcticle/hexo+ejs+material.html 更多进阶玩法详见 @TRHX 的这篇博客： Hexo 博客主题个性化https://www.itrhx.com/2018/08/27/A04-Hexo-blog-topic-personalization/ 内含卡片半透明、增加卡通人物、自定义鼠标样式、鼠标特效、烟花特效、彩色滚动字体、网站运行时间、动态浏览器标题、雪花飘落特效等多种详细教程。 主题官网 #进阶玩法https://volantis.js.org/categories/进阶玩法/"},{"title":"开发文档","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v5/development-api/index.html","permalink":"https://volantis.js.org/v5/development-api/","excerpt":"","text":" Volantis5 Development API for Volantis 全局变量 volantis我们提供了全局变量 volantis 和一些全局函数等主题开发调用接口。 源码参考：layout/_partial/scripts/global.ejs PjaxPjax 重载区域划分接口我们提供了可以实现Pjax重载区域灵活划分的开发接口。 源码参考：layout/_third-party/pjax/index.ejs <pjax></pjax> 标签所有被 <pjax></pjax> 标签包裹的所有元素将被pjax重载。 <pjax> <!--我是将被pjax重载的内容 begin--> <div> <div></div> <script></script> </div> <!--我是将被pjax重载的内容 end--></pjax> 使用案例：layout/_partial/snackbar.ejs script[data-pjax]所有含有 data-pjax 标记的 script 标签将被pjax重载。 <script data-pjax>我是将被pjax重载的内容</script> .pjax-reload script所有在 pjax-reload Class元素内部的 script 标签将被pjax重载。 <div class="pjax-reload"> <div> <div>我不是将被pjax重载的内容</div> <script>我是将被pjax重载的内容</script> </div></div> Pjax 回调方法我们提供了灵活的 Pjax 回调方法。 源码参考： layout/_partial/scripts/global.ejs layout/_third-party/pjax/index.ejs 使用案例：layout/_third-party/pjax/animate.ejs 中括号[]里面的内容表示选项是可选的，可以不填。下同，不再赘述。 volantis.pjax.push 在Pjax请求完成后触发。使用 volantis.pjax.push(callBack[,"callBackName"]) 传入pjax:complete回调函数。 callBack是回调函数,必填。 "callBackName" string类型 默认值是回调函数的函数名，选填。 volantis.pjax.send 在Pjax请求开始后触发。使用 volantis.pjax.send(callBack[,"callBackName"]) 传入pjax:send回调函数。 callBack是回调函数,必填。 "callBackName" string类型 默认值是回调函数的函数名，选填。 volantis.pjax.error 在Pjax请求失败后触发。使用 volantis.pjax.error(callBack[,"callBackName"]) 传入pjax:error回调函数。 callBack是回调函数,必填。 "callBackName" string类型 默认值是回调函数的函数名，选填。 暗黑模式我们提供了暗黑模式灵活的开发接口。 源码参考： layout/_partial/scripts/global.ejs layout/_partial/scripts/darkmode.ejs 暗黑模式样式详见：source/css/_plugins/dark.styl 当前模式调用 volantis.dark.mode 查看当前模式。返回值为字符串 dark 或者 light。 暗黑模式触发器调用 volantis.dark.toggle() 触发切换亮黑模式。 暗黑模式触发器回调函数调用 volantis.dark.push(callBack[,"callBackName"]) 传入触发器回调函数. 使用案例：layout/_third-party/comments/utterances/script.ejs Message 消息提示我们提供了 Message 消息提示灵活的开发接口。 源码参考： layout/_partial/scripts/global.ejs layout/_third-party/message/script.ejs volantis.message("title","message","type",autoClose,time) 参数都是String类型，可选的。 title 标题 message 信息 type 图标类型 【info、warning、error、question】 autoClose 自动关闭 time 显示时间，默认3秒 动态加载脚本源码参考： layout/_partial/scripts/global.ejs volantis.js("src", cb)volantis.css("src") src String类型 加载脚本URL cb 可选 可以传入onload回调函数 或者 JSON对象 例如: volantis.js("src", ()=>{}) 或 volantis.js("src", {defer:true,onload:()=>{}}) 返回 Promise 对象 如下方法同步加载资源，这利于处理文件资源之间的依赖关系，例如：APlayer 需要在 MetingJS 之前加载 (async () => { await volantis.js("...theme.plugins.aplayer.js.aplayer...") await volantis.js("...theme.plugins.aplayer.js.meting...")})(); 使用案例：layout/_third-party/aplayer/script.ejs 由于返回的是 Promise 对象，也可以采用以下方式实现加载完成后调用回调函数： volantis.js("https://cdn.jsdelivr.net/npm/jquery").then(()=>{ console.log("我在脚本加载完成后调用")}) 对本地文件使用CDN源码参考： layout/_partial/scripts/cdnCtrl.ejs theme.cdn.addJS("name","source","force")theme.cdn.addCSS("name","source","force") 参数都为 String 类型，其中 source 和 force 是可选的。 返回值为 CDN 处理后的链接，并存入theme.cdn.map.js和theme.cdn.map.css中 可以使用theme.cdn.map.js["name"]再次调用。 "name" 是自定义名称 "source" 是资源路径 "force" 是强制覆盖的资源路径 如果"source"为空，则将"name"赋值给"source"。 例如： 对于文件source/js/plugins/sites.js使用CND链接，使用如下方法生成。 theme.cdn.addJS("sites","plugins/sites") 生成的CDN链接可使用 theme.cdn.map.js.sites 回调。 以下用于配置项 cdn.set 覆盖配置,下面是覆盖配置的方法 cdn: enable: true # 以下配置可以覆盖 cdn.prefix,配置项的值可以为空，但是要使用CDN必须依据路径填写配置项的键 set: js: app: https://cdn.jsdelivr.net/gh/volantis-x/volantis-x.github.io@gh-page/js/app.js rightMenu: https://cdn.jsdelivr.net/gh/volantis-x/volantis-x.github.io@gh-page/js/rightMenu.js parallax: https://cdn.jsdelivr.net/gh/volantis-x/volantis-x.github.io@gh-page/js/jquery.parallax.min.js plugins: contributors: https://cdn.jsdelivr.net/gh/volantis-x/volantis-x.github.io@gh-page/js/plugins/contributors.js friends: https://cdn.jsdelivr.net/gh/volantis-x/volantis-x.github.io@gh-page/js/plugins/friends.js sites: https://cdn.jsdelivr.net/gh/volantis-x/volantis-x.github.io@gh-page/js/plugins/sites.js css: style: https://cdn.jsdelivr.net/gh/volantis-x/volantis-x.github.io@gh-page/css/style.css message: https://cdn.jsdelivr.net/gh/volantis-x/volantis-x.github.io@gh-page/css/message.css 直接使用cdn配置项，不使用theme.cdn.addJS("sites","plugins/sites") 也可以生成 theme.cdn.map.js.sites CDN链接回调 请注意，以上是主题开发文档，不是使用文档！"},{"title":"","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v5/getting-started/index.html","permalink":"https://volantis.js.org/v5/getting-started/","excerpt":"","text":" Volantis5 A Wonderful Theme for Hexo Volantis 是一个功能丰富、高度模块化的 Hexo 博客主题。得益于其强大的模块化特性，您可以轻松搭建一个极简风格的博客，也可以仿照官网搭建一个多人协作的、包含文档模块的大体量综合型博客。 示例博客https://volantis.js.org/examples/ 所有的 Volantis 用户都可以按照格式自行创建 Issue 来将自己的博客添加到官网的示例博客页面中。 准备工作能力条件环境配置条件自建博客需要一定的相关知识，在开始前，请务必确保您会使用 markdown 语法，掌握简单的 git 知识，最最重要的是，遇到困难知道该怎么寻求解决： 翻阅和搜索文档 搜索 issues 中是否有解决办法 新建 issue 并按照要求进行操作，详尽地描述您遇到的问题 如果您没有使用过 Hexo 也不要着急，可以先通读一遍 Hexo 中文文档，要想使用地得心应手，最好参照团队提供的开源项目的源码进行搭建： Demo 源码 ｜ 官网源码如果您从旧版本更新或着其它主题迁移，请确保环境版本不要太低，否则会产生兼容性问题。 Hexo: 4.2 ~ 5.xhexo-cli: 3.1 ~ 4.xnode.js: 12.16 ~ latest # 推荐使用 LTS 版npm: 6.13 ~ latest 快速体验如果您已经具备环境配置条件，可以在终端中输入下面这行代码，稍等片刻即可尝鲜体验： git clone https://github.com/volantis-x/demo.git && cd demo && npm i && hexo s 下载与安装全新博客安装从其它主题迁移第 1/2 步：修改站点配置文件 在 blog/_config.yml 文件中找到并修改：theme: volantis 第 2/2 步：下载主题 在终端中输入：npm i hexo-theme-volantis 如果您是 Mac 用户，可以使用脚本完成全部流程 在博客路径打开终端，下载安装并应用主题：curl -s https://volantis.js.org/start | bash这行命令将会自动检测并安装所需环境，初始化博客，然后下载安装并应用主题。脚本详细使用方法：#hexo.sh 第 1/3 步：修改站点配置文件 在 blog/_config.yml 文件中找到并修改：theme: volantis 第 2/3 步：下载主题 如果您已经升级到 Hexo 5.0.2 及以上，可以直接使用 npm 命令安装：npm i hexo-theme-volantis对于旧版本，需要下载主题源码到 themes/ 文件夹：git clone https://github.com/volantis-x/hexo-theme-volantis themes/volantis如果您无法访问 GitHub 可以使用国内镜像源：git clone https://e.coding.net/volantis-x/p/hexo-theme-volantis.git themes/volantis 第 3/3 步：检查并安装依赖 安装 Hexo 搜索的依赖包：npm i hexo-generator-search hexo-generator-json-content安装 Stylus 渲染器：npm i hexo-renderer-stylus 版本更新注意事项使用主题的时候，尽量 fork 主题到自己的 GitHub，然后进行修改并使用。这样做的好处是：当主题进行重要更新的时候可以根据需要拉取合并代码，使自己 DIY 的主题能够通过更新获取 BUG 修复或者新特性。 如果不懂请自行搜索关键词：fork 更新 实用小技巧所有需要写在主题配置文件中的配置都可以写在站点配置文件的 theme_config: 中，在 Hexo 5.0 后，还可以写在 _config.volantis.yml 文件中，详见 Hexo 官方文档：覆盖主题配置https://hexo.io/zh-cn/docs/configuration#%E8%A6%86%E7%9B%96%E4%B8%BB%E9%A2%98%E9%85%8D%E7%BD%AE也可以直接查看本站源码中站点配置文件的写法：_config.volantis.yml 请对照 更新日志 进行更新. 许可协议本主题采用 MIT开源许可协议 ，永久无限制免费使用。 MIT开源许可协议被授权人有权利使用、复制、修改、合并、出版发行、散布、再授权及贩售软件及软件的副本。被授权人可根据程式的需要修改授权条款为适当的内容。在软件和软件的所有副本中都必须包含版权声明和许可声明。 配置与使用配置与使用/v4/site-settings/"},{"title":"页面配置","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v5/page-settings/index.html","permalink":"https://volantis.js.org/v5/page-settings/","excerpt":"","text":"页面布局模板布局模板 取值 含义 page 独立页面 post 文章页面 docs 文档页面 category 分类页面 tag 标签页面 friends 友链页面 list 列表页面 artitalk 说说页面 page & post & docs这三种页面相同，但是有以下细微区别： post 文章有 title 时，向下滚动网页，导航栏会向上移出屏幕显出文章标题，而 page 和 docs 不会。 post 文章末尾最多可以显示「参考资料」、「相关文章」、「版权标识」、「打赏」四个模块。 docs 文章末尾最多可以显示「参考资料」一个模块。 除了归档页面是自动生成的，其它独立页面都需要手动创建 md 文件。 归档页面归档页面是自动生成的，并且初始化的时候已经生成，路径如下： blog/_config.yml# Directoryarchive_dir: archives 关于页面Create file if not exists: source/about/index.md---layout: docsseo_title: 关于bottom_meta: falsesidebar: []valine: placeholder: 有什么想对我说的呢？---下面写关于自己的内容 分类页面Create file if not exists: source/categories/index.md---layout: categoryindex: truetitle: 所有分类--- 标签页面Create file if not exists: source/tags/index.md---layout: tagindex: truetitle: 所有标签--- 列表页面Create file if not exists: source/mylist/index.md---layout: listgroup: mylistindex: true--- 结果就是筛选出所有文章中 front-matter 部分含有 group: mylist 的文章。 友链页面创建页面文件Create file if not exists: source/friends/index.md---layout: friends # 必须title: 我的朋友们 # 可选，这是友链页的标题---这里写友链上方的内容。<!-- more -->这里可以写友链页面下方的文字备注，例如自己的友链规范、示例等。 选择布局方案在主题配置文件中找到以下内容： pages: # 友链页面配置 friends: layout_scheme: traditional # simple: 简单布局, traditional: 传统布局, sites: 网站卡片布局 目前提供三种布局方案： simple: 简单布局，只有头像和标题。 traditional: 传统布局，是 Volantis 旧版本的风格。 sites: 网站卡片布局，是 Volantis 4.x 新增的网站卡片标签的样式。 设置数据源静态数据源动态数据源友链的数据源写在以下路径，如果没有请自行创建： blog/source/_data/friends.yml 内容格式为： blog/source/_data/friends.yml- group: # 分组标题 description: # 分组描述 items: - title: # 名称 avatar: # 头像 url: # 链接 screenshot: # 截图 keywords: # 关键词 description: # 描述 - title: # 名称 avatar: # 头像 url: # 链接 screenshot: # 截图 keywords: # 关键词 description: # 描述 不同的布局方式，会用到一部分的字段，一般来说，title、avatar 和 url 都是必须的。这些数据被转成 HTML 标签插入到友链页面的 <!-- more --> 部分。使用 issues 标签可以从 issues 中获取 JSON 数据解析并生成 HTML 填充到页面中，使用方法如下： {% issues sites | api=https://api.github.com/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=active %} 这样添加友链的方式就变成了：对方提 Issue ，自己审核，然后添加 active 标签，然后刷新网页就生效了。更新友链内容也变得十分方便， Issue 的创建者拥有修改和关闭的权限。 新建一个 GitHub 或者 Gitee 仓库，创建 Issues 模板，如下： { "title": "", "screenshot": "", "url": "", "avatar": "", "description": "", "keywords": ""} 关于如何使用 issues 标签，详见这篇文章： 静态博客使用 Issues API 发布动态、友链、书签https://xaoxuu.com/blog/2020-08-23-issues-api/ 建议两者是可以同时使用的哦，建议开放 issues 友链给大家，常联系的自己再保存到静态友链。实测 GitHub API 速度和稳定性不如 Gitee ，如果追求稳定建议使用 Gitee。 Artitalk页面创建页面文件Create file if not exists: source/artitalk/index.md---layout: artitalkseo_title: 说说comments: false--- 配置Artitalk在主题配置文件中找到以下内容 artitalk: # Set `layout: artitalk` to enable in page # 配置项按照yml格式继续填写即可 appId: # your appID appKey: # your appKEY # serverURL: #leancloud绑定的安全域名，使用国际版的话不需要填写 # lang: # 语言设置，zh为汉语，en为英语，es为西班牙语。默认为汉语 # pageSize: #每页说说的显示数量 # shuoPla: #在编辑说说的输入框中的占位符 # avatarPla: #自定义头像url的输入框的占位符 # motion: #加载动画的开关，1为开，0为关，默认为开 # bgImg: #说说输入框背景图片url # color1: #说说背景颜色1&按钮颜色1 # color2: #说说背景颜色2&按钮颜色2 # color3: #说说字体颜色 # cssUrl: #自定义css接口 最后记得屏蔽Artitalk页面的pjax 404页面Create file if not exists: source/404.md---cover: truerobots: noindex,nofollowsitemap: falseseo_title: 404 Not Foundbottom_meta: falsesidebar: []valine: path: /404.html placeholder: 请留言告诉我您要访问哪个页面找不到了---{% p logo center huge, 404 %}{% p center bold, 很抱歉，您访问的页面不存在 %}{% p center small, 可能是输入地址有误或该地址已被删除 %} front-matterfront-matter 是文件最上方以 --- 分隔的区域，用于指定个别文件的变量。更多请见 Hexo 官方文档：#front-matter 字段 含义 值类型 默认值 layout 布局模版 String - title 页面标题 String - seo_title 网页标题 String page.title short_title 页面标题（在group列表中显示） String page.title date 创建时间 Date 文件创建时间 updated 更新日期 Date 文件修改时间 link 外部文章网址 String - music 内部音乐控件 [Object] - robots robots String - keywords 页面关键词 String - description 页面描述、摘要 String - cover 是否显示封面 Bool true top_meta 是否显示文章或页面顶部的meta信息 Bool true bottom_meta 是否显示文章或页面底部的meta信息 Bool true sidebar 页面侧边栏 Bool, Array theme.layout.*.sidebar body 页面主体元素 Array theme.layout.on_page.body mathjax 是否渲染公式 Bool, String false thumbnail 缩略图 String false icons 图标 Array [] pin 是否置顶 Bool false headimg 文章头图 url - layout:post 时特有的字段： 字段 含义 值类型 默认值 author 文章作者 [Object] config.author categories 分类 String, Array - tags 标签 String, Array - toc 是否生成目录 Bool true music 字段 是否必须 值类型 server 是 netease, tencent, kugou, xiami, baidu type 是 song, playlist, album, search, artist id 是 song id / playlist id / album id / search keyword 文章置顶在 front-matter 中设置以下值： front-matterpin: true 文章分类多个分类有两种关系，一种是层级（等同于文件夹），一种是并列（等同于标签）。 多级分类： front-matter---categories: [分类A, 分类B]--- 或者 front-matter---categories: - 分类A - 分类B--- 并列分类 front-mattercategories: - [分类A] - [分类B] 多级+并列分类 front-mattercategories: - [分类A, 分类B] - [分类C, 分类D] 文章摘要在文章中插入 <!-- more -->，前面的部分即为摘要。 某篇文章源码---title: xxxdate: 2020-02-21---这是摘要<!-- more -->这是正文 注意： <!-- more --> 前后一定要有空行，不然可能导致显示错位。 设置文章作者Volantis 支持多个作者在一个站点发布文章，其他作者信息需要写在数据文件中，例如： blog/source/_data/author.ymlJon: name: Jon Snow avatar: https://cn.bing.com/th?id=AMMS_fc8f99fd41ebd737a71c4e13806db9a0&w=110&h=110&c=7&rs=1&qlt=80&pcl=f9f9f9&cdv=1&dpr=2&pid=16.1 url: https://gameofthrones.fandom.com/wiki/Jon_SnowDany: name: Daenerys Targaryen avatar: https://tse1-mm.cn.bing.net/th?id=OIP.Yax4wLzIFbcBVUa_RsKywQHaLH&w=80&h=80&c=8&rs=1&qlt=90&dpr=2&pid=3.1&rm=2 url: https://gameofthrones.fandom.com/wiki/Daenerys_Targaryen 在文章的 front-matter 中新增 author 即可： front-matter---title: Jon Snow | Game of Thrones Wiki | Fandomauthor: Jon--- 引入外部文章利用 link，搭配自定义的文章作者信息，你可以在文章列表中显示外部文章或者网址，例如： blog/source/_data/author.ymlxaoxuu: name: xaoxuu avatar: https://cdn.jsdelivr.net/gh/xaoxuu/assets@master/avatar/avatar.png url: https://xaoxuu.com front-matter---layout: postdate: 2017-07-05title: [转]如何搭建基于Hexo的独立博客categories: [Dev, Hexo]tags: - Hexoauthor: xaoxuulink: https://xaoxuu.com/blog/2017-07-05-hexo-blog/---![](https://img.vim-cn.com/d9/a9af7dc49fc0af8ca3e6dd2450a2f7095a87db.png) 置顶对于任何文章或者页面，设置 pin: true 即可置顶在首页。 front-matter---pin: true--- 这会导致一个小问题：首页 post 卡片数量多于设定值，如果有强迫症希望每一个分页数量一致，可以安装插件来实现，详见：#421 不归档存放在 _posts 文件夹下的文章一般都会出现在归档页，如果某篇文章不希望出现在归档页面： front-matter---archive: false--- 页面自定义布局显示迷你音乐播放器标题右边显示迷你音乐播放器，支持的字段有：server、type、id。 front-matter---music: server: netease # netease, tencent, kugou, xiami, baidu type: song # song, playlist, album, search, artist id: 16846091 # song id / playlist id / album id / search keyword--- 实际效果见： #contributors 显示 meta 标签文章顶部和底部的日期、分类、更新日期、标签、分享等属于 meta 标签。 front-matter---top_meta: falsebottom_meta: false--- 如果一个页面没有 title 则不会显示 top_meta ，像404、关于页面就可以完全隐藏： front-matter---seo_title: 关于top_meta: falsebottom_meta: false--- 标题右边显示缩略图front-matter---thumbnail: https://img.vim-cn.com/17/0c7b02722686d1527a1df807dae0794d995860.png--- 缩略图仅在文章列表和文章页面显示，不会在归档页面显示。 标题右边显示图标front-matter---icons: [fas fa-fire red, fas fa-star green]--- 图标仅在归档页面中显示，可以用来标注热门文章。 可以通过 red / blue / green / yellow / orange / theme / accent 来设置图标的颜色 是否要显示封面如果某个页面需要封面，可以这样写： front-matter---cover: true--- 显示侧边栏通过自由设置边栏卡片来删减对应页面的冗余信息，提高有价值的信息在页面中的权重。 如果某个页面不需要侧边栏，可以这样写： front-matter---sidebar: []--- 某个页面想指定显示某几个侧边栏，就这样写: front-matter---sidebar: [grid, toc, tags] # 放置任何你想要显示的侧边栏部件--- 关闭评论front-matter---comments: false--- 渲染公式默认是不渲染的，如果文章内有公式，需要在 front-matter 中设置开启。即便开启了，文章列表中也不会进行渲染，请注意不要把公式写在文章开头。 example.md:---title: 渲染公式（MathJax）date: 2020-02-23mathjax: true # false: 不渲染, true: 渲染---添加一段描述性文字<!-- more -->$$t+1=2$$$$\\mbox{积累因子}=\\begin{cases}1+ni & \\mbox{单利}\\\\\\\\(1+i)^n & \\mbox{复利}\\end{cases}$$$$\\begin{equation}\\sum_{i=0}^n F_i \\cdot \\phi (H, p_i) - \\sum_{i=1}^n a_i \\cdot ( \\tilde{x_i}, \\tilde{y_i}) + b_i \\cdot ( \\tilde{x_i}^2 , \\tilde{y_i}^2 )\\end{equation}$$$$\\begin{equation}\\beta^*(D) = \\mathop{argmin} \\limits_{\\beta} \\lambda {||\\beta||}^2 + \\sum_{i=1}^n max(0, 1 - y_i f_{\\beta}(x_i))\\end{equation}$$ 查看公式渲染效果 $$t+1=2$$$$\\mbox{积累因子}=\\begin{cases}1+ni & \\mbox{单利}\\\\(1+i)^n & \\mbox{复利}\\end{cases}$$$$\\begin{equation}\\sum_{i=0}^n F_i \\cdot \\phi (H, p_i) - \\sum_{i=1}^n a_i \\cdot ( \\tilde{x_i}, \\tilde{y_i}) + b_i \\cdot ( \\tilde{x_i}^2 , \\tilde{y_i}^2 )\\end{equation}$$$$\\begin{equation}\\beta^*(D) = \\mathop{argmin} \\limits_{\\beta} \\lambda {||\\beta||}^2 + \\sum_{i=1}^n max(0, 1 - y_i f_{\\beta}(x_i))\\end{equation}$$ 如果公式仍无法正确渲染可以阅读 @MicDZ 的这篇文章： 在Material-X上使用KaTeXhttps://www.micdz.cn/article/katex-on-volantis/"},{"title":"站点配置","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v5/site-settings/index.html","permalink":"https://volantis.js.org/v5/site-settings/","excerpt":"","text":"博客根目录下的 _config.yml 文件通常负责站点相关配置、第三方 npm 插件相关的配置。 网站标题blog/_config.yml# 网站标题title: my blog 网站图标简单方式完全自定义blog/_config.yml# 网站图标，更多尺寸等图标请使用import方式批量导入favicon: https://cdn.jsdelivr.net/gh/xaoxuu/assets@master/favicon/favicon.icoblog/_config.ymlimport: meta: - <meta name="msapplication-TileColor" content="#ffffff"> - <meta name="msapplication-config" content="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/browserconfig.xml"> - <meta name="theme-color" content="#ffffff"> link: - <link rel="apple-touch-icon" sizes="180x180" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/apple-touch-icon.png"> - <link rel="icon" type="image/png" sizes="32x32" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-32x32.png"> - <link rel="icon" type="image/png" sizes="16x16" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-16x16.png"> - <link rel="manifest" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/site.webmanifest"> - <link rel="mask-icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/safari-pinned-tab.svg" color="#5bbad5"> - <link rel="shortcut icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon.ico"> 多语言设置blog/_config.ymllanguage: - zh-CN - en - zh-HK - zh-TW 对应的翻译文件路径： themes/volantis/languages/ 使用 Import 导入外部文件Volantis 用户可以在不修改主题文件的情况下向 head 和 body 中添加各种标签。meta 和 link 对应 head 中的 <meta> 和 <link> 标签。script 可以在 body 末尾导入 js 代码。 blog/_config.ymlimport: meta: - <meta name="msapplication-TileColor" content="#ffffff"> - <meta name="msapplication-config" content="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/browserconfig.xml"> - <meta name="theme-color" content="#ffffff"> link: - <link rel="apple-touch-icon" sizes="180x180" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/apple-touch-icon.png"> - <link rel="icon" type="image/png" sizes="32x32" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-32x32.png"> - <link rel="icon" type="image/png" sizes="16x16" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-16x16.png"> - <link rel="manifest" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/site.webmanifest"> - <link rel="mask-icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/safari-pinned-tab.svg" color="#5bbad5"> - <link rel="shortcut icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon.ico"> script: - <script></script> 更多Hexo 官方文档 #配置https://hexo.io/zh-cn/docs/configuration"},{"title":"页面自定义布局","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/page-settings/body/index.html","permalink":"https://volantis.js.org/v3/page-settings/body/","excerpt":"","text":"正文布局默认是文章+评论： front-matter---body: [article, comments]--- 如果你想把相关文章卡片显示在评论前，可以这样写： front-matter---body: [article, related_posts, comments]--- 如果想全局修改，在主题配置文件中的 layout.on_page.body 中设置。 显示迷你音乐播放器标题右边显示迷你音乐播放器，支持的字段有：server、type、id。 front-matter---music: server: netease # netease, tencent, kugou, xiami, baidu type: song # song, playlist, album, search, artist id: 16846091 # song id / playlist id / album id / search keyword--- 实际效果见： #contributors 显示 meta 标签文章顶部和底部的日期、分类、更新日期、标签、分享等属于 meta 标签。顶部的为 header，底部的为 footer，取值见主题配置文件中的 meta 库。 front-matter---# 默认的meta信息，文章中没有配置则按照这里的配置来显示，设置为false则不显示# 其中，title只在header中有效，music和thumbnail无需在这里设置，文章中有则显示# 如果tags放置在meta.header中，那么在post列表中不显示（因为卡片下方已经有了）meta: header: [title, author, date, category, counter, top] footer: [updated, tags, share]--- 像404、关于页面就可以完全隐藏： front-matter---meta: header: [] footer: []--- 居中标题模式如果标题居中且下方不想显示任何 meta 信息，可以这样设置： front-matter---meta: header: [centertitle]--- 标题右边显示缩略图front-matter---thumbnail: https://img.vim-cn.com/17/0c7b02722686d1527a1df807dae0794d995860.png--- 缩略图仅在文章列表和文章页面显示，不会在归档页面显示。 标题右边显示图标front-matter---icons: [fas fa-fire red, fas fa-star green]--- 图标仅在归档页面中显示，可以用来标注热门文章。 可以通过 red / blue / green / yellow / orange / theme / accent 来设置图标的颜色 meta 区域显示外链按钮例如当前文档页面的设置： front-matter---meta: footer: [btns]btns: repo: https://github.com/volantis-x/hexo-theme-volantis bug: https://github.com/volantis-x/hexo-theme-volantis/issues/ doubt: https://github.com/volantis-x/hexo-theme-volantis/issues/ idea: https://github.com/volantis-x/hexo-theme-volantis/issues/--- 按钮的颜色、图标、标题在主题配置文件中设置。 是否要显示封面如果某个页面需要封面，可以这样写： front-matter---cover: true--- 显示侧边栏通过自由设置边栏卡片来删减对应页面的冗余信息，提高有价值的信息在页面中的权重。 如果某个页面不需要侧边栏，可以这样写： front-matter---sidebar: []--- 某个页面想指定显示某几个侧边栏，就这样写: front-matter---sidebar: [grid, toc, tags] # 放置任何你想要显示的侧边栏部件--- 关闭评论默认是 body: [article, comments]，如果某个页面不要评论，只需要去掉 comments 即可。 front-matter---body: [article]--- 只显示留言板如果你想创建一个只有留言板的页面 front-matter---body: [comments]---"},{"title":"front-matter","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/page-settings/front-matter/index.html","permalink":"https://volantis.js.org/v3/page-settings/front-matter/","excerpt":"","text":"front-matterfront-matter 是文件最上方以 --- 分隔的区域，用于指定个别文件的变量。更多请见 Hexo 官方文档：#front-matter 字段 含义 值类型 默认值 layout 布局模版 String - title 页面标题 String - seo_title 网页标题 String page.title short_title 页面标题（在group列表中显示） String page.title date 创建时间 Date 文件创建时间 updated 更新日期 Date 文件修改时间 link 外部文章网址 String - music 内部音乐控件 [Object] - robots robots String - keywords 页面关键词 String - description 页面描述、摘要 String - cover 是否显示封面 Bool true meta 文章或页面的meta信息 Bool, Array theme.layout.*.meta sidebar 页面侧边栏 Bool, Array theme.layout.*.sidebar body 页面主体元素 Array theme.layout.on_page.body mathjax 是否渲染公式 Bool, String false thumbnail 缩略图 String false icons 图标 Array [] pin 是否置顶 Bool false layout:post 时特有的字段： 字段 含义 值类型 默认值 author 文章作者 [Object] config.author categories 分类 String, Array - tags 标签 String, Array - toc 是否生成目录 Bool true author 字段 含义 值类型 默认值 name 作者名 String config.author avatar 头像 String config.avatar url 链接 String config.url music 字段 是否必须 值类型 server 是 netease, tencent, kugou, xiami, baidu type 是 song, playlist, album, search, artist id 是 song id / playlist id / album id / search keyword 文章置顶在 front-matter 中设置以下值： front-matterpin: true 文章分类多个分类有两种关系，一种是层级（等同于文件夹），一种是并列（等同于标签）。 多级分类： front-matter---categories: [分类A, 分类B]--- 或者 front-matter---categories: - 分类A - 分类B--- 并列分类 front-mattercategories: - [分类A] - [分类B] 多级+并列分类 front-mattercategories: - [分类A, 分类B] - [分类C, 分类D] 文章摘要在文章中插入 <!-- more -->，前面的部分即为摘要。 某篇文章源码---title: xxxdate: 2020-02-21---这是摘要<!-- more -->这是正文 注意： <!-- more --> 前后一定要有空行，不然可能导致显示错位。 设置文章作者由于支持多个作者在一个站点发布文章，所以可以设置单独一篇文章的作者： front-matter---author: name: 作者 avatar: https://img.vim-cn.com/a1/d53c11fb5d4fd69529bc805d385fe818feb3f6.png url: https://baidu.com--- 引入外部文章利用 link，搭配自定义的文章作者信息，你可以在文章列表中显示外部文章或者网址，例如： front-matter---layout: postdate: 2017-07-05title: [转]如何搭建基于Hexo的独立博客categories: [Dev, Hexo]tags: - Hexoauthor: name: xaoxuu avatar: https://cdn.jsdelivr.net/gh/xaoxuu/assets@master/avatar/avatar.png url: https://xaoxuu.comlink: https://xaoxuu.com/blog/2017-07-05-hexo-blog/---![](https://img.vim-cn.com/d9/a9af7dc49fc0af8ca3e6dd2450a2f7095a87db.png) 置顶对于任何文章或者页面，设置 pin: true 即可置顶在首页。 front-matter---pin: true--- 这会导致一个小问题：首页 post 卡片数量多于设定值，如果有强迫症希望每一个分页数量一致，可以安装插件来实现，详见：#421 不归档存放在 _posts 文件夹下的文章一般都会出现在归档页，如果某篇文章不希望出现在归档页面： front-matter---archive: false---"},{"title":"页面布局模板","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/page-settings/layout/index.html","permalink":"https://volantis.js.org/v3/page-settings/layout/","excerpt":"","text":"布局模板 取值 含义 page 独立页面 post 文章页面 category 分类页面 tag 标签页面 links 友链页面 list 列表页面 page & postpost 页面布局几乎与 page 页面相同，但是有以下细微区别： post 文章有 title 时，向下滚动网页，导航栏会向上移出屏幕显出文章标题，而 page 不会。 主题配置中的 article_footer 只作用于 post，如果 page 也要显示，可以在 front-matter 中设置meta: article_footer: [xxx] 除了归档页面是自动生成的，其它独立页面都需要手动创建 md 文件。 归档页面归档页面是自动生成的，并且初始化的时候已经生成，路径如下： blog/_config.yml# Directoryarchive_dir: archives 关于页面Create file if not exists: source/about/index.md---layout: pagetitle: 关于meta: header: [] footer: []sidebar: []valine: placeholder: 有什么想对我说的呢？---下面写关于自己的内容 分类页面Create file if not exists: source/categories/index.md---layout: categoryindex: truetitle: 所有分类--- 标签页面Create file if not exists: source/tags/index.md---layout: tagindex: truetitle: 所有标签--- 列表页面Create file if not exists: source/mylist/index.md---layout: listgroup: mylistindex: true--- 结果就是筛选出所有文章中 front-matter 部分含有 group: mylist 的文章。 友链页面Create file if not exists: source/friends/index.md---layout: links # 必须title: 我的朋友们 # 可选，这是友链页的标题links: - group: 分组1 icon: fas fa-user-tie desc: 这个分组的描述 items: - name: # 博客名 avatar: # 头像链接 url: # 博客链接 backgroundColor: '#3E74C9' # 卡片背景颜色 textColor: '#fff' # 卡片文字颜色 tags: [标签1, 标签2] # 标签 desc: 描述文字 - group: 分组2 icon: fas fa-user-tie desc: 这个分组的描述 items: - name: # 博客名 avatar: # 头像链接 url: # 博客链接 backgroundColor: '#3E74C9' # 卡片背景颜色 textColor: '#fff' # 卡片文字颜色 tags: [标签1, 标签2] # 标签 desc: 描述文字---这里写友链上方的内容。<!-- more -->这里可以写友链页面下方的文字备注，例如自己的友链规范、示例等。 姓名、头像、链接是必填项，其它选填。 404页面Create file if not exists: source/404.md---layout: pagetitle: 404 Not Foundbody: [article, comments]meta: header: [] footer: []sidebar: []valine: path: /404.html placeholder: 请留言告诉我您要访问哪个页面找不到了---{% p center huge, 404 %}{% p center bold, 很抱歉，您访问的页面不存在 %}{% p center small, 可能是输入地址有误或该地址已被删除 %}"},{"title":"渲染公式","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/page-settings/math/index.html","permalink":"https://volantis.js.org/v3/page-settings/math/","excerpt":"","text":"MathJax默认是不渲染的，如果文章内有公式，需要在 front-matter 中设置开启。 example.md:---title: 渲染公式（MathJax）date: 2020-02-23mathjax: true # false: 不渲染, true: 渲染, internal: 只在文章内部渲染，文章列表中不渲染---$$t+1=2$$$$\\mbox{积累因子}=\\begin{cases}1+ni & \\mbox{单利}\\\\\\\\(1+i)^n & \\mbox{复利}\\end{cases}$$$$\\begin{equation}\\sum_{i=0}^n F_i \\cdot \\phi (H, p_i) - \\sum_{i=1}^n a_i \\cdot ( \\tilde{x_i}, \\tilde{y_i}) + b_i \\cdot ( \\tilde{x_i}^2 , \\tilde{y_i}^2 )\\end{equation}$$$$\\begin{equation}\\beta^*(D) = \\mathop{argmin} \\limits_{\\beta} \\lambda {||\\beta||}^2 + \\sum_{i=1}^n max(0, 1 - y_i f_{\\beta}(x_i))\\end{equation}$$ 示例效果 $$t+1=2$$$$\\mbox{积累因子}=\\begin{cases}1+ni & \\mbox{单利}\\\\(1+i)^n & \\mbox{复利}\\end{cases}$$$$\\begin{equation}\\sum_{i=0}^n F_i \\cdot \\phi (H, p_i) - \\sum_{i=1}^n a_i \\cdot ( \\tilde{x_i}, \\tilde{y_i}) + b_i \\cdot ( \\tilde{x_i}^2 , \\tilde{y_i}^2 )\\end{equation}$$$$\\begin{equation}\\beta^*(D) = \\mathop{argmin} \\limits_{\\beta} \\lambda {||\\beta||}^2 + \\sum_{i=1}^n max(0, 1 - y_i f_{\\beta}(x_i))\\end{equation}$$ 如果公式仍无法正确渲染可以阅读 @MicDZ 的这篇文章：在Material-X上使用KaTeXhttps://www.micdz.cn/article/katex-on-volantis/"},{"title":"站点配置文件","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/site-settings/configuration/index.html","permalink":"https://volantis.js.org/v3/site-settings/configuration/","excerpt":"","text":"网站标题blog/_config.yml# 网站标题title: my blog 网站图标简单方式完全自定义blog/_config.yml# 网站图标，更多尺寸等图标请使用import方式批量导入favicon: https://cdn.jsdelivr.net/gh/xaoxuu/assets@master/favicon/favicon.icoblog/_config.ymlimport: meta: - <meta name="msapplication-TileColor" content="#ffffff"> - <meta name="msapplication-config" content="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/browserconfig.xml"> - <meta name="theme-color" content="#ffffff"> link: - <link rel="apple-touch-icon" sizes="180x180" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/apple-touch-icon.png"> - <link rel="icon" type="image/png" sizes="32x32" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-32x32.png"> - <link rel="icon" type="image/png" sizes="16x16" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-16x16.png"> - <link rel="manifest" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/site.webmanifest"> - <link rel="mask-icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/safari-pinned-tab.svg" color="#5bbad5"> - <link rel="shortcut icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon.ico"> 多语言设置blog/_config.ymllanguage:- zh-CN- en- zh-HK- zh-TW 对应的翻译文件路径： themes/volantis/languages/ Import 导入外部文件可以在无需修改主题文件的情况下在 head 和 body 中添加各种标签。meta 和 link 对应 head 中的 <meta> 和 <link> 标签。script 可以在 body 末尾导入 js 文件。 blog/_config.ymlimport: meta: - <meta name="msapplication-TileColor" content="#ffffff"> - <meta name="msapplication-config" content="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/browserconfig.xml"> - <meta name="theme-color" content="#ffffff"> link: - <link rel="apple-touch-icon" sizes="180x180" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/apple-touch-icon.png"> - <link rel="icon" type="image/png" sizes="32x32" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-32x32.png"> - <link rel="icon" type="image/png" sizes="16x16" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-16x16.png"> - <link rel="manifest" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/site.webmanifest"> - <link rel="mask-icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/safari-pinned-tab.svg" color="#5bbad5"> - <link rel="shortcut icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon.ico"> script: 网站 参数 描述 title 网站标题 subtitle 网站副标题 description 网站描述 keywords 网站的关键词。支援多个关键词。 author 您的名字 language 网站使用的语言。对于简体中文用户来说，使用不同的主题可能需要设置成不同的值，请参考你的主题的文档自行设置，常见的有 zh-Hans和 zh-CN。 timezone 网站时区。Hexo 默认使用您电脑的时区。请参考 时区列表 进行设置，如 America/New_York, Japan, 和 UTC 。一般的，对于中国大陆地区可以使用 Asia/Shanghai。 其中，description主要用于SEO，告诉搜索引擎一个关于您站点的简单描述，通常建议在其中包含您网站的关键词。author参数用于主题显示文章的作者。 网址 参数 描述 默认值 url 网址 root 网站根目录 permalink 文章的 永久链接 格式 :year/:month/:day/:title/ permalink_defaults 永久链接中各部分的默认值 pretty_urls 改写 permalink 的值来美化 URL pretty_urls.trailing_index 是否在永久链接中保留尾部的 index.html，设置为 false 时去除 true pretty_urls.trailing_html 是否在永久链接中保留尾部的 .html, 设置为 false 时去除 (对尾部的 index.html无效) true 网站存放在子目录如果您的网站存放在子目录中，例如 http://yoursite.com/blog，则请将您的 url 设为 http://yoursite.com/blog 并把 root 设为 /blog/。 例如： # 比如，一个页面的永久链接是 http://example.com/foo/bar/index.htmlpretty_urls: trailing_index: false# 此时页面的永久链接会变为 http://example.com/foo/bar/ 目录 参数 描述 默认值 source_dir 资源文件夹，这个文件夹用来存放内容。 source public_dir 公共文件夹，这个文件夹用于存放生成的站点文件。 public tag_dir 标签文件夹 tags archive_dir 归档文件夹 archives category_dir 分类文件夹 categories code_dir Include code 文件夹，source_dir 下的子目录 downloads/code i18n_dir 国际化（i18n）文件夹 :lang skip_render 跳过指定文件的渲染。匹配到的文件将会被不做改动地复制到 public 目录中。您可使用 glob 表达式 来匹配路径。 例如： skip_render: "mypage/**/*"# 将会直接将 `source/mypage/index.html` 和 `source/mypage/code.js` 不做改动地输出到 'public' 目录# 你也可以用这种方法来跳过对指定文章文件的渲染skip_render: "_posts/test-post.md"# 这将会忽略对 'test-post.md' 的渲染 提示如果您刚刚开始接触 Hexo，通常没有必要修改这一部分的值。 文章 参数 描述 默认值 new_post_name 新文章的文件名称 :title.md default_layout 预设布局 post auto_spacing 在中文和英文之间加入空格 false titlecase 把标题转换为 title case false external_link 在新标签中打开链接 true external_link.enable 在新标签中打开链接 true external_link.field 对整个网站（site）生效或仅对文章（post）生效 site external_link.exclude 需要排除的域名。主域名和子域名如 www 需分别配置 [] filename_case 把文件名称转换为 (1) 小写或 (2) 大写 0 render_drafts 显示草稿 false post_asset_folder 启动 Asset 文件夹 false relative_link 把链接改为与根目录的相对位址 false future 显示未来的文章 true highlight 代码块的设置, see Highlight.js section for usage guide prismjs 代码块的设置, see PrismJS section for usage guide 相对地址默认情况下，Hexo 生成的超链接都是绝对地址。例如，如果您的网站域名为 example.com,您有一篇文章名为 hello，那么绝对链接可能像这样：http://example.com/hello.html，它是绝对于域名的。相对链接像这样：/hello.html，也就是说，无论用什么域名访问该站点，都没有关系，这在进行反向代理时可能用到。通常情况下，建议使用绝对地址。 分类 & 标签 参数 描述 默认值 default_category 默认分类 uncategorized category_map 分类别名 tag_map 标签别名 日期 / 时间格式Hexo 使用 Moment.js 来解析和显示时间。 参数 描述 默认值 date_format 日期格式 YYYY-MM-DD time_format 时间格式 HH:mm:ss updated_option 当 Front Matter 中没有指定 updated 时 updated 的取值 mtime updated_optionupdated_option 控制了当 Front Matter 中没有指定 updated 时，updated 如何取值：mtime: 使用文件的最后修改时间。这是从 Hexo 3.0.0 开始的默认行为。date: 使用 date 作为 updated 的值。可被用于 Git 工作流之中，因为使用 Git 管理站点时，文件的最后修改日期常常会发生改变empty: 直接删除 updated。使用这一选项可能会导致大部分主题和插件无法正常工作。use_date_for_updated 选项已经被废弃，将会在下个重大版本发布时去除。请改为使用 updated_option: 'date'。 use_date_for_updated | 启用以后，如果 Front Matter 中没有指定 updated， post.updated 将会使用 date 的值而不是文件的创建时间。在 Git 工作流中这个选项会很有用 | true 分页 参数 描述 默认值 per_page 每页显示的文章量 (0 = 关闭分页功能) 10 pagination_dir 分页目录 page 扩展 参数 描述 theme 当前主题名称。值为false时禁用主题 theme_config 主题的配置文件。在这里放置的配置会覆盖主题目录下的 _config.yml 中的配置 deploy 部署部分的设置 meta_generator Meta generator 标签。 值为 false 时 Hexo 不会在头部插入该标签 包括或不包括目录和文件在 Hexo 配置文件中，通过设置 include/exclude 可以让 Hexo 进行处理或忽略某些目录和文件夹。你可以使用 glob 表达式 对目录和文件进行匹配。 include and exclude options only apply to the source/ folder, whereas ignore option applies to all folders. 参数 描述 include Hexo 默认会忽略隐藏文件和文件夹（包括名称以下划线和 . 开头的文件和文件夹，Hexo 的 _posts 和 _data 等目录除外）。通过设置此字段将使 Hexo 处理他们并将它们复制到 source 目录下。 exclude Hexo 会忽略这些文件和目录 ignore Ignore files/folders 举例： # Include/Exclude Files/Foldersinclude: - ".nojekyll" # 包括 'source/css/_typing.css' - "css/_typing.css" # 包括 'source/_css/' 中的任何文件，但不包括子目录及其其中的文件。 - "_css/*" # 包含 'source/_css/' 中的任何文件和子目录下的任何文件 - "_css/**/*"exclude: # 不包括 'source/js/test.js' - "js/test.js" # 不包括 'source/js/' 中的文件、但包括子目录下的所有目录和文件 - "js/*" # 不包括 'source/js/' 中的文件和子目录下的任何文件 - "js/**/*" # 不包括 'source/js/' 目录下的所有文件名以 'test' 开头的文件，但包括其它文件和子目录下的单文件 - "js/test*" # 不包括 'source/js/' 及其子目录中任何以 'test' 开头的文件 - "js/**/test*" # 不要用 exclude 来忽略 'source/_posts/' 中的文件。你应该使用 'skip_render'，或者在要忽略的文件的文件名之前加一个下划线 '_' # 在这里配置一个 - "_posts/hello-world.md" 是没有用的。ignore: # Ignore any folder named 'foo'. - "**/foo" # Ignore 'foo' folder in 'themes/' only. - "**/themes/*/foo" # Same as above, but applies to every subfolders of 'themes/'. - "**/themes/**/foo" 列表中的每一项都必须用单引号或双引号包裹起来。 include 和 exclude 并不适用于 themes/ 目录下的文件。如果需要忽略 themes/ 目录下的部分文件或文件夹，可以使用 ignore 或在文件名之前添加下划线 _。 使用代替配置文件可以在 hexo-cli 中使用 --config 参数来指定自定义配置文件的路径。你可以使用一个 YAML 或 JSON 文件的路径，也可以使用逗号分隔（无空格）的多个 YAML 或 JSON 文件的路径。例如： # use 'custom.yml' in place of '_config.yml'$ hexo server --config custom.yml# use 'custom.yml' & 'custom2.json', prioritizing 'custom3.yml', then 'custom2.json'$ hexo generate --config custom.yml,custom2.json,custom3.yml 当你指定了多个配置文件以后，Hexo 会按顺序将这部分配置文件合并成一个 _multiconfig.yml。如果遇到重复的配置，排在后面的文件的配置会覆盖排在前面的文件的配置。这个原则适用于任意数量、任意深度的 YAML 和 JSON 文件。 例如，使用 --options 指定了两个自定义配置文件： $ hexo generate --config custom.yml,custom2.json 如果 custom.yml 中指定了 foo: bar，在 custom2.json 中指定了 "foo": "dinosaur"，那么在 _multiconfig.yml 中你会得到 foo: dinosaur。 使用代替主题配置文件通常情况下，Hexo 主题是一个独立的项目，并拥有一个独立的 _config.yml 配置文件。 除了自行维护独立的主题配置文件，你也可以在其它地方对主题进行配置。 配置文件中的 theme_config 该特性自 Hexo 2.8.2 起提供 # _config.ymltheme: "my-theme"theme_config: bio: "My awesome bio" foo: bar: 'a' # themes/my-theme/_config.ymlbio: "Some generic bio"logo: "a-cool-image.png" foo: baz: 'b' 最终主题配置的输出是： { bio: "My awesome bio", logo: "a-cool-image.png", foo: { bar: "a", baz: "b" }} 独立的 _config.[theme].yml 文件 该特性自 Hexo 5.0.0 起提供 独立的主题配置文件应放置于站点根目录下，支持 yml 或 json 格式。需要配置站点 _config.yml 文件中的 theme 以供 Hexo 寻找 _config.[theme].yml 文件。 # _config.ymltheme: "my-theme" # _config.my-theme.ymlbio: "My awesome bio"foo: bar: 'a' # themes/my-theme/_config.ymlbio: "Some generic bio"logo: "a-cool-image.png" foo: baz: 'b' 最终主题配置的输出是： { bio: "My awesome bio", logo: "a-cool-image.png", foo: { bar: "a", baz: "b" }} 我们强烈建议你将所有的主题配置集中在一处。如果你不得不在多处配置你的主题，那么这些信息对你将会非常有用：Hexo 在合并主题配置时，Hexo 配置文件中的 theme_config 的优先级最高，其次是 _config.[theme].yml 文件，最后是位于主题目录下的 _config.yml 文件。"},{"title":"容器类标签","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/tag-plugins/container/index.html","permalink":"https://volantis.js.org/v3/tag-plugins/container/","excerpt":"","text":"Tab此插件移植自 NexT #tabs 。请将您的 Volantis 升级至 2.1 版本以上使用。 语法格式参数列表{% tabs tab-id %}<!-- tab tab-name -->![](https://i.loli.net/2020/03/18/f5PQlWisvm9zbgK.jpg)<!-- endtab --><!-- tab tab-name -->这里面写内容，支持的语法格式有限，请尽量<u>不要</u>写太过复杂的东西。<!-- endtab -->{% endtabs %}tab-id 必填，如果一个页面有多个 tabs 时，tab-id 不能重复。 tab-name 标签文本。 Folding请将您的 Volantis 升级至 2.3 版本以上使用。 语法格式参数列表示例写法示例效果{% folding 参数（可选）, 标题 %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endfolding %}参数位置可以填写颜色和状态，多个参数用空格隔开。 颜色 blue, cyan, green, yellow, red 状态 状态填写 open 代表默认打开。{% folding 查看图片测试 %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endfolding %}{% folding cyan open, 查看默认打开的折叠框 %}这是一个默认打开的折叠框。{% endfolding %}{% folding green, 查看代码测试 %}{% endfolding %}{% folding yellow, 查看列表测试 %}- haha- hehe{% endfolding %}{% folding red, 查看嵌套测试 %}{% folding blue, 查看嵌套测试2 %}{% folding 查看嵌套测试3 %}hahaha <span><img src='https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/tieba/%E6%BB%91%E7%A8%BD.png' style='height:24px'></span>{% endfolding %}{% endfolding %}{% endfolding %} 查看图片测试 查看默认打开的折叠框 这是一个默认打开的折叠框。 查看代码测试 {% folding green, 查看代码测试 %}查看代码测试{% endfolding %} 查看列表测试 hahahehe 查看嵌套测试 查看嵌套测试2 查看嵌套测试3 hahaha"},{"title":"Hexo 内置标签","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/tag-plugins/hexo/index.html","permalink":"https://volantis.js.org/v3/tag-plugins/hexo/","excerpt":"","text":"文章摘要和截断在文章中使用 <!-- more -->，那么 <!-- more --> 之前的文字将会被视为摘要。首页中将只出现这部分文字，同时这部分文字也会出现在正文之中。详见 Hexo 官方文档： 标签插件https://hexo.io/zh-cn/docs/tag-plugins 引用块引用书上的句子 Do not just seek happiness for yourself. Seek happiness for all. Through kindness. Through mercy. David LevithanWide Awake 代码块{% codeblock [title] [lang:language] [url] [link text] [additional options] %}code snippet{% endcodeblock %} 指定语言[rectangle setX: 10 y: 10 width: 20 height: 20]; example.md:{% codeblock lang:objc %}[rectangle setX: 10 y: 10 width: 20 height: 20];{% endcodeblock %} 附加说明Array.maparray.map(callback[, thisArg]) example.md:{% codeblock Array.map %}array.map(callback[, thisArg]){% endcodeblock %} 行标、高亮12345678n=eval(input())if n==0: print("Hello World")elif n>0: print("He\\nll\\no \\nWo\\nrl\\nd")else: for c in "Hello World": print(c) example.md:{% codeblock lang:python line_number:true mark:3,5,8 %}n=eval(input())if n==0: print("Hello World")elif n>0: print("He\\nll\\no \\nWo\\nrl\\nd")else: for c in "Hello World": print(c){% endcodeblock %} Pull Quote在文章中插入 Pull quote example.md:{% pullquote [class] %}content{% endpullquote %} jsFiddle在文章中嵌入 jsFiddle example.md:{% jsfiddle shorttag [tabs] [skin] [width] [height] %} Gist在文章中嵌入 Gist，注意：在国内无法加载。 example.md:{% gist gist_id [filename] %} iframe在文章中插入 iframe example.md:{% iframe url [width] [height] %} Image在文章中插入指定大小的图片。 example.md:{% img [class names] /path/to/image [width] [height] '"title text" "alt text"' %} Link在文章中插入链接，并自动给外部链接添加 target="_blank" 属性。 example.md:{% link text url [external] [title] %} Include Code插入 source/downloads/code 文件夹内的代码文件。source/downloads/code 不是固定的，取决于你在配置文件中 code_dir 的配置。 example.md:{% include_code [title] [lang:language] [from:line] [to:line] path/to/file %} 示例 嵌入 test.js 文件全文{% include_code lang:javascript test.js %}只嵌入第 3 行{% include_code lang:javascript from:3 to:3 test.js %}嵌入第 5 行至第 8 行{% include_code lang:javascript from:5 to:8 test.js %}嵌入第 5 行至文件结束{% include_code lang:javascript from:5 test.js %}嵌入第 1 行至第 8 行{% include_code lang:javascript to:8 test.js %} 引用文章引用其他文章的链接。 {% post_path filename %}{% post_link filename [title] [escape] %} 示例 引用这篇文章：主题更名为「Volantis」example.md:引用这篇文章：{% post_link news/2020-02-22 %}"},{"title":"链接、按钮和菜单标签","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/tag-plugins/link/index.html","permalink":"https://volantis.js.org/v3/tag-plugins/link/","excerpt":"","text":"外链卡片请将您的 Volantis 升级至 3.0 版本以上使用。 语法格式示例写法示例效果{% link 标题, 链接, 图片 %}example.md:{% link 如何参与项目, http://localhost:4000/contributors/, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets@master/logo/256/safari.png %}如何参与项目http://localhost:4000/contributors/ 基础按钮请将您的 Volantis 升级至 2.4 版本以上使用。 语法格式参数列表示例写法示例效果{% btn 样式参数（可选）, 标题, 链接, 图标（可选） %} 可选的参数可以省略，但是前后顺序不能乱。样式参数 regular, large, center 图标 第1个或者第2个参数包含 fa- 的那个被识别为图标。example.md:不设置任何参数的 {% btn 按钮, / %} 适合融入段落中。regular 按钮适合独立于段落之外：{% btn regular, 示例博客, https://xaoxuu.com, fas fa-play-circle %}large 按钮更具有强调作用，建议搭配 center 使用：{% btn center large, 开始使用, https://volantis.js.org/v3/getting-started/, fas fa-download %}行内按钮 不设置任何参数的 按钮 适合融入段落中。 空心按钮 示例博客 示例博客 示例博客 示例博客 居中： 开始使用 实心按钮 示例博客 示例博客 示例博客 示例博客 居中： 开始使用 富文本按钮请将您的 Volantis 升级至 2.3 版本以上使用。 语法格式参数列表示例写法示例效果{% btns 样式参数 %}{% cell 标题, 链接, 图片或者图标 %}{% cell 标题, 链接, 图片或者图标 %}{% endbtns %}样式参数位置可以写图片样式、布局方式，多个样式参数用空格隔开。 圆角样式 默认为方形 rounded, circle 布局方式 默认为自动宽度，适合视野内只有一两个的情况。 参数 含义 wide 宽一点的按钮 fill 填充布局，自动铺满至少一行，多了会换行。 center 居中，按钮之间是固定间距。 around 居中分散 grid2 等宽最多2列，屏幕变窄会适当减少列数。 grid3 等宽最多3列，屏幕变窄会适当减少列数。 grid4 等宽最多4列，屏幕变窄会适当减少列数。 grid5 等宽最多5列，屏幕变窄会适当减少列数。 增加文字样式 可以在容器内增加 <b>标题</b> 和 <p>描述文字</p>如果需要显示类似「团队成员」之类的一组含有头像的链接： example.md:{% btns circle grid5 %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% endbtns %} 或者含有图标的按钮： example.md:{% btns rounded grid5 %}{% cell 下载源码, /, fas fa-download %}{% cell 查看文档, /, fas fa-book-open %}{% endbtns %} 圆形图标 + 标题 + 描述 + 图片 + 网格5列 + 居中 example.md:{% btns circle center grid5 %}<a href='https://apps.apple.com/cn/app/heart-mate-pro-hrm-utility/id1463348922?ls=1'> <i class='fab fa-apple'></i> <b>心率管家</b> {% p red, 专业版 %} <img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/qrcode/heartmate_pro.png'></a><a href='https://apps.apple.com/cn/app/heart-mate-lite-hrm-utility/id1475747930?ls=1'> <i class='fab fa-apple'></i> <b>心率管家</b> {% p green, 免费版 %} <img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/qrcode/heartmate_lite.png'></a>{% endbtns %}如果需要显示类似「团队成员」之类的一组含有头像的链接： xaoxuu xaoxuu xaoxuu xaoxuu xaoxuu 或者含有图标的按钮： 下载源码 查看文档 圆形图标 + 标题 + 描述 + 图片 + 网格5列 + 居中 心率管家 专业版 心率管家 免费版 下拉菜单请将您的 Volantis 升级至 3.0 版本以上使用。 语法格式示例写法示例效果容器 {% menu 前缀（可省略）, 标题, 后缀（可省略） %}菜单内容{% endmenu %} 菜单内容 菜单项 {% menuitem 文本, 链接, 图标 %} 分割线 {% menuitem hr %} 子菜单 {% submenu 嵌套菜单, 图标 %}菜单内容{% endsubmenu %}示例1 {% menu 下拉菜单 %}{% menuitem 主题源码, https://github.com/volantis-x/hexo-theme-volantis/, fas fa-file-code %}{% menuitem 更新日志, https://github.com/volantis-x/hexo-theme-volantis/releases/, fas fa-clipboard-list %}{% menuitem hr %}{% submenu 有疑问？, fas fa-question-circle %}{% menuitem 看 FAQ, /faqs/ %}{% menuitem 看 本站源码, https://github.com/volantis-x/volantis-docs/ %}{% menuitem 提 Issue, https://github.com/volantis-x/hexo-theme-volantis/issues/ %}{% endsubmenu %}{% endmenu %} 示例2 {% menu 这个是, 下拉菜单 %}（同上）{% endmenu %} 示例3 {% menu 这个是, 下拉菜单, 的示例效果。 %}（同上）{% endmenu %}示例1 下拉菜单 主题源码 更新日志 有疑问？ 看 FAQ 看 本站源码 提 Issue 示例2 这个是 下拉菜单 主题源码 更新日志 有疑问？ 看 FAQ 看 本站源码 提 Issue 示例3 这个是 下拉菜单 主题源码 更新日志 有疑问？ 看 FAQ 看 本站源码 提 Issue 的示例效果。"},{"title":"多媒体标签","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/tag-plugins/media/index.html","permalink":"https://volantis.js.org/v3/tag-plugins/media/","excerpt":"","text":"InlineimageInlineimage 标签是一种行内图片标签，可以用来在一段话中间插入表情。请将您的 Volantis 升级至 3.0.0 版本以上使用。 语法格式参数列表示例写法示例效果这是一段话 {% inlineimage 链接, height=高度（可选） %} 这是一段话。图片高度 阿拉伯数字 + px example:height=20pxexample.md:这是 {% inlineimage https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/aru-l/0000.gif %} 一段话。这又是 {% inlineimage https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/aru-l/5150.gif, height=40px %} 一段话。这是 一段话。 这又是 一段话。 ImageImage 标签是一种针对单个图片应用场景的标签，支持图片描述文字和指定宽度。请将您的 Volantis 升级至 2.6 版本以上使用。 语法格式参数列表示例写法示例效果{% image 链接, 宽度（可选）, 描述（可选） %}图片宽度 阿拉伯数字 + px example:300px 图片描述 纯文本，不能包含引号。example.md:添加描述：{% image https://i.loli.net/2020/04/06/zdeQiOY9rBCjhDR.jpg, alt=每天下课回宿舍的路，承载了太多记忆。 %}指定宽度：{% image https://i.loli.net/2020/04/06/zdeQiOY9rBCjhDR.jpg, width=300px %}指定宽度并添加描述：{% image https://i.loli.net/2020/04/06/zdeQiOY9rBCjhDR.jpg, width=300px, alt=每天下课回宿舍的路，承载了太多记忆。 %}添加描述： 每天下课回宿舍的路，承载了太多记忆。 指定宽度： 指定宽度并添加描述： 每天下课回宿舍的路，承载了太多记忆。 GalleryGallery 标签是一种针对一组图片应用场景的标签。请将您的 Volantis 升级至 3.0 版本以上使用。 语法格式参数列表示例写法示例效果{% gallery 参数, 列数 %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B18FCBB3-67FD-48CC-B4F3-457BA145F17A.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/67239FBB-E15D-4F4F-8EE8-0F1C9F3C4E7C.jpeg){% endgallery %}对齐方向 left, center, right 缩放 stretch 列数 逗号后面直接写列数，支持 2 ～ 8 列。设定列列数之后就是「多行多图」布局，此时图片默认左对齐。为了避免图片大小不一，建议搭配 stretch 来时图片放大填充。一行一个图片 example.md:{% gallery %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endgallery %} 一行多个图片（不换行） example.md:{% gallery %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B18FCBB3-67FD-48CC-B4F3-457BA145F17A.jpeg)![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/67239FBB-E15D-4F4F-8EE8-0F1C9F3C4E7C.jpeg)![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/00E0F0ED-9F1C-407A-9AA6-545649D919F4.jpeg){% endgallery %} 多行多个图片（每行2～8个图片） example.md:{% gallery stretch, 4 %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B951AE18-D431-417F-B3FE-A382403FF21B.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/AEB33F9D-7294-4CF1-B8C5-3020748A9D45.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/250662D4-5A21-4AAA-BB63-CD25CF97CFF1.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/10A0FCE5-36A1-4AD0-8CF0-019259A89E03.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B951AE18-D431-417F-B3FE-A382403FF21B.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/AEB33F9D-7294-4CF1-B8C5-3020748A9D45.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/250662D4-5A21-4AAA-BB63-CD25CF97CFF1.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/10A0FCE5-36A1-4AD0-8CF0-019259A89E03.jpeg){% endgallery %}一行一个图片 图片描述 一行多个图片（不换行） 图片描述 图片描述 图片描述 多行多个图片（每行2～8个图片） Audio请将您的 Volantis 升级至 2.4 版本以上使用。 语法格式示例写法示例效果example.md:{% audio 音频链接 %}example.md:{% audio https://github.com/volantis-x/volantis-docs/releases/download/assets/Lumia1020.mp3 %}Your browser does not support the audio tag. Video请将您的 Volantis 升级至 2.3 版本以上使用。 语法格式参数列表示例写法示例效果单个视频 example.md:{% video 视频链接 %} 多个视频 example.md:{% videos 对齐方向, 列数 %}{% video 视频链接 %}{% video 视频链接 %}{% video 视频链接 %}{% endvideos %}对齐方向 left, center, right 列数 逗号后面直接写列数，支持 1 ～ 4 列。100%宽度 example.md:{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %} 50%宽度 example.md:{% videos, 2 %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% endvideos %} 25%宽度 example.md:{% videos, 4 %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% endvideos %}100%宽度 Your browser does not support the video tag. 50%宽度 Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. 25%宽度 Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. APlayer主题对 APlayer 插件的样式进行了兼容。安装插件： npm i -S hexo-tag-aplayer hexo-tag-aplayerhttps://github.com/MoePlayer/hexo-tag-aplayer"},{"title":"文本和段落标签","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/tag-plugins/text/index.html","permalink":"https://volantis.js.org/v3/tag-plugins/text/","excerpt":"","text":"行内小标签请将您的 Volantis 升级至 3.0 版本以上使用。 语法格式示例写法示例效果带下划线的文本 {% u 带下划线的文本 %} 带着重号的文本 {% emp 带着重号的文本 %} 带波浪线的文本 {% wavy 波浪线 %} 带删除线的文本 {% del 带删除线的文本 %} 键盘样式的文本 {% kbd 键盘样式的文本 %} 密码样式的文本 {% psw 密码样式的文本 %}带下划线的文本 example.md:带 {% u 下划线 %} 的文本 带着重号的文本 example.md:带 {% emp 着重号 %} 的文本 带波浪线的文本 example.md:带 {% wavy 波浪线 %} 的文本 带删除线的文本 example.md:带 {% del 删除线 %} 的文本 键盘样式的文本 example.md:收藏页面：{% kbd command %} + {% kbd D %} 密码样式的文本 example.md:验证码：{% psw 这里没有验证码 %}带下划线的文本 带 下划线 的文本 带着重号的文本 带 着重号 的文本 带波浪线的文本 带 波浪线 的文本 带删除线的文本 带 删除线 的文本 键盘样式的文本 收藏页面：command + D 密码样式的文本 验证码：这里没有验证码 Span & P请将您的 Volantis 升级至 2.5 版本以上使用。 语法格式参数列表示例写法示例效果行内文本 {% span 样式参数, 文本内容 %} 独立段落 {% p 样式参数, 文本内容 %}样式参数位置可以写颜色、大小和对齐方向，多个样式参数用空格隔开。 字体 logo, code 颜色 red, yellow, green, cyan, blue, gray 大小 small, h4, h3, h2, h1, large, huge, ultra 对齐方向 left, center, right彩色文字 example.md:在一段话中方便插入各种颜色的标签，包括：{% span red, 红色 %}、{% span yellow, 黄色 %}、{% span green, 绿色 %}、{% span cyan, 青色 %}、{% span blue, 蓝色 %}、{% span gray, 灰色 %}。 超大文字 example.md:文档「开始」页面中的标题部分就是超大文字。{% p center logo large, Volantis %}{% p center small, A Wonderful Theme for Hexo %}彩色文字 在一段话中方便插入各种颜色的标签，包括：红色、黄色、绿色、青色、蓝色、灰色。 超大文字 文档「开始」页面中的标题部分就是超大文字。 Volantis A Wonderful Theme for Hexo Note & NoteBlockNoteBlock 是 Blockquote 的增强版，在左边显示图标，并且可以自定颜色。而 Note 是 NoteBlock 的简便写法。请将您的 Volantis 升级至 2.3 版本以上使用。 语法格式参数列表示例写法示例效果Note {% note 样式参数, 文本内容 %} NoteBlock {% noteblock 样式参数 %}文本段落{% endnoteblock %}样式参数位置可以写图标和颜色，多个样式参数用空格隔开。 图标 彩色的quote, info, warning, done/success, error/danger 灰色的，也可以指定颜色radiation, bug, idea, link, paperclip, todo, msg, guide, download, up, undo 颜色 指定颜色clear, light, gray, red, yellow, green, cyan, blueNote example.md:{% note, 为简单的一句话提供的简便写法。 %}{% note success, 支持同样丰富的参数。 %} NoteBlock example.md:可以在区块中放置一些复杂的结构，支持嵌套。{% noteblock quote %}{% p subtitle, 小标题 %}Windows 10不是為所有人設計,而是為每個人設計{% p subtitle, 嵌套测试 %}{% noteblock %}请坐和放宽，我正在帮你搞定一切...{% endnoteblock %}{% p subtitle, Folding 测试 %}{% folding 点击查看更多 %}{% note warning, 不要说我们没有警告过你 %}{% noteblock bug red %}我们都有不顺利的时候{% endnoteblock %}{% endfolding %}{% endnoteblock %}Note 为简单的一句话提供的简便写法。 支持同样丰富的参数。 NoteBlock 可以在区块中放置一些复杂的结构，支持嵌套。 小标题Windows 10不是為所有人設計,而是為每個人設計嵌套测试请坐和放宽，我正在帮你搞定一切...Folding 测试 点击查看更多 不要说我们没有警告过你我们都有不顺利的时候 Checkbox & Radio请将您的 Volantis 升级至 2.6 版本以上使用。 语法格式参数列表示例写法示例效果{% checkbox 样式参数（可选）, 文本（支持简单md） %}颜色 red, yellow, green, cyan, blue 样式 plus, minus, times 选中状态 checkedCheckbox example.md:{% checkbox 纯文本测试 %}{% checkbox checked, 支持简单的 [markdown](https://guides.github.com/features/mastering-markdown/) 语法 %}{% checkbox red, 支持自定义颜色 %}{% checkbox green checked, 绿色 + 默认选中 %}{% checkbox yellow checked, 黄色 + 默认选中 %}{% checkbox cyan checked, 青色 + 默认选中 %}{% checkbox blue checked, 蓝色 + 默认选中 %}{% checkbox plus green checked, 增加 %}{% checkbox minus yellow checked, 减少 %}{% checkbox times red checked, 叉 %} Radio example.md:{% radio 纯文本测试 %}{% radio checked, 支持简单的 [markdown](https://guides.github.com/features/mastering-markdown/) 语法 %}{% radio red, 支持自定义颜色 %}{% radio green, 绿色 %}{% radio yellow, 黄色 %}{% radio cyan, 青色 %}{% radio blue, 蓝色 %}Checkbox 纯文本测试 支持简单的 markdown 语法 支持自定义颜色 绿色 + 默认选中 黄色 + 默认选中 青色 + 默认选中 蓝色 + 默认选中 增加 减少 叉 Radio 纯文本测试 支持简单的 markdown 语法 支持自定义颜色 绿色 黄色 青色 蓝色 Timeline请将您的 Volantis 升级至 3.0 版本以上使用。 语法格式示例写法示例效果{% timeline 时间线标题 %}{% timenode 时间节点（标题） %}正文内容{% endtimenode %}{% timenode 时间节点（标题） %}正文内容{% endtimenode %}{% endtimeline %}example.md:{% timeline 升级小助手 %}{% timenode 2020-07-24 [2.6.6 -> 3.0](https://github.com/volantis-x/hexo-theme-volantis/releases) %}1. 如果有 `hexo-lazyload-image` 插件，需要删除并重新安装最新版本，设置 `lazyload.isSPA: true`。2. 2.x 版本的 css 和 js 不适用于 3.x 版本，如果使用了 `use_cdn: true` 则需要删除。3. 2.x 版本的 fancybox 标签在 3.x 版本中被重命名为 gallery 。4. 2.x 版本的置顶 `top: true` 改为了 `pin: true`，并且同样适用于 `layout: page` 的页面。5. 如果使用了 `hexo-offline` 插件，建议卸载，3.0 版本默认开启了 pjax 服务。{% endtimenode %}{% timenode 2020-05-15 [2.6.3 -> 2.6.6](https://github.com/volantis-x/hexo-theme-volantis/releases/tag/2.6.6) %}不需要额外处理。{% endtimenode %}{% timenode 2020-04-20 [2.6.2 -> 2.6.3](https://github.com/volantis-x/hexo-theme-volantis/releases/tag/2.6.3) %}1. 全局搜索 `seotitle` 并替换为 `seo_title`。2. group 组件的索引规则有变，使用 group 组件的文章内，`group: group_name` 对应的组件名必须是 `group_name`。2. group 组件的列表名优先显示文章的 `short_title` 其次是 `title`。{% endtimenode %}{% endtimeline %}升级小助手 2020-07-24 2.6.6 -> 3.0.0 如果有 hexo-lazyload-image 插件，需要删除并重新安装最新版本，设置 lazyload.isSPA: true。2.x 版本的 css 和 js 不适用于 3.x 版本，如果使用了 use_cdn: true 则需要删除。2.x 版本的 fancybox 标签在 3.x 版本中被重命名为 gallery 。2.x 版本的置顶 top: true 改为了 pin: true，并且同样适用于 layout: page 的页面。如果使用了 hexo-offline 插件，建议卸载，3.0 版本默认开启了 pjax 服务。 2020-07-24 2.6.3 -> 2.6.6 不需要额外处理。 2020-07-24 2.6.2 -> 2.6.3 全局搜索 seotitle 并替换为 seo_title。group 组件的索引规则有变，使用 group 组件的文章内，group: group_name 对应的组件名必须是 group_name。group 组件的列表名优先显示文章的 short_title 其次是 title。"},{"title":"选择评论系统","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/theme-settings/comments/index.html","permalink":"https://volantis.js.org/v3/theme-settings/comments/","excerpt":"","text":"目前支持的评论系统有： Valine, MiniValine, Disqus, Gitalk, Vssue, Livere, Isso, Hashover blog/_config.volantis.ymlcomments: title: <i class='fas fa-comments'></i> 评论 subtitle: service: valine # valine, minivaline, disqus, gitalk, vssue, livere, isso, hashover ValineMiniValineVssueGitalkDisqusLivereIssoHashover... 一款快速、简洁且高效的无后端评论系统 https://valine.js.org blog/_config.volantis.ymlcomments: ... service: valine ... valine: appId: # your appId appKey: # your appKey js: https://cdn.jsdelivr.net/npm/valine@1.4/dist/Valine.min.js ... 可选配置项详见源码 其中，placeholder 支持在 front-matter 中设置。 front-matter---valine: placeholder: 你觉得xxx怎么样呢？--- 也可以通过设置 valine.path 实现多个页面共用一个评论框。 front-matter---valine: path: /--- 一款快速、简洁且高效的无后端评论系统 https://github.com/MiniValine/MiniValine/ blog/_config.volantis.ymlcomments: ... service: minivaline ... minivaline: appId: # Your leancloud application appid appKey: # Your leancloud application appkey ... 可选配置项详见源码 Vue 驱动的、基于 Issue 的评论插件 https://vssue.js.org/zh/ blog/_config.volantis.ymlcomments: ... service: vssue ... vssue: owner: repo: clientId: clientSecret: A modern comment component based on Github Issue and Preact. https://gitalk.github.io/ blog/_config.volantis.ymlcomments: ... service: gitalk ... gitalk: clientID: clientSecret: repo: owner: admin: # [] clientID 和 clientSecret 的获取方法可自行搜索教程，这里仅简单描述一下步骤： 点击 GitHub -> Settings https://github.com/settings/profile 点击 Developer settings https://github.com/settings/developers 点击 New OAuth App https://github.com/settings/applications/new 填写信息： Application name 随便填，我的是：xaoxuu.comHomepage URL 和 Authorization callback URL 都写你的网址，我的是：https://xaoxuu.com 可以通过设置 gitalk.id 实现多个页面共用一个评论框。 front-matter---gitalk: id: /wiki/volantis/--- Disqus - The #1 way to build an audience on your website. https://disqus.com/ blog/_config.volantis.ymlcomments: ... service: disqus ... disqus: shortname: Communication makes better world. https://www.livere.com/ blog/_config.volantis.ymlcomments: ... service: livere ... livere: uid: #你的livere的uid 在这里查看你的 uid：https://livere.com/insight/myCode，在【代码管理 -> 一般网站】中找到如下这段代码，其中 data-uid 中的内容就是你的 livere_uid。 <!-- 来必力City版安装代码 --><div id="lv-container" data-id="city" data-uid="你的livere的uid">... A commenting server similar to Disqus. https://posativ.org/isso/ blog/_config.volantis.ymlcomments: ... service: isso ... isso: url: https://example.com/(path/) src: https://example.com/(path/)js/embed.min.js A free and open source PHP comment system designed to allow completely anonymous comments and easy theming. https://www.barkdull.org/software/hashover blog/_config.volantis.ymlcomments: ... service: hashover ... hashover: src: https://example.com/(path/)comments.phpblog/themes/volantis/layout/_third-party/comments/评论系统名称/layout.ejs这里写布局代码 blog/themes/volantis/layout/_third-party/comments/评论系统名称/script.ejs这里要写加载 js 的代码 收录更多评论系统"},{"title":"主题配置文件","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/theme-settings/configuration/index.html","permalink":"https://volantis.js.org/v3/theme-settings/configuration/","excerpt":"","text":"使用代替主题配置文件 第 1/2 步：找到原主题配置文件 使用 npm i hexo-theme-volantis 方式安装的主题，配置文件在 blog/node_modules/hexo-theme-volantis/_config.yml使用传统方式安装的主题，配置文件在 blog/themes/volantis/_config.yml 第 2/2 步：复制主题配置文件 将主题配置文件复制并重命名到以下路径：blog/_config.volantis.yml"},{"title":"网站与文章封面","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/theme-settings/cover/index.html","permalink":"https://volantis.js.org/v3/theme-settings/cover/","excerpt":"","text":"封面方案blog/_config.volantis.ymlcover: scheme: docs # docs, blog ... 目前主题提供两种封面方案，全屏封面适用于项目文档，半屏封面适用于个人博客。您可以修改参数决定在任何页面是否显示。 封面布局blog/_config.volantis.ymlcover: ... layout: dock # search (搜索), dock (坞), featured (精选), focus (焦点) ... 默认显示设置blog/_config.volantis.ymlcover: ... display: home: true archive: false others: false # can be written in front-matter 'cover: true' 由于主页、归档是hexo自动生成的，您需要在主题配置文件中设置是否显示封面，而其它页面则可以在 front-matter 中通过设置 cover: true/false 来决定显示封面或者不显示封面。"},{"title":"设置网站页脚","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/theme-settings/footer/index.html","permalink":"https://volantis.js.org/v3/theme-settings/footer/","excerpt":"","text":"您通过 layout 可以自由布局网站页脚内容 aplayer, social, license, info, copyright。 blog/_config.volantis.ymlfooter: # layout of footer: [aplayer, social, license, info, copyright] layout: [aplayer, social, license, info, copyright] social: - icon: fas fa-rss url: atom.xml - icon: fas fa-envelope url: mailto:me@xaoxuu.com - icon: fab fa-github url: https://github.com/xaoxuu - icon: fas fa-headphones-alt url: https://music.163.com/#/user/home?id=63035382 copyright: '[Copyright © 2017-2021 XXX](/)' # You can add your own property here. (Support markdown, for example: br: '<br>') br: '<br>' 其中，aplayer 需要在插件部分设置中启用。您可以新增文字属性，用于展示其它文字信息，例如： blog/_config.volantis.ymlfooter: layout: [..., br, hello, ...] ... # You can add your own property here. (Support markdown, for example: br: '<br>') br: '<br>' hello: '[Hello World](/)'"},{"title":"设置默认布局","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/theme-settings/layout/index.html","permalink":"https://volantis.js.org/v3/theme-settings/layout/","excerpt":"","text":"您可以自由决定每个页面是否显示侧边栏，侧边栏显示什么小部件，正文区域显示什么卡片，文章卡片显示什么 meta 信息。 layout: # The following can be written in `blog/source/_data/layout.yml` # 文章列表（主页、自定义的列表）布局 on_list: # 列表中每一篇文章的meta信息 meta: [title, author, date, category, top] # 列表类页面的侧边栏 sidebar: [blogger, category, tagcloud, qrcode] # 页面布局 on_page: # 文章页面主体元素，你也可以在页面的Front-matter中设置 body: [article, comments] # 默认的meta信息，文章中没有配置则按照这里的配置来显示，设置为false则不显示 # 其中，title只在header中有效，music和thumbnail无需在这里设置，文章中有则显示 # 如果tags放置在meta.header中，那么在post列表中不显示（因为卡片下方已经有了） meta: header: [title, author, category, date, top] footer: [updated, tags, btns, share] # 文章页面的侧边栏 sidebar: [qrcode, toc] # 文章布局，参数继承自 on_page on_post: # 文章页脚，自动在每一篇文章末尾添加 article_footer: [copyright, donate] # 其他的页面布局暂时等于 on_list 其中 meta 部分的取值自 meta 库， 其余部分取值自 widget 库， （ body 除了可以从 widget 库中取值外，还可以选择 article 和 comments ）。 请别着急，具体的库配置将在下文详细讲解。"},{"title":"元数据组件","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/theme-settings/meta/index.html","permalink":"https://volantis.js.org/v3/theme-settings/meta/","excerpt":"","text":"meta 即文章的元数据，描述文章的作者、发布时间、更新时间等等信息，Volantis 不替您决定，显示什么图标、如何描述都可以自定义。 blog/_config.volantis.ymlmeta: # 文章标题 title: # 暂无配置 # 默认文章作者（可在front-matter中覆盖） author: avatar: https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png name: Mr. X url: https://xaoxuu.com # 文章创建日期 date: icon: fas fa-edit title: '发布于：' format: 'll' # 日期格式 http://momentjs.com/docs/ # 文章更新日期 updated: icon: fas fa-save title: '更新于：' format: 'll' # 日期格式 http://momentjs.com/docs/ # 文章分类 category: icon: fas fa-folder-open # 文章置顶 top: icon: fas fa-angle-double-up # 文章浏览计数 counter: icon: fas fa-eye # 文章字数和阅读时长 wordcount: icon_wordcount: fas fa-keyboard icon_duration: fas fa-hourglass-half # 文章标签 tags: icon: fas fa-hashtag # 分享 share: - id: qq img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/qq.png - id: qzone img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/qzone.png - id: weibo img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/weibo.png # - id: qrcode # 当id为qrcode时需要安装插件 npm i -S hexo-helper-qrcode # img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/wechat.png # 链接 btns: edit: icon: fas fa-edit title: 在GitHub上编辑此页 color: '#888' repo: # 源码链接 icon: fas fa-file-code title: 源码 color: '#508EF2' bug: # BUG反馈链接 icon: fas fa-bug title: BUG color: '#FE5F58' doubt: # 疑问链接 icon: fas fa-question-circle title: 疑问 color: '#FFBD2B' idea: # 建议链接 icon: fas fa-lightbulb title: 建议 color: '#3DC550' faq: # FAQ链接 icon: fas fa-comments title: FAQ color: '#29B1C9' feedback: # 反馈链接 icon: fas fa-comment-dots title: 反馈 color: '#1BCDFC'"},{"title":"设置网站导航栏","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/theme-settings/navbar/index.html","permalink":"https://volantis.js.org/v3/theme-settings/navbar/","excerpt":"","text":"导航栏配置导航栏分为 logo、menu、search 三个区域设置，其中 logo 区域如果设置了图片，则不能显示图标和标题， menu 区域的设置可以写在一个单独的文件中。 blog/_config.volantis.ymlnavbar: logo: # choose [img] or [icon + title] img: icon: title: menu: # The following can be written in `blog/source/_data/menu.yml` - name: 博客 icon: fas fa-rss url: / - name: 分类 icon: fas fa-folder-open url: categories/ - name: 标签 icon: fas fa-tags url: tags/ - name: 归档 icon: fas fa-archive url: archives/ - name: 友链 icon: fas fa-link url: friends/ - name: 关于 icon: fas fa-info-circle url: about/ search: 搜索 # Search bar placeholder 使用数据文件 建议新建一个文件，专门存放导航栏菜单配置，文件的路径为： blog/source/_data/menu.yml 文件的内容为： blog/source/_data/menu.yml- name: 博客 icon: fas fa-rss url: /... 菜单嵌套导航栏菜单支持嵌套，嵌套的属性名为 rows ，写法示例： blog/source/_data/menu.yml...- name: 更多 icon: fas fa-ellipsis-v rows: - name: 主题源码 url: https://github.com/volantis-x/hexo-theme-volantis/ - name: 更新日志 url: https://github.com/volantis-x/hexo-theme-volantis/releases/ - name: hr - name: 有疑问？ rows: - name: 看 FAQ url: faqs/ - name: 看 本站源码 url: https://github.com/volantis-x/volantis-docs/ - name: 提 Issue url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: hr - name: 公告和测试博文 url: archives/ - name: 示例博客 url: examples/ - name: 特别感谢 url: contributors/ 分割线在子菜单中，新增一个只有 name: hr 的“菜单”就会被渲染成一个分割线。 - name: hr 小标题在子菜单中，新增一个只有 name: 小标题内容（也可以有 icon: 小标题的图标）的“菜单”就会被渲染成一个小标题。 ...- name: 近期 icon: fas fa-clock url: / rows: - name: 热门文章 icon: fas fa-fire - name: ProHUD 开源库的设计思路 url: blog/2019-08-27-prohud/ - name: ValueX：实用的安全对象类型转换库 url: blog/2019-08-29-valuex/ - name: 心率管家 App 的设计与开发 url: blog/2019-07-23-heartmate/"},{"title":"第三方插件","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/theme-settings/plugins/index.html","permalink":"https://volantis.js.org/v3/theme-settings/plugins/","excerpt":"","text":"插件库Volantis 为丰富的插件提供了兼容性优化。大部分插件您只需开启和关闭，无需进行设置。 blog/_config.volantis.ymlplugins: ################ required plugins ################ # jquery jquery: https://cdn.jsdelivr.net/npm/jquery@3.5/dist/jquery.min.js ################ optional plugins ################ # fontawesome fontawesome: https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.13/css/all.min.css # fontawesome animation fontawesome_animation: https://cdn.jsdelivr.net/gh/l-lin/font-awesome-animation/dist/font-awesome-animation.min.css # fancybox fancybox: https://cdn.jsdelivr.net/npm/@fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css ######## Plugins to improve loading speed: # Preload (The menu's url must end with ‘/’) instant_page: https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@2/js/instant_page.js ######## Plugins to optimize the experience: # highlight.js highlightjs: js: https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@9.18.1/build/highlight.min.js css: https://cdn.jsdelivr.net/npm/highlight.js@9.18.1/styles/solarized-light.css # more: https://www.jsdelivr.com/package/npm/highlight.js?path=styles # https://scrollrevealjs.org/api/reveal.html scrollreveal: js: https://cdn.jsdelivr.net/npm/scrollreveal@4.0.6/dist/scrollreveal.min.js distance: 32px duration: 800 # ms interval: 20 # ms scale: 1 # 0.1~1 # Codeblock Copy Button clipboard: https://cdn.jsdelivr.net/npm/clipboard@2/dist/clipboard.min.js ######## Plugins for SEO: # Traffic statistics (very slow loading) busuanzi: https://cdn.jsdelivr.net/gh/volantis-x/cdn-busuanzi@2.3/js/busuanzi.pure.mini.js # npm i --save hexo-wordcount wordcount: #true ######## Plugins for ... # Button Ripple Effect nodewaves: css: https://cdn.jsdelivr.net/npm/node-waves@0.7.6/dist/waves.min.css js: https://cdn.jsdelivr.net/npm/node-waves@0.7.6/dist/waves.min.js # Typing Effects comment_typing: #https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@2/js/comment_typing.js # Slide Background backstretch: enable: true js: https://cdn.jsdelivr.net/npm/jquery-backstretch@2.1.18/jquery.backstretch.min.js position: cover # cover: sticky on the cover. fixed: Fixed as background for the site. shuffle: true # shuffle playlist duration: 20000 # Duration (ms) fade: 1500 # fade duration (ms) (Not more than 1500) images: # For personal use only. At your own risk if used for commercial purposes !!! - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/001.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/002.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/003.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/004.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/005.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/006.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/012.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/016.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/019.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/033.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/034.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/035.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/038.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/039.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/042.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/046.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/051.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/052.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/054.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/056.jpg # APlayer is only available in mainland China. # APlayer config: https://github.com/metowolf/MetingJS aplayer: enable: true js: - https://cdn.jsdelivr.net/npm/aplayer@1.10/dist/APlayer.min.js - https://cdn.jsdelivr.net/npm/meting@2.0/dist/Meting.min.js - js/aplayer.js # Required server: netease # netease, tencent, kugou, xiami, baidu type: playlist # song, playlist, album, search, artist id: 3175833810 # song id / playlist id / album id / search keyword # Optional fixed: false # enable fixed mode theme: '#1BCDFC' # main color autoplay: false # audio autoplay order: list # player play order, values: 'list', 'random' loop: all # player loop play, values: 'all', 'one', 'none' volume: 0.7 # default volume, notice that player will remember user setting, default volume will not work after user set volume themselves list_max_height: 320px # list max height list_folded: true pjax: enable: true timeout: 5000 # The timeout in milliseconds for the XHR requests. Set to 0 to disable the timeout. cacheBust: false # When set to true, Pjax appends a timestamp to skip the browser cache. animation: nprogress # nprogress, circle banUrl: # 被屏蔽的 url 地址将不启用 pjax 跳转，可以在控制台下使用 window.location.pathname 获取 # - '/about/index.html' # Artitalk https://artitalk.js.org # 配置过程请参考：https://artitalk.js.org/doc.html # 除appID和appKEY外均为选填项 Artitalk: enable: false # true为开启，false为关闭 appID: ogP8qj3veMh0LFpFWMPOyF0X-MdYXbMMI # your appID appKEY: nHXLd3N3Jgh460t2iRQKWAtr # your appKEY # severurl: #leancloud绑定的安全域名，使用国际版的话不需要填写 # slanguage: # 语言设置，zh为汉语，en为英语，es为西班牙语。默认为汉语 # per: #每页说说的显示数量 # placeholder1: #在编辑说说的输入框中的占位符 # placeholder2: #自定义头像url的输入框的占位符 # lazy: #加载动画的开关，1为开，0为关，默认为开 # bgimg: #说说输入框背景图片url # color1: #说说背景颜色1&按钮颜色1 # color2: #说说背景颜色2&按钮颜色2 # color3: #说说字体颜色 ################################## # 暗黑模式 darkmodejs # https://darkmodejs.learn.uno # 暗黑模式样式：https://github.com/volantis-x/hexo-theme-volantis/blob/master/source/css/_third-party/darkmode.styl darkmodejs: enable: false js: https://cdn.jsdelivr.net/npm/darkmode-js@1.5/lib/darkmode-js.min.js bottom: 32px right: unset left: 16px time: 0s mixColor: '#f4f4f4' backgroundColor: '#f4f4f4' buttonColorDark: '#100f2c' buttonColorLight: '#f4f4f4' saveInCookies: true label: 🌓 autoMatchOsTheme: true 幻灯片背景blog/_config.volantis.ymlplugins: ... backstretch: enable: true js: https://cdn.jsdelivr.net/npm/jquery-backstretch@2.1.18/jquery.backstretch.min.js position: cover # cover: sticky on the cover. fixed: Fixed as background for the site. duration: 20000 # Duration (ms) fade: 1500 # fade duration (ms) (Not more than 1500) images: # For personal use only. At your own risk if used for commercial purposes !!! - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg ... 幻灯片背景图片显示的位置可以选择粘贴在封面上，跟随封面一起滑动，也可以选择固定作为网页背景图片。 highlight.jsblog/_config.volantis.ymlplugins: ... highlightjs: js: https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@9.18.1/build/highlight.min.js css: https://cdn.jsdelivr.net/npm/highlight.js@9.18.1/styles/solarized-light.css 如果需要使用 highlight.js 进行语法高亮，请将站点配置文件中的 highlight.enable 设置为 false 否则不会加载插件。您可以在 94 种 语法高亮主题 中挑选喜爱的主题，然后替换上面的 css 链接。 如果您使用 highlight.js 请确保没有使用 hexo 官方的 codeblock 标签，否则会报错。 经测试，使用 highlight.js 的情况下，部分容器内的代码可能仍然会被渲染甚至报错。 APlayer 音乐播放器blog/_config.volantis.ymlplugins: ... aplayer: enable: true js: - https://cdn.jsdelivr.net/npm/aplayer@1.10/dist/APlayer.min.js - https://cdn.jsdelivr.net/npm/meting@2.0/dist/Meting.min.js # Required server: netease # netease, tencent, kugou, xiami, baidu type: playlist # song, playlist, album, search, artist id: 3175833810 # song id / playlist id / album id / search keyword # Optional fixed: false # enable fixed mode theme: '#1BCDFC' # main color autoplay: false # audio autoplay order: list # player play order, values: 'list', 'random' loop: all # player loop play, values: 'all', 'one', 'none' volume: 0.7 # default volume, notice that player will remember user setting, default volume will not work after user set volume themselves list_max_height: 340px # list max height list_folded: true APlayer播放器只可以在中国大陆地区使用。相关文档： APlayer | MetingJS Artitalkblog/_config.volantis.ymlplugins: ... # Artitalk https://artitalk.js.org # 配置过程请参考：https://artitalk.js.org/doc.html # 除appID和appKEY外均为选填项 Artitalk: enable: false # true为开启，false为关闭 appID: ogP8qj3veMh0LFpFWMPOyF0X-MdYXbMMI # your appID appKEY: nHXLd3N3Jgh460t2iRQKWAtr # your appKEY # severurl: #leancloud绑定的安全域名，使用国际版的话不需要填写 # slanguage: # 语言设置，zh为汉语，en为英语，es为西班牙语。默认为汉语 # per: #每页说说的显示数量 # placeholder1: #在编辑说说的输入框中的占位符 # placeholder2: #自定义头像url的输入框的占位符 # lazy: #加载动画的开关，1为开，0为关，默认为开 # bgimg: #说说输入框背景图片url # color1: #说说背景颜色1&按钮颜色1 # color2: #说说背景颜色2&按钮颜色2 # color3: #说说字体颜色"},{"title":"站内搜索","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/theme-settings/search/index.html","permalink":"https://volantis.js.org/v3/theme-settings/search/","excerpt":"","text":"blog/_config.volantis.ymlsearch: enable: true service: hexo # hexo, google, algolia, azure, baidu js: https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@2.6.4/js/search.js google: apiKey: engineId: algolia: applicationID: apiKey: indexName: azure: serviceName: indexName: queryKey: baidu: apiId: 默认配置为 Hexo 搜索，但是需要安装插件才能使用： npm i -S hexo-generator-search hexo-generator-json-content"},{"title":"自定义主题外观","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/theme-settings/style/index.html","permalink":"https://volantis.js.org/v3/theme-settings/style/","excerpt":"","text":"最大布局宽度blog/_config.volantis.ymlstyle: ... max_width: 1080px # Sum of body width and sidebar width 网页所呈现的内容的最大宽度，即 body 和 sidebar 的宽度之和。 抗锯齿blog/_config.volantis.ymlstyle: ... font_smoothing: true # font-smoothing for webkit 自定义光标样式blog/_config.volantis.ymlstyle: ... cursor: enable: true text: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/text.png pointer: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/pointer.png default: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/left_ptr.png not-allowed: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/circle.png zoom-out: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/zoom-out.png zoom-in: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/zoom-in.png grab: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/openhand.png 导航栏样式您可以设置导航栏的高度以及视觉特效，视觉特效目前可选的有： shadow：卡片阴影。 floatable：当鼠标移动到容器内时，呈现出浮起来的效果。 blur：背景模糊效果（毛玻璃），当浏览器不支持时显示为不透明。 blog/_config.volantis.ymlstyle: ... navbar: height: 64px effect: [shadow, blur] # [shadow, floatable, blur] 滚动条样式blog/_config.volantis.ymlstyle: ... scrollbar: size: 4px border: 2px color: '#2196f3' hover: '#ff5722' 侧边栏样式视觉特效参数同上，值得注意的是：卡片的 floatable 效果和 blur 效果相冲突。 blog/_config.volantis.ymlstyle: ... sidebar: effect: [shadow] # [shadow, floatable, blur] 正文区域样式视觉特效参数同上，值得注意的是：卡片的 floatable 效果和 blur 效果相冲突。您可以在 language: true 这里设置代码块显示语言名称。text_align 可以设置 h1/h2/h3/h4/p 的文字对齐方向。 blog/_config.volantis.ymlstyle: ... body: effect: [shadow] # [shadow, floatable, blur] highlight: language: true # show language of codeblock copy_btn: true text_align: # left, right, justify, center h1: left h2: left h3: left h4: left p: justify note: # style for default note: {% note text %} icon: '\\f054' color: '' 布局间距您可以设置几种标题的布局间距 h2/h3/h4、段落间距 line、区块内部的段落间距 inline。 blog/_config.volantis.ymlstyle: ... gap: h2: 48px # Spacing above H2 (only px unit) h3: 32px # Spacing above H3 (only px unit) h4: 16px # Spacing above H4 (only px unit) paragraph: 1rem # Paragraph spacing between paragraphs row: .5rem # Paragraph spacing between other elements 自定义字体您可以自定义正文和代码字体。 blog/_config.volantis.ymlstyle: ... fontfamily: logofont: fontfamily: '"Varela Round", "PingFang SC", "Microsoft YaHei", Helvetica, Arial' name: 'Varela Round' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/VarelaRound/VarelaRound-Regular.ttf weight: normal style: normal bodyfont: fontfamily: 'UbuntuMono, "PingFang SC", "Microsoft YaHei", Helvetica, Arial' name: 'UbuntuMono' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/UbuntuMono/UbuntuMono-Regular.ttf weight: normal style: normal codefont: fontfamily: 'Menlo, Monaco' name: 'Monaco' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/Monaco/Monaco.ttf weight: normal style: normal 自定义颜色blog/_config.volantis.ymlstyle: ... color: site: '#21232F' # Website background color card: '#444' # Card background color text: '#fff' # The color of the text on the card. theme: '#ff9800' # Main color link: '#1BCDFC' # Link color hover: '#ff5722' # Link highlight color inner: '#333' # Text color inside the button block: '#555' # Block color inlinecode: yellow # Inline code color codeblock: '#555' # Codeblock color p: '#ccc' # Paragraph color 自定义右键菜单blog/_config.volantis.ymlrightmenu: enable: true # hr: 分割线, music: 音乐控制器 layout: [home, help, examples, contributors, hr, source_docs, source_theme, hr, print, hr, music] # 可选功能项 print: name: 打印页面 icon: fa fa-print onclick: document.execCommand('print') # 自定义菜单的格式如下 help: name: 常见问题 icon: fa fa-question url: https://volantis.js.org/faqs/ examples: name: 示例博客 icon: fa fa-rss url: https://volantis.js.org/examples/ contributors: name: 加入社区 icon: fa fa-fan fa-spin url: https://volantis.js.org/contributors/ source_docs: name: 本站源码 icon: fa fa-code-branch url: https://github.com/volantis-x/volantis-docs/ source_theme: name: 主题源码 icon: fa fa-code-branch url: https://github.com/volantis-x/hexo-theme-volantis/"},{"title":"卡片式组件","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v3/theme-settings/widget/index.html","permalink":"https://volantis.js.org/v3/theme-settings/widget/","excerpt":"","text":"widget 即小部件，大部分小部件都可以放置在侧边栏，一部分已经为正文区域显示做了优化，还有一部分只可以放置在文章页脚部分。与 meta 库不同的是：除了现有的 widget ，您可以很轻易地创建自己的 widget ，然后放在需要的地方。此外，您还可以将 widget 写在单独的文件中。 查看所有相关配置 blog/_config.volantis.ymlwidget: # The following can be written in `blog/source/_data/widget.yml` # --------------------------------------- # blogger info widget blogger: class: blogger display: [desktop] # [desktop, mobile] avatar: https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png title: subtitle: jinrishici: true # Poetry Today. You can set a string, and it will be displayed when loading fails. social: true # --------------------------------------- # toc widget (valid only in articles) toc: class: toc display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-list title: 本文目录 list_number: false min_depth: 2 max_depth: 5 # --------------------------------------- # category widget category: class: category display: [desktop] # [desktop, mobile] header: icon: fas fa-folder-open title: 文章分类 url: /blog/categories/ # --------------------------------------- # tagcloud widget tagcloud: class: tagcloud display: [desktop] # [desktop, mobile] header: icon: fas fa-tags title: 热门标签 url: /blog/tags/ min_font: 14 max_font: 24 color: true start_color: '#999' end_color: '#555' # --------------------------------------- # related posts widget related_posts: class: related_posts # npm i -S hexo-related-popular-posts display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-bookmark title: 相关文章 max_count: 5 # --------------------------------------- # copyright widget (valid only in articles) copyright: class: copyright display: [desktop, mobile] # [desktop, mobile] blockquote: true permalink: '本文永久链接是：' content: - '博客内容遵循 署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 协议' - permalink # --------------------------------------- # qrcode widget donate: class: qrcode display: [desktop, mobile] # [desktop, mobile] height: 64px # Automatic height if not set fancybox: true images: - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png # You can add your own widget here or 'blog/source/_data/widget.yml' # class: text, list, grid, qrcode, page, ... see more at https://volantis.js.org/ 每一个小部件都有 class 和 display，前者代表这个小部件是什么，后者代表这个小部件在什么桌面和移动平台中是否显示，如果在移动平台显示，由于屏幕宽度有限，侧边栏的小部件则会被移动到正文区域下方，因此部分侧边栏小部件便失去意义，建议设置为仅桌面端显示。 小部件名: class: 小部件类别 display: [小部件在桌面端显示, 小部件在移动设备显示] 博主信息部件blog/_config.volantis.ymlblogger: class: blogger display: [desktop] # [desktop, mobile] avatar: https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png title: subtitle: jinrishici: true # Poetry Today. You can set a string, and it will be displayed when loading fails. social: true 其中，今日诗词 jinrishici 如果设置为一个字符串，这个字符串会变成占位文字，加载失败时显示。如果不需要，就请设置为 jinrishici: false。social 的具体内容请在网站页脚部分设置。 文章目录部件blog/_config.volantis.ymltoc: class: toc display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-list title: 本文目录 list_number: false min_depth: 2 max_depth: 5 这个部件只能放置在侧边栏，并且在文章中有效。在移动设备中预览时，手指向上滑动时，导航栏右边会出现 TOC 按钮，点击即可展开 TOC 部件。如果您需要显示章节序号，请设置 list_number。 min_depth 和 max_depth 代表 TOC 支持的标题层级，最大范围是2～6。 文章分类部件blog/_config.volantis.ymlcategory: class: category display: [desktop] # [desktop, mobile] header: icon: fas fa-folder-open title: 文章分类 url: /blog/categories/ 这个部件可以直接显示所有文章分类，如果您希望有一个独立的页面来展示，需要自己创建一个文件，具体操作在「页面」部分文档中。 标签云部件blog/_config.volantis.ymltagcloud: class: tagcloud display: [desktop] # [desktop, mobile] header: icon: fas fa-tags title: 热门标签 url: /blog/tags/ min_font: 14 max_font: 24 color: true start_color: '#999' end_color: '#555' 这个部件可以直接显示所有文章的标签，如果您希望有一个独立的页面来展示，需要自己创建一个文件，具体操作在「页面」部分文档中。 相关文章部件blog/_config.volantis.ymlrelated_posts: class: related_posts # npm i -S hexo-related-popular-posts display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-bookmark title: 相关文章 max_count: 5 这个小部件建议放置在文章页脚，要使用这个部件，您需要安装插件： npm i -S hexo-related-popular-posts 值得注意的是，开启了这个功能之后，每次修改文章内容包括 front-matter 之后，都需要重新 hexo s。 文章版权部件blog/_config.volantis.ymlcopyright: class: copyright display: [desktop, mobile] # [desktop, mobile] blockquote: true permalink: '本文永久链接是：' content: - '博客内容遵循 署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 协议' - permalink 这个部件只可以放置在文章页脚。 二维码部件blog/_config.volantis.ymldonate: class: qrcode display: [desktop, mobile] # [desktop, mobile] height: 64px # Automatic height if not set fancybox: true images: - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png 您可以放置在文章页脚用于展示打赏图片，也可以放置在侧边栏。 通用文本部件blog/_config.volantis.ymlrepos: class: text display: [desktop] # [desktop, mobile] header: icon: fab fa-github title: 点个赞吧 url: https://github.com/xaoxuu/ content: - '您的赞对我来说很重要，如果您喜欢本主题，希望能够给下面的项目点个赞来支持一下。' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/prohud/logo.png" height="50px">](https://github.com/xaoxuu/ProHUD)' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/valuex/logo.png" height="50px">](https://github.com/xaoxuu/ValueX)' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/inspire/logo.png" height="50px">](https://github.com/xaoxuu/Inspire)' 您可以创建用于展示任何文本内容的文本部件。 通用列表部件blog/_config.volantis.ymlwiki-hexo-theme: class: list display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-chevron-left title: Hexo Themes url: /wiki/ rows: - name: Volantis for Hexo url: /wiki/volantis/ - name: Resume for Hexo url: /wiki/resume/ 您可以创建用于展示任何链接列表的列表部件。列表的 rows 中的每一项支持的属性有： name、url、icon、img、avatar，其中 img 是方形图片的链接，avatar 是圆形图片的链接。 参考资料这个部件的布局继承自 list 部件，用于展示文章的参考资料。请将您的 Volantis 升级至 2.5 版本以上使用。 blog/_config.volantis.ymlreferences: class: references # is subclass of list display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-quote-left title: 参考资料 在文章的 front-matter 中设置： front-matterreferences: - name: Apple Developer Documentation url: https://developer.apple.com/documentation/ 组索引这个部件的布局继承自 list 部件，用于展示文章所属的分组的文章列表。请将您的 Volantis 升级至 2.5 版本以上使用。 blog/_config.volantis.ymlgroup-1: class: group display: [desktop, mobile] # [desktop, mobile] header: icon: fab fa-apple title: Developer url: /wiki/ios/ 在文章的 front-matter 中设置： front-mattergroup: group-1order: 16sidebar: [group-1, toc] 「group-1」卡片将会以列表的形式显示所有设置了 group: group-1 的文章，顺序按照 order 从小到大排列。 通用网格部件blog/_config.volantis.ymlfeedback: class: grid display: [desktop, mobile] header: icon: fas fa-headset title: 联系开发者 url: https://github.com/volantis-x/hexo-theme-volantis fixed: true # 固定宽度 rows: - name: 反馈BUG icon: fas fa-bug url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: 疑问求助 icon: fas fa-question-circle url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: 提个建议 icon: fas fa-lightbulb url: https://github.com/volantis-x/hexo-theme-volantis/issues/ 您可以创建用于展示任何链接列表的网格部件。网格默认根据文字长度自动确定每一个格子的宽度，如果文字长短不一，建议通过设置 fixed: true 来固定宽度，此时文字过长的格子中的文字会换行显示。 通用页面部件blog/_config.volantis.ymltest: class: page display: [desktop, mobile] pid: haha content: excerpt # excerpt, more, content 您可以把整个页面的md内容作为一个小部件渲染显示出来。只需要设置小部件里的 pid 属性和文章的 front-matter 中设置一样的 pid 即可。 content 代表这个部件显示的内容，可选 excerpt，more，content 分别对应文章的摘要、摘要后面的内容、全文。 部件库文件部件库中的所有部件都可以写在部件库文件中，您需要创建一个文件在以下路径： blog/source/_data/widget.yml 文件内容示例：widget.yml"},{"title":"标签插件","date":"2021-05-11T15:17:11.735Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"v2/tag-plugins/index.html","permalink":"https://volantis.js.org/v2/tag-plugins/","excerpt":"","text":"主题原生支持丰富多彩的标签。 文本和段落Span & P请将您的 Volantis 升级至 2.5 版本以上使用。 语法格式参数列表示例写法示例效果行内文本 {% span 样式参数, 文本内容 %} 独立段落 {% p 样式参数, 文本内容 %}样式参数位置可以写颜色、大小和对齐方向，多个样式参数用空格隔开。 字体 logo, code 颜色 red, yellow, green, cyan, blue, gray 大小 small, h4, h3, h2, h1, large, huge, ultra 对齐方向 left, center, right彩色文字 example.md:在一段话中方便插入各种颜色的标签，包括：{% span red, 红色 %}、{% span yellow, 黄色 %}、{% span green, 绿色 %}、{% span cyan, 青色 %}、{% span blue, 蓝色 %}、{% span gray, 灰色 %}。 超大文字 example.md:文档「开始」页面中的标题部分就是超大文字。{% p center logo large, Volantis %}{% p center small, A Wonderful Theme for Hexo %}彩色文字 在一段话中方便插入各种颜色的标签，包括：红色、黄色、绿色、青色、蓝色、灰色。 超大文字 文档「开始」页面中的标题部分就是超大文字。 Volantis A Wonderful Theme for Hexo Note & NoteBlockNoteBlock 是 Blockquote 的增强版，在左边显示图标，并且可以自定颜色。而 Note 是 NoteBlock 的简便写法。请将您的 Volantis 升级至 2.3 版本以上使用。 语法格式参数列表示例写法示例效果Note {% note 样式参数, 文本内容 %} NoteBlock {% noteblock 样式参数 %}文本段落{% endnoteblock %}样式参数位置可以写图标和颜色，多个样式参数用空格隔开。 图标 彩色的quote, info, warning, done/success, error/danger 灰色的，也可以指定颜色radiation, bug, idea, link, paperclip, todo, msg, guide, download, up, undo 颜色 指定颜色clear, light, gray, red, yellow, green, cyan, blueNote example.md:{% note, 为简单的一句话提供的简便写法。 %}{% note success, 支持同样丰富的参数。 %} NoteBlock example.md:可以在区块中放置一些复杂的结构，支持嵌套。{% noteblock quote %}{% p subtitle, 小标题 %}Windows 10不是為所有人設計,而是為每個人設計{% p subtitle, 嵌套测试 %}{% noteblock %}请坐和放宽，我正在帮你搞定一切...{% endnoteblock %}{% p subtitle, Folding 测试 %}{% folding 点击查看更多 %}{% note warning, 不要说我们没有警告过你 %}{% noteblock bug red %}我们都有不顺利的时候{% endnoteblock %}{% endfolding %}{% endnoteblock %}Note 为简单的一句话提供的简便写法。 支持同样丰富的参数。 NoteBlock 可以在区块中放置一些复杂的结构，支持嵌套。 小标题Windows 10不是為所有人設計,而是為每個人設計嵌套测试请坐和放宽，我正在帮你搞定一切...Folding 测试 点击查看更多 不要说我们没有警告过你我们都有不顺利的时候 Checkbox & Radio请将您的 Volantis 升级至 2.6 版本以上使用。 语法格式参数列表示例写法示例效果{% checkbox 样式参数（可选）, 文本（支持简单md） %}颜色 red, yellow, green, cyan, blue 样式 plus, minus, times 选中状态 checkedCheckbox example.md:{% checkbox 纯文本测试 %}{% checkbox checked, 支持简单的 [markdown](https://guides.github.com/features/mastering-markdown/) 语法 %}{% checkbox red, 支持自定义颜色 %}{% checkbox green checked, 绿色 + 默认选中 %}{% checkbox yellow checked, 黄色 + 默认选中 %}{% checkbox cyan checked, 青色 + 默认选中 %}{% checkbox blue checked, 蓝色 + 默认选中 %}{% checkbox plus green checked, 增加 %}{% checkbox minus yellow checked, 减少 %}{% checkbox times red checked, 叉 %} Radio example.md:{% radio 纯文本测试 %}{% radio checked, 支持简单的 [markdown](https://guides.github.com/features/mastering-markdown/) 语法 %}{% radio red, 支持自定义颜色 %}{% radio green, 绿色 %}{% radio yellow, 黄色 %}{% radio cyan, 青色 %}{% radio blue, 蓝色 %}Checkbox 纯文本测试 支持简单的 markdown 语法 支持自定义颜色 绿色 + 默认选中 黄色 + 默认选中 青色 + 默认选中 蓝色 + 默认选中 增加 减少 叉 Radio 纯文本测试 支持简单的 markdown 语法 支持自定义颜色 绿色 黄色 青色 蓝色 按钮和菜单基础按钮请将您的 Volantis 升级至 2.4 版本以上使用。 语法格式参数列表示例写法示例效果{% btn 样式参数（可选）, 标题, 链接, 图标（可选） %} 可选的参数可以省略，但是前后顺序不能乱。样式参数 regular, large, center 图标 第1个或者第2个参数包含 fa- 的那个被识别为图标。example.md:不设置任何参数的 {% btn 按钮, / %} 适合融入段落中。regular 按钮适合独立于段落之外：{% btn regular, 示例博客, https://xaoxuu.com, fas fa-play-circle %}large 按钮更具有强调作用，建议搭配 center 使用：{% btn center large, 开始使用, https://volantis.js.org/v3/getting-started/, fas fa-download %}不设置任何参数的 按钮 适合融入段落中。 regular 按钮适合独立于段落之外： 示例博客 large 按钮更具有强调作用，建议搭配 center 使用： 开始使用 富文本按钮请将您的 Volantis 升级至 2.3 版本以上使用。 语法格式参数列表示例写法示例效果{% btns 样式参数 %}{% cell 标题, 链接, 图片或者图标 %}{% cell 标题, 链接, 图片或者图标 %}{% endbtns %}样式参数位置可以写图片样式、布局方式，多个样式参数用空格隔开。 圆角样式 默认为方形 rounded, circle 布局方式 默认为自动宽度，适合视野内只有一两个的情况。 参数 含义 wide 宽一点的按钮 fill 填充布局，自动铺满至少一行，多了会换行。 center 居中，按钮之间是固定间距。 around 居中分散 grid2 等宽最多2列，屏幕变窄会适当减少列数。 grid3 等宽最多3列，屏幕变窄会适当减少列数。 grid4 等宽最多4列，屏幕变窄会适当减少列数。 grid5 等宽最多5列，屏幕变窄会适当减少列数。 增加文字样式 可以在容器内增加 <b>标题</b> 和 <p>描述文字</p>如果需要显示类似「团队成员」之类的一组含有头像的链接： example.md:{% btns circle grid5 %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% endbtns %} 或者含有图标的按钮： example.md:{% btns rounded grid5 %}{% cell 下载源码, /, fas fa-download %}{% cell 查看文档, /, fas fa-book-open %}{% endbtns %} 圆形图标 + 标题 + 描述 + 图片 + 网格5列 + 居中 example.md:{% btns circle center grid5 %}<a href='https://apps.apple.com/cn/app/heart-mate-pro-hrm-utility/id1463348922?ls=1'> <i class='fab fa-apple'></i> <b>心率管家</b> {% p red, 专业版 %} <img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/qrcode/heartmate_pro.png'></a><a href='https://apps.apple.com/cn/app/heart-mate-lite-hrm-utility/id1475747930?ls=1'> <i class='fab fa-apple'></i> <b>心率管家</b> {% p green, 免费版 %} <img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/qrcode/heartmate_lite.png'></a>{% endbtns %}如果需要显示类似「团队成员」之类的一组含有头像的链接： xaoxuu xaoxuu xaoxuu xaoxuu xaoxuu 或者含有图标的按钮： 下载源码 查看文档 圆形图标 + 标题 + 描述 + 图片 + 网格5列 + 居中 心率管家 专业版 心率管家 免费版 Menu请将您的 Volantis 升级至 2.4 版本以上使用。 语法格式示例写法示例效果容器 {% menu 下拉菜单, 图标 %}菜单内容{% endmenu %} 菜单内容 菜单项 {% menuitem 文本, 链接, 图标 %} 分割线 {% menuitem hr %} 子菜单 {% submenu 嵌套菜单, 图标 %}菜单内容{% endsubmenu %}{% menu 下拉菜单 %}{% menuitem 主题源码, https://github.com/volantis-x/hexo-theme-volantis/, fas fa-file-code %}{% menuitem 更新日志, https://github.com/volantis-x/hexo-theme-volantis/releases/, fas fa-clipboard-list %}{% menuitem hr %}{% submenu 有疑问？, fas fa-question-circle %}{% menuitem 看 FAQ, /faqs/ %}{% menuitem 看 本站源码, https://github.com/volantis-x/volantis-docs/ %}{% menuitem 提 Issue, https://github.com/volantis-x/hexo-theme-volantis/issues/ %}{% endsubmenu %}{% endmenu %} 下拉菜单 主题源码 更新日志 有疑问？ 看 FAQ 看 本站源码 提 Issue 容器Tab此插件移植自 NexT #tabs 。请将您的 Volantis 升级至 2.1 版本以上使用。 语法格式参数列表{% tabs tab-id %}<!-- tab tab-name -->![](https://i.loli.net/2020/03/18/f5PQlWisvm9zbgK.jpg)<!-- endtab --><!-- tab tab-name -->这里面写内容，支持的语法格式有限，请尽量<u>不要</u>写太过复杂的东西。<!-- endtab -->{% endtabs %}tab-id 必填，如果一个页面有多个 tabs 时，tab-id 不能重复。 tab-name 标签文本。 Folding请将您的 Volantis 升级至 2.3 版本以上使用。 语法格式参数列表示例写法示例效果{% folding 参数（可选）, 标题 %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endfolding %}参数位置可以填写颜色和状态，多个参数用空格隔开。 颜色 blue, cyan, green, yellow, red 状态 状态填写 open 代表默认打开。{% folding 查看图片测试 %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endfolding %}{% folding cyan open, 查看默认打开的折叠框 %}这是一个默认打开的折叠框。{% endfolding %}{% folding green, 查看代码测试 %}{% endfolding %}{% folding yellow, 查看列表测试 %}- haha- hehe{% endfolding %}{% folding red, 查看嵌套测试 %}{% folding blue, 查看嵌套测试2 %}{% folding 查看嵌套测试3 %}hahaha <span><img src='https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/tieba/%E6%BB%91%E7%A8%BD.png' style='height:24px'></span>{% endfolding %}{% endfolding %}{% endfolding %} 查看图片测试 查看默认打开的折叠框 这是一个默认打开的折叠框。 查看代码测试 {% folding green, 查看代码测试 %}查看代码测试{% endfolding %} 查看列表测试 hahahehe 查看嵌套测试 查看嵌套测试2 查看嵌套测试3 hahaha 多媒体包括图片、音频、视频。 ImageImage 标签是一种针对单个图片应用场景的标签，支持图片描述文字和指定宽度。请将您的 Volantis 升级至 2.6 版本以上使用。 语法格式参数列表示例写法示例效果{% image 链接, width=宽度（可选）, alt=描述（可选） %}图片宽度 阿拉伯数字 + px example:width=300px 图片描述 纯文本，不能包含引号。example.md:添加描述：{% image https://i.loli.net/2020/04/06/zdeQiOY9rBCjhDR.jpg, alt=每天下课回宿舍的路，承载了太多记忆。 %}指定宽度：{% image https://i.loli.net/2020/04/06/zdeQiOY9rBCjhDR.jpg, width=300px %}指定宽度并添加描述：{% image https://i.loli.net/2020/04/06/zdeQiOY9rBCjhDR.jpg, width=300px, alt=每天下课回宿舍的路，承载了太多记忆。 %}添加描述： 每天下课回宿舍的路，承载了太多记忆。 指定宽度： 指定宽度并添加描述： 每天下课回宿舍的路，承载了太多记忆。 FancyboxFancybox 标签是一种针对一组图片应用场景的标签。请将您的 Volantis 升级至 2.2 版本以上使用。 语法格式参数列表示例写法示例效果{% fancybox 参数, 列数 %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B18FCBB3-67FD-48CC-B4F3-457BA145F17A.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/67239FBB-E15D-4F4F-8EE8-0F1C9F3C4E7C.jpeg){% endfancybox %}对齐方向 left, center, right 缩放 stretch 列数 逗号后面直接写列数，支持 2 ～ 8 列。设定列列数之后就是「多行多图」布局，此时图片默认左对齐。为了避免图片大小不一，建议搭配 stretch 来时图片放大填充。一行一个图片 example.md:{% fancybox %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endfancybox %} 一行多个图片（不换行） example.md:{% fancybox %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B18FCBB3-67FD-48CC-B4F3-457BA145F17A.jpeg)![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/67239FBB-E15D-4F4F-8EE8-0F1C9F3C4E7C.jpeg)![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/00E0F0ED-9F1C-407A-9AA6-545649D919F4.jpeg){% endfancybox %} 多行多个图片（每行2～8个图片） example.md:{% fancybox stretch, 4 %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B951AE18-D431-417F-B3FE-A382403FF21B.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/AEB33F9D-7294-4CF1-B8C5-3020748A9D45.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/250662D4-5A21-4AAA-BB63-CD25CF97CFF1.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/10A0FCE5-36A1-4AD0-8CF0-019259A89E03.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B951AE18-D431-417F-B3FE-A382403FF21B.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/AEB33F9D-7294-4CF1-B8C5-3020748A9D45.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/250662D4-5A21-4AAA-BB63-CD25CF97CFF1.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/10A0FCE5-36A1-4AD0-8CF0-019259A89E03.jpeg){% endfancybox %}一行一个图片 图片描述 一行多个图片（不换行） 图片描述 图片描述 图片描述 多行多个图片（每行2～8个图片） Audio请将您的 Volantis 升级至 2.4 版本以上使用。 语法格式示例写法示例效果example.md:{% audio 音频链接 %}example.md:{% audio https://github.com/volantis-x/volantis-docs/releases/download/assets/Lumia1020.mp3 %}Your browser does not support the audio tag. Video请将您的 Volantis 升级至 2.3 版本以上使用。 语法格式参数列表示例写法示例效果单个视频 example.md:{% video 视频链接 %} 多个视频 example.md:{% videos 对齐方向, 列数 %}{% video 视频链接 %}{% video 视频链接 %}{% video 视频链接 %}{% endvideos %}对齐方向 left, center, right 列数 逗号后面直接写列数，支持 1 ～ 4 列。100%宽度 example.md:{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %} 50%宽度 example.md:{% videos, 2 %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% endvideos %} 25%宽度 example.md:{% videos, 4 %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% endvideos %}100%宽度 Your browser does not support the video tag. 50%宽度 Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. 25%宽度 Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. APlayer主题对 APlayer 插件的样式进行了兼容。安装插件： npm i -S hexo-tag-aplayer 官方文档： hexo-tag-aplayer 公式MathJax公式默认是不渲染的，如果文章内有公式，需要在 front-matter 中设置开启。 example.md:---title: 渲染公式（MathJax）date: 2020-02-23mathjax: true # false: 不渲染, true: 渲染, internal: 只在文章内部渲染，文章列表中不渲染---$$t+1=2$$$$\\mbox{积累因子}=\\begin{cases}1+ni & \\mbox{单利}\\\\\\\\(1+i)^n & \\mbox{复利}\\end{cases}$$$$\\begin{equation}\\sum_{i=0}^n F_i \\cdot \\phi (H, p_i) - \\sum_{i=1}^n a_i \\cdot ( \\tilde{x_i}, \\tilde{y_i}) + b_i \\cdot ( \\tilde{x_i}^2 , \\tilde{y_i}^2 )\\end{equation}$$$$\\begin{equation}\\beta^*(D) = \\mathop{argmin} \\limits_{\\beta} \\lambda {||\\beta||}^2 + \\sum_{i=1}^n max(0, 1 - y_i f_{\\beta}(x_i))\\end{equation}$$ 示例效果 $$t+1=2$$$$\\mbox{积累因子}=\\begin{cases}1+ni & \\mbox{单利}\\\\(1+i)^n & \\mbox{复利}\\end{cases}$$$$\\begin{equation}\\sum_{i=0}^n F_i \\cdot \\phi (H, p_i) - \\sum_{i=1}^n a_i \\cdot ( \\tilde{x_i}, \\tilde{y_i}) + b_i \\cdot ( \\tilde{x_i}^2 , \\tilde{y_i}^2 )\\end{equation}$$$$\\begin{equation}\\beta^*(D) = \\mathop{argmin} \\limits_{\\beta} \\lambda {||\\beta||}^2 + \\sum_{i=1}^n max(0, 1 - y_i f_{\\beta}(x_i))\\end{equation}$$ 如果公式仍无法正确渲染可以阅读 @MicDZ 的这篇文章：《在material-x上使用KaTeX》。 Hexo 标签引用块引用书上的句子 Do not just seek happiness for yourself. Seek happiness for all. Through kindness. Through mercy. David LevithanWide Awake 代码块{% codeblock [title] [lang:language] [url] [link text] [additional options] %}code snippet{% endcodeblock %} 指定语言[rectangle setX: 10 y: 10 width: 20 height: 20]; example.md:{% codeblock lang:objc %}[rectangle setX: 10 y: 10 width: 20 height: 20];{% endcodeblock %} 附加说明Array.maparray.map(callback[, thisArg]) example.md:{% codeblock Array.map %}array.map(callback[, thisArg]){% endcodeblock %} 行标、高亮12345678n=eval(input())if n==0: print("Hello World")elif n>0: print("He\\nll\\no \\nWo\\nrl\\nd")else: for c in "Hello World": print(c) example.md:{% codeblock lang:python line_number:true mark:3,5,8 %}n=eval(input())if n==0: print("Hello World")elif n>0: print("He\\nll\\no \\nWo\\nrl\\nd")else: for c in "Hello World": print(c){% endcodeblock %} Pull Quote在文章中插入 Pull quote example.md:{% pullquote [class] %}content{% endpullquote %} jsFiddle在文章中嵌入 jsFiddle example.md:{% jsfiddle shorttag [tabs] [skin] [width] [height] %} Gist在文章中嵌入 Gist，注意：在国内无法加载。 example.md:{% gist gist_id [filename] %} iframe在文章中插入 iframe example.md:{% iframe url [width] [height] %} Image在文章中插入指定大小的图片。 example.md:{% img [class names] /path/to/image [width] [height] '"title text" "alt text"' %} Link在文章中插入链接，并自动给外部链接添加 target="_blank" 属性。 example.md:{% link text url [external] [title] %} Include Code插入 source/downloads/code 文件夹内的代码文件。source/downloads/code 不是固定的，取决于你在配置文件中 code_dir 的配置。 example.md:{% include_code [title] [lang:language] [from:line] [to:line] path/to/file %} 示例 嵌入 test.js 文件全文{% include_code lang:javascript test.js %}只嵌入第 3 行{% include_code lang:javascript from:3 to:3 test.js %}嵌入第 5 行至第 8 行{% include_code lang:javascript from:5 to:8 test.js %}嵌入第 5 行至文件结束{% include_code lang:javascript from:5 test.js %}嵌入第 1 行至第 8 行{% include_code lang:javascript to:8 test.js %} 引用文章引用其他文章的链接。 {% post_path filename %}{% post_link filename [title] [escape] %} 示例 引用这篇文章：主题更名为「Volantis」example.md:引用这篇文章：{% post_link news/2020-02-22 %} 文章摘要和截断在文章中使用 <!-- more -->，那么 <!-- more --> 之前的文字将会被视为摘要。首页中将只出现这部分文字，同时这部分文字也会出现在正文之中。 更多请见Hexo官方文档：#标签插件"},{"title":"主题配置","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v2/theme-settings/index.html","permalink":"https://volantis.js.org/v2/theme-settings/","excerpt":"","text":"如无特殊说明，本页面的配置信息写在 主题 的 config.yml 文件中。 实用小技巧所有需要写在主题配置文件中的配置都可以写在站点配置文件的 theme_config: 中详见 Hexo 官方文档 #覆盖主题配置也可以直接查看本站源码中站点配置文件的写法：_config.yml 主题样式您可以在主题配置文件中设定一些简单的样式，在开始前，确保没有使用 CDN 服务，否则修改不会生效。 最大布局宽度blog/themes/volantis/_config.ymlstyle: ... max_width: 1080px # Sum of body width and sidebar width 网页所呈现的内容的最大宽度，即 body 和 sidebar 的宽度之和。 导航栏样式您可以设置导航栏的高度以及视觉特效，视觉特效目前可选的有： shadow：卡片阴影。 floatable：当鼠标移动到容器内时，呈现出浮起来的效果。 blur：背景模糊效果（毛玻璃），当浏览器不支持时显示为不透明。 blog/themes/volantis/_config.ymlstyle: ... navbar: height: 64px effect: [shadow, blur] # [shadow, floatable, blur] 滚动条样式blog/themes/volantis/_config.ymlstyle: ... scrollbar: size: 4px border: 2px color: '#2196f3' hover: '#ff5722' 侧边栏样式视觉特效参数同上，值得注意的是：卡片的 floatable 效果和 blur 效果相冲突。 blog/themes/volantis/_config.ymlstyle: ... sidebar: effect: [shadow] # [shadow, floatable, blur] 正文区域样式视觉特效参数同上，值得注意的是：卡片的 floatable 效果和 blur 效果相冲突。您可以在 language: true 这里设置代码块显示语言名称。text_align 可以设置 h1/h2/h3/h4/p 的文字对齐方向。 blog/themes/volantis/_config.ymlstyle: ... body: effect: [shadow] # [shadow, floatable, blur] highlight: language: true # show language of codeblock copy_btn: true text_align: # left, right, justify, center h1: left h2: left h3: left h4: left p: justify note: # style for default note: {% note text %} icon: '\\f054' color: '' 布局间距您可以设置几种标题的布局间距 h2/h3/h4、段落间距 line、区块内部的段落间距 inline。 blog/themes/volantis/_config.ymlstyle: ... gap: h2: 48px # Spacing above H2 (only px unit) h3: 32px # Spacing above H3 (only px unit) h4: 16px # Spacing above H4 (only px unit) paragraph: 1rem # Paragraph spacing between paragraphs row: .5rem # Paragraph spacing between other elements 自定义字体您可以自定义正文和代码字体。 blog/themes/volantis/_config.ymlstyle: ... fontfamily: logofont: fontfamily: '"Varela Round", "PingFang SC", "Microsoft YaHei", Helvetica, Arial' name: 'Varela Round' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/VarelaRound/VarelaRound-Regular.ttf weight: normal style: normal bodyfont: fontfamily: 'UbuntuMono, "PingFang SC", "Microsoft YaHei", Helvetica, Arial' name: 'UbuntuMono' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/UbuntuMono/UbuntuMono-Regular.ttf weight: normal style: normal codefont: fontfamily: 'Menlo, Monaco' name: 'Monaco' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/Monaco/Monaco.ttf weight: normal style: normal 颜色样式blog/themes/volantis/_config.ymlstyle: ... color: site: '#21232F' # Website background color card: '#444' # Card background color text: '#fff' # The color of the text on the card. theme: '#ff9800' # Main color link: '#1BCDFC' # Link color hover: '#ff5722' # Link highlight color inner: '#333' # Text color inside the button block: '#555' # Block color inlinecode: yellow # Inline code color codeblock: '#555' # Codeblock color p: '#ccc' # Paragraph color 设置封面目前主题提供两种封面方案，全屏封面适用于项目文档，半屏封面适用于个人博客。您可以修改参数决定在任何页面是否显示。 默认显示设置blog/themes/volantis/_config.ymlcover: ... display: home: true archive: false others: false # can be written in front-matter 'cover: true' 由于主页、归档是hexo自动生成的，您需要在主题配置文件中设置是否显示封面，而其它页面则可以在 front-matter 中通过设置 cover: true/false 来决定显示封面或者不显示封面。 设置导航栏导航栏分为 logo、menu、search 三个区域设置，其中 logo 区域如果设置了图片，则不能显示图标和标题， menu 区域的设置可以写在一个单独的文件中。 blog/themes/volantis/_config.ymlnavbar: logo: # choose [img] or [icon + title] img: icon: title: menu: # The following can be written in `blog/source/_data/menu.yml` - name: 博客 icon: fas fa-rss url: / - name: 分类 icon: fas fa-folder-open url: categories/ - name: 标签 icon: fas fa-tags url: tags/ - name: 归档 icon: fas fa-archive url: archives/ - name: 友链 icon: fas fa-link url: friends/ - name: 关于 icon: fas fa-info-circle url: about/ search: 搜索 # Search bar placeholder 使用数据文件建议新建一个文件，专门存放导航栏菜单配置，文件的路径为： blog/source/_data/menu.yml 文件的内容为： blog/source/_data/menu.yml- name: 博客 icon: fas fa-rss url: /... 菜单嵌套导航栏菜单支持嵌套，嵌套的属性名为 rows ，写法示例： blog/source/_data/menu.yml...- name: 更多 icon: fas fa-ellipsis-v rows: - name: 主题源码 url: https://github.com/volantis-x/hexo-theme-volantis/ - name: 更新日志 url: https://github.com/volantis-x/hexo-theme-volantis/releases/ - name: hr - name: 有疑问？ rows: - name: 看 FAQ url: faqs/ - name: 看 本站源码 url: https://github.com/volantis-x/volantis-docs/ - name: 提 Issue url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: hr - name: 公告和测试博文 url: archives/ - name: 示例博客 url: examples/ - name: 特别感谢 url: contributors/ 分割线在子菜单中，新增一个只有 name: hr 的“菜单”就会被渲染成一个分割线。 - name: hr 小标题在子菜单中，新增一个只有 name: 小标题内容（也可以有 icon: 小标题的图标）的“菜单”就会被渲染成一个小标题。 ...- name: 近期 icon: fas fa-clock url: / rows: - name: 热门文章 icon: fas fa-fire - name: ProHUD 开源库的设计思路 url: blog/2019-08-27-prohud/ - name: ValueX：实用的安全对象类型转换库 url: blog/2019-08-29-valuex/ - name: 心率管家 App 的设计与开发 url: blog/2019-07-23-heartmate/ 这个示例的实际效果： https://xaoxuu.com 播放器在子菜单中，新增一个 icon: fas fa-compact-disc 的“菜单”就会被渲染成一个 APlayer 播放器。 - name: 背景音乐 icon: fas fa-compact-disc 模块化布局您可以自由决定每个页面是否显示侧边栏，侧边栏显示什么小部件，正文区域显示什么卡片，文章卡片显示什么 meta 信息。 layout: # The following can be written in `blog/source/_data/layout.yml` # 文章列表（主页、自定义的列表）布局 on_list: # 列表中每一篇文章的meta信息 meta: [title, author, date, category, top] # 列表类页面的侧边栏 sidebar: [blogger, category, tagcloud, qrcode] # 页面布局 on_page: # 文章页面主体元素，你也可以在页面的Front-matter中设置 body: [article, comments] # 默认的meta信息，文章中没有配置则按照这里的配置来显示，设置为false则不显示 # 其中，title只在header中有效，music和thumbnail无需在这里设置，文章中有则显示 # 如果tags放置在meta.header中，那么在post列表中不显示（因为卡片下方已经有了） meta: header: [title, author, category, date, top] footer: [updated, tags, btns, share] # 文章页面的侧边栏 sidebar: [qrcode, toc] # 文章布局，参数继承自 on_page on_post: # 文章页脚，自动在每一篇文章末尾添加 article_footer: [copyright, donate] # 其他的页面布局暂时等于 on_list 其中 meta 部分的取值自 meta 库， 其余部分取值自 widget 库， （ body 除了可以从 widget 库中取值外，还可以选择 article 和 comments ）。 请别着急，具体的库配置将在下文详细讲解。 meta 库meta 即文章的元数据，描述文章的作者、发布时间、更新时间等等信息，Volantis 不替您决定，显示什么图标、如何描述都可以自定义。 查看所有相关配置 blog/themes/volantis/_config.ymlmeta: # 文章标题 title: # 暂无配置 # 默认文章作者（可在front-matter中覆盖） author: avatar: https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png name: Mr. X url: https://xaoxuu.com # 文章创建日期 date: icon: fas fa-edit title: '发布于：' format: 'll' # 日期格式 http://momentjs.com/docs/ # 文章更新日期 updated: icon: fas fa-save title: '更新于：' format: 'll' # 日期格式 http://momentjs.com/docs/ # 文章分类 category: icon: fas fa-folder-open # 文章置顶 top: icon: fas fa-angle-double-up # 文章浏览计数 counter: icon: fas fa-eye # 文章字数和阅读时长 wordcount: icon_wordcount: fas fa-keyboard icon_duration: fas fa-hourglass-half # 文章标签 tags: icon: fas fa-hashtag # 分享 share: - id: qq img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/qq.png - id: qzone img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/qzone.png - id: weibo img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/weibo.png # - id: qrcode # 当id为qrcode时需要安装插件 npm i -S hexo-helper-qrcode # img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/wechat.png # 链接 btns: edit: icon: fas fa-edit title: 在GitHub上编辑此页 color: '#888' repo: # 源码链接 icon: fas fa-file-code title: 源码 color: '#508EF2' bug: # BUG反馈链接 icon: fas fa-bug title: BUG color: '#FE5F58' doubt: # 疑问链接 icon: fas fa-question-circle title: 疑问 color: '#FFBD2B' idea: # 建议链接 icon: fas fa-lightbulb title: 建议 color: '#3DC550' faq: # FAQ链接 icon: fas fa-comments title: FAQ color: '#29B1C9' feedback: # 反馈链接 icon: fas fa-comment-dots title: 反馈 color: '#1BCDFC' widget 库widget 即小部件，大部分小部件都可以放置在侧边栏，一部分已经为正文区域显示做了优化，还有一部分只可以放置在文章页脚部分。与 meta 库不同的是：除了现有的 widget ，您可以很轻易地创建自己的 widget ，然后放在需要的地方。此外，您还可以将 widget 写在单独的文件中。 查看所有相关配置 blog/themes/volantis/_config.ymlwidget: # The following can be written in `blog/source/_data/widget.yml` # --------------------------------------- # blogger info widget blogger: class: blogger display: [desktop] # [desktop, mobile] avatar: https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png title: subtitle: jinrishici: true # Poetry Today. You can set a string, and it will be displayed when loading fails. social: true # --------------------------------------- # toc widget (valid only in articles) toc: class: toc display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-list title: 本文目录 list_number: false min_depth: 2 max_depth: 5 # --------------------------------------- # category widget category: class: category display: [desktop] # [desktop, mobile] header: icon: fas fa-folder-open title: 文章分类 url: /blog/categories/ # --------------------------------------- # tagcloud widget tagcloud: class: tagcloud display: [desktop] # [desktop, mobile] header: icon: fas fa-tags title: 热门标签 url: /blog/tags/ min_font: 14 max_font: 24 color: true start_color: '#999' end_color: '#555' # --------------------------------------- # related posts widget related_posts: class: related_posts # npm i -S hexo-related-popular-posts display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-bookmark title: 相关文章 max_count: 5 # --------------------------------------- # copyright widget (valid only in articles) copyright: class: copyright display: [desktop, mobile] # [desktop, mobile] blockquote: true permalink: '本文永久链接是：' content: - '博客内容遵循 署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 协议' - permalink # --------------------------------------- # qrcode widget donate: class: qrcode display: [desktop, mobile] # [desktop, mobile] height: 64px # Automatic height if not set fancybox: true images: - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png # You can add your own widget here or 'blog/source/_data/widget.yml' # class: text, list, grid, qrcode, page, ... see more at https://volantis.js.org/ 每一个小部件都有 class 和 display，前者代表这个小部件是什么，后者代表这个小部件在什么桌面和移动平台中是否显示，如果在移动平台显示，由于屏幕宽度有限，侧边栏的小部件则会被移动到正文区域下方，因此部分侧边栏小部件便失去意义，建议设置为仅桌面端显示。 小部件名: class: 小部件类别 display: [小部件在桌面端显示, 小部件在移动设备显示] 博主信息部件blog/themes/volantis/_config.ymlblogger: class: blogger display: [desktop] # [desktop, mobile] avatar: https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png title: subtitle: jinrishici: true # Poetry Today. You can set a string, and it will be displayed when loading fails. social: true 其中，今日诗词 jinrishici 如果设置为一个字符串，这个字符串会变成占位文字，加载失败时显示。如果不需要，就请设置为 jinrishici: false。social 的具体内容请在网站页脚部分设置。 文章目录部件blog/themes/volantis/_config.ymltoc: class: toc display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-list title: 本文目录 list_number: false min_depth: 2 max_depth: 5 这个部件只能放置在侧边栏，并且在文章中有效。在移动设备中预览时，手指向上滑动时，导航栏右边会出现 TOC 按钮，点击即可展开 TOC 部件。如果您需要显示章节序号，请设置 list_number。 min_depth 和 max_depth 代表 TOC 支持的标题层级，最大范围是2～6。 文章分类部件blog/themes/volantis/_config.ymlcategory: class: category display: [desktop] # [desktop, mobile] header: icon: fas fa-folder-open title: 文章分类 url: /blog/categories/ 这个部件可以直接显示所有文章分类，如果您希望有一个独立的页面来展示，需要自己创建一个文件，具体操作在「页面」部分文档中。 标签云部件blog/themes/volantis/_config.ymltagcloud: class: tagcloud display: [desktop] # [desktop, mobile] header: icon: fas fa-tags title: 热门标签 url: /blog/tags/ min_font: 14 max_font: 24 color: true start_color: '#999' end_color: '#555' 这个部件可以直接显示所有文章的标签，如果您希望有一个独立的页面来展示，需要自己创建一个文件，具体操作在「页面」部分文档中。 相关文章部件blog/themes/volantis/_config.ymlrelated_posts: class: related_posts # npm i -S hexo-related-popular-posts display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-bookmark title: 相关文章 max_count: 5 这个小部件建议放置在文章页脚，要使用这个部件，您需要安装插件： npm i -S hexo-related-popular-posts 值得注意的是，开启了这个功能之后，每次修改文章内容包括 front-matter 之后，都需要重新 hexo s。 文章版权部件blog/themes/volantis/_config.ymlcopyright: class: copyright display: [desktop, mobile] # [desktop, mobile] blockquote: true permalink: '本文永久链接是：' content: - '博客内容遵循 署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 协议' - permalink 这个部件只可以放置在文章页脚。 二维码部件blog/themes/volantis/_config.ymldonate: class: qrcode display: [desktop, mobile] # [desktop, mobile] height: 64px # Automatic height if not set fancybox: true images: - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png 您可以放置在文章页脚用于展示打赏图片，也可以放置在侧边栏。 通用文本部件blog/themes/volantis/_config.ymlrepos: class: text display: [desktop] # [desktop, mobile] header: icon: fab fa-github title: 点个赞吧 url: https://github.com/xaoxuu/ content: - '您的赞对我来说很重要，如果您喜欢本主题，希望能够给下面的项目点个赞来支持一下。' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/prohud/logo.png" height="50px">](https://github.com/xaoxuu/ProHUD)' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/valuex/logo.png" height="50px">](https://github.com/xaoxuu/ValueX)' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/inspire/logo.png" height="50px">](https://github.com/xaoxuu/Inspire)' 您可以创建用于展示任何文本内容的文本部件。 通用列表部件blog/themes/volantis/_config.ymlwiki-hexo-theme: class: list display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-chevron-left title: Hexo Themes url: /wiki/ rows: - name: Volantis for Hexo url: /wiki/volantis/ - name: Resume for Hexo url: /wiki/resume/ 您可以创建用于展示任何链接列表的列表部件。列表的 rows 中的每一项支持的属性有： name、url、icon、img、avatar，其中 img 是方形图片的链接，avatar 是圆形图片的链接。 参考资料这个部件的布局继承自 list 部件，用于展示文章的参考资料。请将您的 Volantis 升级至 2.5 版本以上使用。 blog/themes/volantis/_config.ymlreferences: class: references # is subclass of list display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-quote-left title: 参考资料 在文章的 front-matter 中设置： front-matterreferences: - name: Apple Developer Documentation url: https://developer.apple.com/documentation/ 组索引这个部件的布局继承自 list 部件，用于展示文章所属的分组的文章列表。请将您的 Volantis 升级至 2.5 版本以上使用。 blog/themes/volantis/_config.ymlgroup-1: class: group display: [desktop, mobile] # [desktop, mobile] header: icon: fab fa-apple title: Developer url: /wiki/ios/ 在文章的 front-matter 中设置： front-mattergroup: group-1order: 16sidebar: [group-1, toc] 「group-1」卡片将会以列表的形式显示所有设置了 group: group-1 的文章，顺序按照 order 从小到大排列。 效果见： https://xaoxuu.com/wiki/git/ 通用网格部件blog/themes/volantis/_config.ymlfeedback: class: grid display: [desktop, mobile] header: icon: fas fa-headset title: 联系开发者 url: https://github.com/volantis-x/hexo-theme-volantis fixed: true # 固定宽度 rows: - name: 反馈BUG icon: fas fa-bug url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: 疑问求助 icon: fas fa-question-circle url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: 提个建议 icon: fas fa-lightbulb url: https://github.com/volantis-x/hexo-theme-volantis/issues/ 您可以创建用于展示任何链接列表的网格部件。网格默认根据文字长度自动确定每一个格子的宽度，如果文字长短不一，建议通过设置 fixed: true 来固定宽度，此时文字过长的格子中的文字会换行显示。 通用页面部件blog/themes/volantis/_config.ymltest: class: page display: [desktop, mobile] pid: haha content: excerpt # excerpt, more, content 您可以把整个页面的md内容作为一个小部件渲染显示出来。只需要设置小部件里的 pid 属性和文章的 front-matter 中设置一样的 pid 即可。 content 代表这个部件显示的内容，可选 excerpt，more，content 分别对应文章的摘要、摘要后面的内容、全文。 部件库文件部件库中的所有部件都可以写在部件库文件中，您需要创建一个文件在以下路径： blog/source/_data/widget.yml 文件内容示例：widget.yml 设置网站页脚您通过 layout 可以自由布局网站页脚内容 aplayer, social, license, info, copyright。 blog/themes/volantis/_config.ymlfooter: # layout of footer: [aplayer, social, license, info, copyright] layout: [aplayer, social, license, info, copyright] social: - icon: fas fa-rss url: atom.xml - icon: fas fa-envelope url: mailto:me@xaoxuu.com - icon: fab fa-github url: https://github.com/xaoxuu - icon: fas fa-headphones-alt url: https://music.163.com/#/user/home?id=63035382 copyright: '[Copyright © 2017-2021 XXX](/)' # You can add your own property here. (Support markdown, for example: br: '<br>') br: '<br>' 其中，aplayer 需要在插件部分设置中启用。您可以新增文字属性，用于展示其它文字信息，例如： blog/themes/volantis/_config.ymlfooter: layout: [..., br, hello, ...] ... # You can add your own property here. (Support markdown, for example: br: '<br>') br: '<br>' hello: '[Hello World](/)' SEOblog/themes/volantis/_config.ymlseo: # When there are no keywords in the article's front-matter, use tags as keywords. use_tags_as_keywords: true # When there is no description in the article's front-matter, use excerpt as the description. use_excerpt_as_description: true robots: home_first_page: index,follow home_other_pages: noindex,follow archive: noindex,follow category: noindex,follow tag: noindex,follow # robots can be written in front-matter 这部分一般不需要修改。 插件库Volantis 为丰富的插件提供了兼容性优化。大部分插件您只需开启和关闭，无需进行设置。 幻灯片背景blog/themes/volantis/_config.ymlplugins: ... backstretch: enable: true js: https://cdn.jsdelivr.net/npm/jquery-backstretch@2.1.18/jquery.backstretch.min.js position: cover # cover: sticky on the cover. fixed: Fixed as background for the site. duration: 20000 # Duration (ms) fade: 1500 # fade duration (ms) (Not more than 1500) images: # For personal use only. At your own risk if used for commercial purposes !!! - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg ... 幻灯片背景图片显示的位置可以选择粘贴在封面上，跟随封面一起滑动，也可以选择固定作为网页背景图片。 highlight.jsblog/themes/volantis/_config.ymlplugins: ... highlightjs: js: https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@9.18.1/build/highlight.min.js css: https://cdn.jsdelivr.net/npm/highlight.js@9.18.1/styles/solarized-light.css 如果需要使用 highlight.js 进行语法高亮，请将站点配置文件中的 highlight.enable 设置为 false 否则不会加载插件。您可以在 94 种 语法高亮主题 中挑选喜爱的主题，然后替换上面的 css 链接。 如果您使用 highlight.js 请确保没有使用 hexo 官方的 codeblock 标签，否则会报错。 经测试，使用 highlight.js 的情况下，部分容器内的代码可能仍然会被渲染甚至报错。 APlayer 音乐播放器blog/themes/volantis/_config.ymlplugins: ... aplayer: enable: true js: - https://cdn.jsdelivr.net/npm/aplayer@1.10/dist/APlayer.min.js - https://cdn.jsdelivr.net/npm/meting@2.0/dist/Meting.min.js # Required server: netease # netease, tencent, kugou, xiami, baidu type: playlist # song, playlist, album, search, artist id: 3175833810 # song id / playlist id / album id / search keyword # Optional fixed: false # enable fixed mode theme: '#1BCDFC' # main color autoplay: false # audio autoplay order: list # player play order, values: 'list', 'random' loop: all # player loop play, values: 'all', 'one', 'none' volume: 0.7 # default volume, notice that player will remember user setting, default volume will not work after user set volume themselves list_max_height: 340px # list max height list_folded: true APlayer播放器只可以在中国大陆地区使用。相关文档： APlayer | MetingJS 评论系统blog/themes/volantis/_config.ymlcomments: title: <i class='fas fa-comments'></i> 评论 subtitle: service: valine # valine, disqus, gitalk, livere valine: appId: # your appId appKey: # your appKey js: https://cdn.jsdelivr.net/npm/valine@1.4/dist/Valine.min.js path: # All pages use the same path (share the same comments data) meta: nick,mail,link # valine comment header info requiredFields: ['nick','mail'] enableQQ: true # Unstable avatar link placeholder: 快来评论吧~ # valine comment input placeholder(like: Please leave your footprints ) avatar: robohash # gravatar style https://valine.js.org/avatar pageSize: 10 # comment list page size lang: zh-cn highlight: true visitor: true mathJax: false disqus: shortname: gitalk: clientID: clientSecret: repo: owner: admin: # [] livere: uid: Disqus官网： https://disqus.com/ blog/themes/volantis/_config.ymlcomments: ... disqus: shortname: Gitalk官网： https://github.com/gitalk/gitalk blog/themes/volantis/_config.ymlcomments: ... gitalk: clientID: clientSecret: repo: owner: admin: # [] clientID 和 clientSecret 的获取方法可自行搜索教程，这里仅简单描述一下步骤： 点击 GitHub -> Settings https://github.com/settings/profile 点击 Developer settings https://github.com/settings/developers 点击 New OAuth App https://github.com/settings/applications/new 填写信息： Application name 随便填，我的是：xaoxuu.comHomepage URL 和 Authorization callback URL 都写你的网址，我的是：https://xaoxuu.com 可以通过设置 gitalk.id 实现多个页面共用一个评论框。 front-matter---gitalk: id: /wiki/volantis/--- Valine官网： https://valine.js.org blog/themes/volantis/_config.ymlcomments: ... valine: appId: # your appId appKey: # your appKey js: https://cdn.jsdelivr.net/npm/valine@1.4/dist/Valine.min.js path: # All pages use the same path (share the same comments data) meta: nick,mail,link # valine comment header info requiredFields: ['nick','mail'] enableQQ: true # Unstable avatar link placeholder: 快来评论吧~ # valine comment input placeholder(like: Please leave your footprints ) avatar: robohash # gravatar style https://valine.js.org/avatar pageSize: 10 # comment list page size lang: zh-cn highlight: true visitor: true mathJax: false 其中，placeholder 支持在 front-matter 中设置。 front-matter---valine: placeholder: 你觉得xxx怎么样呢？--- 也可以通过设置 valine.path 实现多个页面共用一个评论框。 front-matter---valine: path: /--- MiniValine官网： https://github.com/MiniValine/MiniValine/ blog/themes/volantis/_config.ymlcomments: ... minivaline: appId: # Your leancloud application appid appKey: # Your leancloud application appkey placeholder: Write a Comment # Comment box placeholder adminEmailMd5: # The MD5 of Admin Email to show Admin Flag. math: true # Support MathJax. md: true # Support Markdown. # MiniValine's display language depends on user's browser or system environment # If you want everyone visiting your site to see a uniform language, you can set a force language value # Available values: en | zh-CN | (and many more) # More i18n info: https://github.com/MiniValine/minivaline-i18n lang: Livere官网： https://www.livere.com/ blog/themes/volantis/_config.ymlcomments: ... livere: uid: #你的livere的uid 在这里查看你的 uid：https://livere.com/insight/myCode，在【代码管理 -> 一般网站】中找到如下这段代码，其中 data-uid 中的内容就是你的 livere_uid。 <!-- 来必力City版安装代码 --><div id="lv-container" data-id="city" data-uid="你的livere的uid">... 开启搜索功能blog/themes/volantis/_config.ymlsearch: enable: true service: hexo # hexo, google, algolia, azure, baidu js: https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@2.6.4/js/search.js google: apiKey: engineId: algolia: applicationID: apiKey: indexName: azure: serviceName: indexName: queryKey: baidu: apiId: 默认配置为 Hexo 搜索，但是需要安装插件才能使用： npm i -S hexo-generator-search hexo-generator-json-content"},{"title":"标签插件","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v4/tag-plugins/index.html","permalink":"https://volantis.js.org/v4/tag-plugins/","excerpt":"","text":"为了兼容老用户，旧的标签插件在重构之前依然沿用旧的格式，即「英文逗号+空格」作为参数分隔符，而部分新增标签插件是「空格+英文竖线+空格」，请注意区分。 我们也在探索哪种分隔符既简单又不容易引起冲突，所以可能存在多种格式，具体以对应文档描述为准。 text这是一些文本样式标签： 带 下划线 的文本 example.md:带 {% u 下划线 %} 的文本 带 着重号 的文本 example.md:带 {% emp 着重号 %} 的文本 带 波浪线 的文本 example.md:带 {% wavy 波浪线 %} 的文本 带 删除线 的文本 example.md:带 {% del 删除线 %} 的文本 键盘样式的文本 command + D example.md:键盘样式的文本 {% kbd command %} + {% kbd D %} 密码样式的文本：这里没有验证码 example.md:密码样式的文本：{% psw 这里没有验证码 %} span本插件最后更新于 2.5 版本{% span 样式参数, 文本内容 %} 彩色文字在一段话中方便插入各种颜色的标签，包括：红色、黄色、绿色、青色、蓝色、灰色。 超大号文字文档「开始」页面中的标题部分就是超大号文字。 Volantis A Wonderful Theme for Hexo 上述示例的源码example:#### 彩色文字在一段话中方便插入各种颜色的标签，包括：{% span red, 红色 %}、{% span yellow, 黄色 %}、{% span green, 绿色 %}、{% span cyan, 青色 %}、{% span blue, 蓝色 %}、{% span gray, 灰色 %}。#### 超大号文字文档「开始」页面中的标题部分就是超大号文字。{% span center logo large, Volantis %}{% span center small, A Wonderful Theme for Hexo %} 可以支持的参数样式参数位置可以写颜色、大小和对齐方向，多个样式参数用空格隔开。 字体logo, code 颜色red, yellow, green, cyan, blue, gray 大小small, h4, h3, h2, h1, large, huge, ultra 对齐方向left, center, right p本插件最后更新于 2.5 版本{% p 样式参数, 文本内容 %} 演示效果彩色文字在一段话中方便插入各种颜色的标签，包括：红色、黄色、绿色、青色、蓝色、灰色。 超大号文字文档「开始」页面中的标题部分就是超大号文字。 Volantis A Wonderful Theme for Hexo 上述示例的源码example:#### 彩色文字在一段话中方便插入各种颜色的标签，包括：{% p red, 红色 %}、{% p yellow, 黄色 %}、{% p green, 绿色 %}、{% p cyan, 青色 %}、{% p blue, 蓝色 %}、{% p gray, 灰色 %}。#### 超大号文字文档「开始」页面中的标题部分就是超大号文字。{% p center logo large, Volantis %}{% p center small, A Wonderful Theme for Hexo %} 可以支持的参数样式参数位置可以写颜色、大小和对齐方向，多个样式参数用空格隔开。 字体logo, code 颜色red, yellow, green, cyan, blue, gray 大小small, h4, h3, h2, h1, large, huge, ultra 对齐方向left, center, right noteNoteBlock 是 Blockquote 的增强版，在左边显示图标，并且可以自定颜色。而 Note 是 NoteBlock 的简便写法。 最后更新于 2.3 版本{% note 样式参数, 文本内容 %} 演示效果经典用法可以在配置文件中设置默认样式，为简单的一句话提供最的简便写法。 note quote 适合引用一段话 note info 默认主题色，适合中性的信息 note warning 默认黄色，适合警告性的信息 note error/danger 默认红色，适合危险性的信息 note done/success 默认绿色，适合正确操作的信息 更多图标这些都是默认样式，可以手动加上颜色： note radiation 默认样式 note radiation yellow 可以加上颜色 note bug red 说明还存在的一些故障 note link green 可以放置一些链接 note paperclip blue 放置一些附件链接 note todo 待办事项 note guide clear 可以加上一段向导 note download 可以放置下载链接 note message gray 一段消息 note up 可以说明如何进行更新 note undo light 可以说明如何撤销或者回退 上述示例的源码example:#### 经典用法{% note, 可以在配置文件中设置默认样式，为简单的一句话提供最的简便写法。 %}{% note quote, note quote 适合引用一段话 %}{% note info, note info 默认主题色，适合中性的信息 %}{% note warning, note warning 默认黄色，适合警告性的信息 %}{% note danger, note error/danger 默认红色，适合危险性的信息 %}{% note success, note done/success 默认绿色，适合正确操作的信息 %}#### 更多图标这些都是默认样式，可以手动加上颜色：{% note radiation, note radiation 默认样式 %}{% note radiation yellow, note radiation yellow 可以加上颜色 %}{% note bug red, note bug red 说明还存在的一些故障 %}{% note link green, note link green 可以放置一些链接 %}{% note paperclip blue, note paperclip blue 放置一些附件链接 %}{% note todo, note todo 待办事项 %}{% note guide clear, note guide clear 可以加上一段向导 %}{% note download, note download 可以放置下载链接 %}{% note message gray, note message gray 一段消息 %}{% note up, note up 可以说明如何进行更新 %}{% note undo light, note undo light 可以说明如何撤销或者回退 %} 可以支持的参数样式参数位置可以写图标和颜色，多个样式参数用空格隔开。 图标彩色的quote, info, warning, done/success, error/danger 灰色的，也可以指定颜色radiation, bug, idea, link, paperclip, todo, message, guide, download, up, undo 颜色指定颜色clear, light, gray, red, yellow, green, cyan, blue noteblockNoteBlock 是 Blockquote 的增强版，在左边显示图标，并且可以自定颜色。而 Note 是 NoteBlock 的简便写法。 最后更新于 4.0 版本{% noteblock 样式参数（可选）, 标题（可选） %}文本段落{% endnoteblock %} 演示效果可以在区块中放置一些复杂的结构，支持嵌套。 标题（可选）Windows 10不是為所有人設計,而是為每個人設計嵌套测试： 请坐和放宽，我正在帮你搞定一切... Folding 测试： 点击查看更多 不要说我们没有警告过你我们都有不顺利的时候 上述示例的源码example:{% noteblock, 标题（可选） %}Windows 10不是為所有人設計,而是為每個人設計{% noteblock done %}嵌套测试： 请坐和放宽，我正在帮你搞定一切...{% endnoteblock %}{% folding yellow, Folding 测试： 点击查看更多 %}{% note warning, 不要说我们没有警告过你 %}{% noteblock bug red %}我们都有不顺利的时候{% endnoteblock %}{% endfolding %}{% endnoteblock %} 可以支持的参数样式参数位置可以写图标和颜色，多个样式参数用空格隔开。 图标彩色的quote, info, warning, done/success, error/danger 灰色的，也可以指定颜色radiation, bug, idea, link, paperclip, todo, message, guide, download, up, undo 颜色指定颜色clear, light, gray, red, yellow, green, cyan, blue checkbox最后更新于 2.6 版本{% checkbox 样式参数（可选）, 文本（支持简单md） %} 演示效果 纯文本测试 支持简单的 markdown 语法 支持自定义颜色 绿色 + 默认选中 黄色 + 默认选中 青色 + 默认选中 蓝色 + 默认选中 增加 减少 叉 上述示例的源码example:{% checkbox 纯文本测试 %}{% checkbox checked, 支持简单的 [markdown](https://guides.github.com/features/mastering-markdown/) 语法 %}{% checkbox red, 支持自定义颜色 %}{% checkbox green checked, 绿色 + 默认选中 %}{% checkbox yellow checked, 黄色 + 默认选中 %}{% checkbox cyan checked, 青色 + 默认选中 %}{% checkbox blue checked, 蓝色 + 默认选中 %}{% checkbox plus green checked, 增加 %}{% checkbox minus yellow checked, 减少 %}{% checkbox times red checked, 叉 %} 可以支持的参数颜色red, yellow, green, cyan, blue 样式plus, minus, times 选中状态checked radio最后更新于 2.6 版本{% checkbox 样式参数（可选）, 文本（支持简单md） %} 演示效果 纯文本测试 支持简单的 markdown 语法 支持自定义颜色 绿色 黄色 青色 蓝色 上述示例的源码example:{% radio 纯文本测试 %}{% radio checked, 支持简单的 [markdown](https://guides.github.com/features/mastering-markdown/) 语法 %}{% radio red, 支持自定义颜色 %}{% radio green, 绿色 %}{% radio yellow, 黄色 %}{% radio cyan, 青色 %}{% radio blue, 蓝色 %} 可以支持的参数颜色red, yellow, green, cyan, blue 选中状态checked timeline最后更新于 3.0 版本{% timeline 时间线标题（可选） %}{% timenode 时间节点（标题） %}正文内容{% endtimenode %}{% timenode 时间节点（标题） %}正文内容{% endtimenode %}{% endtimeline %} 演示效果 2020-07-24 2.6.6 -> 3.0 如果有 hexo-lazyload-image 插件，需要删除并重新安装最新版本，设置 lazyload.isSPA: true。2.x 版本的 css 和 js 不适用于 3.x 版本，如果使用了 use_cdn: true 则需要删除。2.x 版本的 fancybox 标签在 3.x 版本中被重命名为 gallery 。2.x 版本的置顶 top: true 改为了 pin: true，并且同样适用于 layout: page 的页面。如果使用了 hexo-offline 插件，建议卸载，3.0 版本默认开启了 pjax 服务。 2020-05-15 2.6.3 -> 2.6.6 不需要额外处理。 2020-04-20 2.6.2 -> 2.6.3 全局搜索 seotitle 并替换为 seo_title。group 组件的索引规则有变，使用 group 组件的文章内，group: group_name 对应的组件名必须是 group_name。group 组件的列表名优先显示文章的 short_title 其次是 title。 上述示例的源码example:{% timeline %}{% timenode 2020-07-24 [2.6.6 -> 3.0](https://github.com/volantis-x/hexo-theme-volantis/releases) %}1. 如果有 `hexo-lazyload-image` 插件，需要删除并重新安装最新版本，设置 `lazyload.isSPA: true`。2. 2.x 版本的 css 和 js 不适用于 3.x 版本，如果使用了 `use_cdn: true` 则需要删除。3. 2.x 版本的 fancybox 标签在 3.x 版本中被重命名为 gallery 。4. 2.x 版本的置顶 `top: true` 改为了 `pin: true`，并且同样适用于 `layout: page` 的页面。5. 如果使用了 `hexo-offline` 插件，建议卸载，3.0 版本默认开启了 pjax 服务。{% endtimenode %}{% timenode 2020-05-15 [2.6.3 -> 2.6.6](https://github.com/volantis-x/hexo-theme-volantis/releases/tag/2.6.6) %}不需要额外处理。{% endtimenode %}{% timenode 2020-04-20 [2.6.2 -> 2.6.3](https://github.com/volantis-x/hexo-theme-volantis/releases/tag/2.6.3) %}1. 全局搜索 `seotitle` 并替换为 `seo_title`。2. group 组件的索引规则有变，使用 group 组件的文章内，`group: group_name` 对应的组件名必须是 `group_name`。2. group 组件的列表名优先显示文章的 `short_title` 其次是 `title`。{% endtimenode %}{% endtimeline %} link最后更新于 3.0 版本{% link 标题, 链接, 图片链接（可选） %} 演示效果如何参与项目https://volantis.js.org/contributors/ 上述示例的源码example:{% link 如何参与项目, https://volantis.js.org/contributors/, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets@master/logo/256/safari.png %} button这个页面的标签将会在不久后重构 基础按钮请将您的 Volantis 升级至 2.4 版本以上使用。 语法格式参数列表示例写法示例效果{% btn 样式参数（可选）, 标题, 链接, 图标（可选） %} 可选的参数可以省略，但是前后顺序不能乱。样式参数 regular, large, center 图标 第1个或者第2个参数包含 fa- 的那个被识别为图标。example.md:不设置任何参数的 {% btn 按钮, / %} 适合融入段落中。regular 按钮适合独立于段落之外：{% btn regular, 示例博客, https://xaoxuu.com, fas fa-play-circle %}large 按钮更具有强调作用，建议搭配 center 使用：{% btn center large, 开始使用, https://volantis.js.org/v3/getting-started/, fas fa-download %}行内按钮 不设置任何参数的 按钮 适合融入段落中。 空心按钮 示例博客 示例博客 示例博客 示例博客 居中： 开始使用 实心按钮 示例博客 示例博客 示例博客 示例博客 居中： 开始使用 富文本按钮请将您的 Volantis 升级至 2.3 版本以上使用。 语法格式参数列表示例写法示例效果{% btns 样式参数 %}{% cell 标题, 链接, 图片或者图标 %}{% cell 标题, 链接, 图片或者图标 %}{% endbtns %}样式参数位置可以写图片样式、布局方式，多个样式参数用空格隔开。 圆角样式 默认为方形 rounded, circle 布局方式 默认为自动宽度，适合视野内只有一两个的情况。 参数 含义 wide 宽一点的按钮 fill 填充布局，自动铺满至少一行，多了会换行。 center 居中，按钮之间是固定间距。 around 居中分散 grid2 等宽最多2列，屏幕变窄会适当减少列数。 grid3 等宽最多3列，屏幕变窄会适当减少列数。 grid4 等宽最多4列，屏幕变窄会适当减少列数。 grid5 等宽最多5列，屏幕变窄会适当减少列数。 增加文字样式 可以在容器内增加 <b>标题</b> 和 <p>描述文字</p>如果需要显示类似「团队成员」之类的一组含有头像的链接： example.md:{% btns circle grid5 %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% endbtns %} 或者含有图标的按钮： example.md:{% btns rounded grid5 %}{% cell 下载源码, /, fas fa-download %}{% cell 查看文档, /, fas fa-book-open %}{% endbtns %} 圆形图标 + 标题 + 描述 + 图片 + 网格5列 + 居中 example.md:{% btns circle center grid5 %}<a href='https://apps.apple.com/cn/app/heart-mate-pro-hrm-utility/id1463348922?ls=1'> <i class='fab fa-apple'></i> <b>心率管家</b> {% p red, 专业版 %} <img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/qrcode/heartmate_pro.png'></a><a href='https://apps.apple.com/cn/app/heart-mate-lite-hrm-utility/id1475747930?ls=1'> <i class='fab fa-apple'></i> <b>心率管家</b> {% p green, 免费版 %} <img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/qrcode/heartmate_lite.png'></a>{% endbtns %}如果需要显示类似「团队成员」之类的一组含有头像的链接： xaoxuu xaoxuu xaoxuu xaoxuu xaoxuu 或者含有图标的按钮： 下载源码 查看文档 圆形图标 + 标题 + 描述 + 图片 + 网格5列 + 居中 心率管家 专业版 心率管家 免费版 ghcard最后更新于 4.0 版本{% ghcard 用户名, 其它参数（可选） %}{% ghcard 用户名/仓库, 其它参数（可选） %} 用户信息卡片 上述示例的源码： example:| {% ghcard xaoxuu %} | {% ghcard xaoxuu, theme=vue %} || -- | -- || {% ghcard xaoxuu, theme=buefy %} | {% ghcard xaoxuu, theme=solarized-light %} || {% ghcard xaoxuu, theme=onedark %} | {% ghcard xaoxuu, theme=solarized-dark %} || {% ghcard xaoxuu, theme=algolia %} | {% ghcard xaoxuu, theme=calm %} | 仓库信息卡片 上述示例的源码： example:| {% ghcard volantis-x/hexo-theme-volantis %} | {% ghcard volantis-x/hexo-theme-volantis, theme=vue %} || -- | -- || {% ghcard volantis-x/hexo-theme-volantis, theme=buefy %} | {% ghcard volantis-x/hexo-theme-volantis, theme=solarized-light %} || {% ghcard volantis-x/hexo-theme-volantis, theme=onedark %} | {% ghcard volantis-x/hexo-theme-volantis, theme=solarized-dark %} || {% ghcard volantis-x/hexo-theme-volantis, theme=algolia %} | {% ghcard volantis-x/hexo-theme-volantis, theme=calm %} | 更多参数选择GitHub 卡片 API 参数https://github-readme-stats.vercel.app site网站卡片可以显示网站截图、logo、标题、描述，使用方法和友链标签一模一样，唯一的区别是数据文件名称为 sites.yml，可以和友链数据混用，通过分组过滤实现不一样的效果。 示例写法{% sites only:community_team %} sites only:community_team MHuiG划水Colsrch开发者inkss摸鱼W4J1e打杂 dropmenu这个页面的标签将会在不久后重构 下拉菜单请将您的 Volantis 升级至 3.0 版本以上使用。 语法格式示例写法示例效果容器 {% menu 前缀（可省略）, 标题, 后缀（可省略） %}菜单内容{% endmenu %} 菜单内容 菜单项 {% menuitem 文本, 链接, 图标 %} 分割线 {% menuitem hr %} 子菜单 {% submenu 嵌套菜单, 图标 %}菜单内容{% endsubmenu %}示例1 {% menu 下拉菜单 %}{% menuitem 主题源码, https://github.com/volantis-x/hexo-theme-volantis/, fas fa-file-code %}{% menuitem 更新日志, https://github.com/volantis-x/hexo-theme-volantis/releases/, fas fa-clipboard-list %}{% menuitem hr %}{% submenu 有疑问？, fas fa-question-circle %}{% menuitem 看 FAQ, /faqs/ %}{% menuitem 看 本站源码, https://github.com/volantis-x/volantis-docs/ %}{% menuitem 提 Issue, https://github.com/volantis-x/hexo-theme-volantis/issues/ %}{% endsubmenu %}{% endmenu %} 示例2 {% menu 这个是, 下拉菜单 %}（同上）{% endmenu %} 示例3 {% menu 这个是, 下拉菜单, 的示例效果。 %}（同上）{% endmenu %}示例1 下拉菜单 主题源码 更新日志 有疑问？ 看 FAQ 看 本站源码 提 Issue 示例2 这个是 下拉菜单 主题源码 更新日志 有疑问？ 看 FAQ 看 本站源码 提 Issue 示例3 这个是 下拉菜单 主题源码 更新日志 有疑问？ 看 FAQ 看 本站源码 提 Issue 的示例效果。 tab此插件移植自 NexT #tabs 最后更新于 2.1 版本{% tabs 页面内不重复的ID %}<!-- tab 栏目1 -->内容<!-- endtab --><!-- tab 栏目2 -->内容<!-- endtab -->{% endtabs %} 演示效果栏目1栏目2。。。！！！ 上述示例的源码example:{% tabs tab-id %}<!-- tab 栏目1 -->。。。<!-- endtab --><!-- tab 栏目2 -->！！！<!-- endtab -->{% endtabs %} folding最后更新于 2.3 版本{% folding 参数（可选）, 标题 %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endfolding %} 演示效果 查看图片测试 查看默认打开的折叠框 这是一个默认打开的折叠框。 查看代码测试 {% folding green, 查看代码测试 %}查看代码测试{% endfolding %} 查看列表测试 hahahehe 查看嵌套测试 查看嵌套测试2 查看嵌套测试3 hahaha 上述示例的源码example:{% folding 查看图片测试 %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endfolding %}{% folding cyan open, 查看默认打开的折叠框 %}这是一个默认打开的折叠框。{% endfolding %}{% folding green, 查看代码测试 %}{% endfolding %}{% folding yellow, 查看列表测试 %}- haha- hehe{% endfolding %}{% folding red, 查看嵌套测试 %}{% folding blue, 查看嵌套测试2 %}{% folding 查看嵌套测试3 %}hahaha <span><img src='https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/tieba/%E6%BB%91%E7%A8%BD.png' style='height:24px'></span>{% endfolding %}{% endfolding %}{% endfolding %} 可以支持的参数参数位置可以填写颜色和状态，多个参数用空格隔开。 颜色blue, cyan, green, yellow, red 状态状态填写 open 代表默认打开。 inlineimageInlineimage 标签是一种行内图片标签，可以用来在一段话中间插入表情。 本插件最后更新于 4.0 版本{% inlineimage 图片链接, height=高度（可选） %} 演示效果这是 一段话。 这又是 一段话。 上述示例的源码example:这是 {% inlineimage https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/aru-l/0000.gif %} 一段话。这又是 {% inlineimage https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/aru-l/5150.gif, height=40px %} 一段话。 可以支持的参数高度height=20px imageImage 标签是一种针对单个图片应用场景的标签，支持图片描述文字和指定宽度。 本插件最后更新于 4.0 版本{% image 链接, width=宽度（可选）, height=高度（可选）, alt=描述（可选）, bg=占位颜色（可选） %} 演示效果添加描述： 每天下课回宿舍的路，没有什么故事。 指定宽度： 指定宽度并添加描述： 每天下课回宿舍的路，没有什么故事。 设置占位背景色： 优化不同宽度浏览的观感 上述示例的源码example:添加描述：{% image https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg, alt=每天下课回宿舍的路，没有什么故事。 %}指定宽度：{% image https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg, width=400px %}指定宽度并添加描述：{% image https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg, width=400px, alt=每天下课回宿舍的路，没有什么故事。 %}设置占位背景色：{% image https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg, width=400px, bg=#1D0C04, alt=优化不同宽度浏览的观感 %} 可以支持的参数图片宽高度example:width=300px, height=32px 图片描述example:alt=图片描述 占位背景色example:bg=#f2f2f2 galleryGallery 标签是一种针对一组图片应用场景的标签。 本插件最后更新于 3.0 版本{% gallery 参数, 列数 %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B18FCBB3-67FD-48CC-B4F3-457BA145F17A.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/67239FBB-E15D-4F4F-8EE8-0F1C9F3C4E7C.jpeg){% endgallery %} 演示效果一行一个图片 图片描述 一行多个图片（不换行） 图片描述 图片描述 图片描述 多行多个图片（每行2～8个图片） 上述示例的源码一行一个图片 example.md:{% gallery %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endgallery %} 一行多个图片（不换行） example.md:{% gallery %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B18FCBB3-67FD-48CC-B4F3-457BA145F17A.jpeg)![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/67239FBB-E15D-4F4F-8EE8-0F1C9F3C4E7C.jpeg)![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/00E0F0ED-9F1C-407A-9AA6-545649D919F4.jpeg){% endgallery %} 多行多个图片（每行2～8个图片） example.md:{% gallery stretch, 4 %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B951AE18-D431-417F-B3FE-A382403FF21B.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/AEB33F9D-7294-4CF1-B8C5-3020748A9D45.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/250662D4-5A21-4AAA-BB63-CD25CF97CFF1.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/10A0FCE5-36A1-4AD0-8CF0-019259A89E03.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B951AE18-D431-417F-B3FE-A382403FF21B.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/AEB33F9D-7294-4CF1-B8C5-3020748A9D45.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/250662D4-5A21-4AAA-BB63-CD25CF97CFF1.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/10A0FCE5-36A1-4AD0-8CF0-019259A89E03.jpeg){% endgallery %} 可以支持的参数对齐方向left, center, right 缩放stretch 列数逗号后面直接写列数，支持 2 ～ 8 列。设定列列数之后就是「多行多图」布局，此时图片默认左对齐。为了避免图片大小不一，建议搭配 stretch 来时图片放大填充。 audio本插件最后更新于 2.4 版本{% audio 音频链接 %} 演示效果Your browser does not support the audio tag. 上述示例的源码example:{% audio https://github.com/volantis-x/volantis-docs/releases/download/assets/Lumia1020.mp3 %} video本插件最后更新于 2.3 版本{% video 视频链接 %} 演示效果100%宽度 Your browser does not support the video tag. 50%宽度 Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. 25%宽度 Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. 上述示例的源码100%宽度 example.md:{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %} 50%宽度 example.md:{% videos, 2 %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% endvideos %} 25%宽度 example.md:{% videos, 4 %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% endvideos %} 可以支持的参数对齐方向left, center, right 列数逗号后面直接写列数，支持 1 ～ 4 列。 frame这是一个能够将图片或者视频套入设备框架中的标签，可以用来更优雅地显示截图、录屏。 本插件最后更新于 4.0 版本{% frame 框架名 | img=图片链接 | alt=图片描述（可选） | part=top/bottom（可选） %}{% frame 框架名 | video=视频链接 | part=top/bottom（可选） %} {% frame iphone11 | img=https://7.dusays.com/2020/09/28/baa33914a34ec.jpg | video=https://7.dusays.com/2020/09/28/39db723f1e200.mp4 | part=top %} 在这个示例中同时出现了 img 和 video 那么它就是一个带有封面的视频，在视频加载完成之前会先显示视频封面。 设备框架目前支持的有： iphone11 如果您有以下其它设备框架图(svg)，欢迎 PR 兼容。 android, ipad, macbook, watch 剪裁通过设置 part=top 或者 part=bottom 来显示上半部分或者下半部分，否则将显示完整的框架及其中的图片/视频。 aplayer主题对 APlayer 插件的样式进行了兼容。安装插件： npm i -S hexo-tag-aplayer 使用方法： hexo-tag-aplayerhttps://github.com/MoePlayer/hexo-tag-aplayer issues最后更新于 4.0 版本{% issues type | api=url | group=key:value1,value2（可选） %} 类型根据需求不同，会将 issues 内容解析成不同的 HTML 标签，目前支持的类型有： timeline: 解析成 timeline 标签，issue 的标题对应 timeline 的时间， issue 的内容对应 timeline 的内容。 sites: 解析成 sites 标签，需要有 JSON 代码块：{ "title": "", "screenshot": "", "url": "", "avatar": "", "description": "", "keywords": ""} API传可以调得通的 URL ，例如： api=https://gitee.com/api/v5/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=activeapi=https://api.github.com/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=active 分组sites 类型的 issues 默认不分组，如果需要分组，可指定分组依据「key」，和分组白名单「value1」「value2」等，例如： group=version:v4,v3,v2 这个参数的作用就是，筛选出 JSON 中包含 "version": "v4" 或者 "version": "v3" 或者 "version": "v2" 的数据，并分组显示。 示例时间线{% issues timeline | api=https://gitee.com/api/v5/repos/xaoxuu/timeline/issues?state=open&creator=xaoxuu&sort=created&direction=desc&page=1&per_page=100 %} 显示效果： 对应的仓库链接： Gitee: xaoxuu/timelinehttps://gitee.com/xaoxuu/timeline/issues 友链{% issues sites | api=https://gitee.com/api/v5/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=active %}{% issues sites | api=https://api.github.com/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=active %} 上例中的 labels=active 参数可以控制默认的 issue 不显示，只有自己审核通过添加了 active 标签之后才会显示。上述示例对应的仓库链接： GitHub: xaoxuu/friendshttps://github.com/xaoxuu/friends/issues 分组这是主题官网的「示例博客」页面的数据： {% issues sites | api=https://api.github.com/repos/volantis-x/examples/issues?sort=updated&state=open&page=1&per_page=100 | group=version:版本：^4.0,版本：^3.0,版本：^2.0 %} 上述示例对应的仓库链接： GitHub: volantis-x/exampleshttps://github.com/volantis-x/examples/issues Hexo 通用标签在文章中使用 <!-- more -->，那么 <!-- more --> 之前的文字将会被视为摘要。首页中将只出现这部分文字，同时这部分文字也会出现在正文之中。详见 Hexo 官方文档： Hexo 官方文档 #标签插件https://hexo.io/zh-cn/docs/tag-plugins"},{"title":"标签插件","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v5/tag-plugins/index.html","permalink":"https://volantis.js.org/v5/tag-plugins/","excerpt":"","text":"为了兼容老用户，旧的标签插件在重构之前依然沿用旧的格式，即 command + 空格 作为参数分隔符，而部分新增标签插件是 空格 + 英文竖线 + 空格 ，请注意区分。 我们也在探索哪种分隔符既简单又不容易引起冲突，所以可能存在多种格式，具体以对应文档描述为准。 text效果源码带 下划线 的文本；带 着重号 的文本；带 波浪线 的文本；带 删除线 的文本 键盘样式的文本：⌘ + D 密码样式的文本：这里没有验证码带 {% u 下划线 %} 的文本；带 {% emp 着重号 %} 的文本；带 {% wavy 波浪线 %} 的文本；带 {% del 删除线 %} 的文本键盘样式的文本：{% kbd ⌘ %} + {% kbd D %}密码样式的文本：{% psw 这里没有验证码 %} span语法效果源码参数本插件最后更新于 2.5 版本{% span 样式参数, 文本内容 %}各种颜色的标签，包括：红色、黄色、绿色、青色、蓝色、灰色。 超大号文字： Volantis A Wonderful Theme for Hexo各种颜色的标签，包括：{% span red, 红色 %}、{% span yellow, 黄色 %}、{% span green, 绿色 %}、{% span cyan, 青色 %}、{% span blue, 蓝色 %}、{% span gray, 灰色 %}。超大号文字：{% span center logo large, Volantis %} {% span center small, A Wonderful Theme for Hexo %} 属性 可选值 字体 logo, code 颜色 red, yellow, green, cyan, blue, gray 大小 small, h4, h3, h2, h1, large, huge, ultra 对齐方向 left, center, right p参数效果源码参数本插件最后更新于 2.5 版本{% p 样式参数, 文本内容 %}红色 黄色 绿色 青色 蓝色 灰色 Volantis A Wonderful Theme for Hexo{% p red, 红色 %}{% p yellow, 黄色 %}{% p green, 绿色 %}{% p cyan, 青色 %}{% p blue, 蓝色 %}{% p gray, 灰色 %}{% p center logo large, Volantis %}{% p center small, A Wonderful Theme for Hexo %} 属性 可选值 字体 logo, code 颜色 red, yellow, green, cyan, blue, gray 大小 small, h4, h3, h2, h1, large, huge, ultra 对齐方向 left, center, right noteNoteBlock 是 Blockquote 的增强版，在左边显示图标，并且可以自定颜色。而 Note 是 NoteBlock 的简便写法。 最后更新于 2.3 版本{% note 样式参数, 文本内容 %} 演示效果经典用法可以在配置文件中设置默认样式，为简单的一句话提供最的简便写法。 note quote 适合引用一段话 note info 默认主题色，适合中性的信息 note warning 默认黄色，适合警告性的信息 note error/danger 默认红色，适合危险性的信息 note done/success 默认绿色，适合正确操作的信息 更多图标这些都是默认样式，可以手动加上颜色： note radiation 默认样式 note radiation yellow 可以加上颜色 note bug red 说明还存在的一些故障 note link green 可以放置一些链接 note paperclip blue 放置一些附件链接 note todo 待办事项 note guide clear 可以加上一段向导 note download 可以放置下载链接 note message gray 一段消息 note up 可以说明如何进行更新 note undo light 可以说明如何撤销或者回退 上述示例的源码example:#### 经典用法{% note, 可以在配置文件中设置默认样式，为简单的一句话提供最的简便写法。 %}{% note quote, note quote 适合引用一段话 %}{% note info, note info 默认主题色，适合中性的信息 %}{% note warning, note warning 默认黄色，适合警告性的信息 %}{% note danger, note error/danger 默认红色，适合危险性的信息 %}{% note success, note done/success 默认绿色，适合正确操作的信息 %}#### 更多图标这些都是默认样式，可以手动加上颜色：{% note radiation, note radiation 默认样式 %}{% note radiation yellow, note radiation yellow 可以加上颜色 %}{% note bug red, note bug red 说明还存在的一些故障 %}{% note link green, note link green 可以放置一些链接 %}{% note paperclip blue, note paperclip blue 放置一些附件链接 %}{% note todo, note todo 待办事项 %}{% note guide clear, note guide clear 可以加上一段向导 %}{% note download, note download 可以放置下载链接 %}{% note message gray, note message gray 一段消息 %}{% note up, note up 可以说明如何进行更新 %}{% note undo light, note undo light 可以说明如何撤销或者回退 %} 可以支持的参数样式参数位置可以写图标和颜色，多个样式参数用空格隔开。 图标彩色的quote, info, warning, done/success, error/danger 灰色的，也可以指定颜色radiation, bug, idea, link, paperclip, todo, message, guide, download, up, undo 颜色指定颜色clear, light, gray, red, yellow, green, cyan, blue noteblockNoteBlock 是 Blockquote 的增强版，在左边显示图标，并且可以自定颜色。而 Note 是 NoteBlock 的简便写法。 最后更新于 4.0 版本{% noteblock 样式参数（可选）, 标题（可选） %}文本段落{% endnoteblock %} 演示效果可以在区块中放置一些复杂的结构，支持嵌套。 标题（可选）Windows 10不是為所有人設計,而是為每個人設計嵌套测试： 请坐和放宽，我正在帮你搞定一切... Folding 测试： 点击查看更多 不要说我们没有警告过你我们都有不顺利的时候 上述示例的源码example:{% noteblock, 标题（可选） %}Windows 10不是為所有人設計,而是為每個人設計{% noteblock done %}嵌套测试： 请坐和放宽，我正在帮你搞定一切...{% endnoteblock %}{% folding yellow, Folding 测试： 点击查看更多 %}{% note warning, 不要说我们没有警告过你 %}{% noteblock bug red %}我们都有不顺利的时候{% endnoteblock %}{% endfolding %}{% endnoteblock %} 可以支持的参数样式参数位置可以写图标和颜色，多个样式参数用空格隔开。 图标彩色的quote, info, warning, done/success, error/danger 灰色的，也可以指定颜色radiation, bug, idea, link, paperclip, todo, message, guide, download, up, undo 颜色指定颜色clear, light, gray, red, yellow, green, cyan, blue checkbox最后更新于 2.6 版本{% checkbox 样式参数（可选）, 文本（支持简单md） %} 演示效果 纯文本测试 支持简单的 markdown 语法 支持自定义颜色 绿色 + 默认选中 黄色 + 默认选中 青色 + 默认选中 蓝色 + 默认选中 增加 减少 叉 上述示例的源码example:{% checkbox 纯文本测试 %}{% checkbox checked, 支持简单的 [markdown](https://guides.github.com/features/mastering-markdown/) 语法 %}{% checkbox red, 支持自定义颜色 %}{% checkbox green checked, 绿色 + 默认选中 %}{% checkbox yellow checked, 黄色 + 默认选中 %}{% checkbox cyan checked, 青色 + 默认选中 %}{% checkbox blue checked, 蓝色 + 默认选中 %}{% checkbox plus green checked, 增加 %}{% checkbox minus yellow checked, 减少 %}{% checkbox times red checked, 叉 %} 可以支持的参数颜色red, yellow, green, cyan, blue 样式plus, minus, times 选中状态checked radio最后更新于 2.6 版本{% checkbox 样式参数（可选）, 文本（支持简单md） %} 演示效果 纯文本测试 支持简单的 markdown 语法 支持自定义颜色 绿色 黄色 青色 蓝色 上述示例的源码example:{% radio 纯文本测试 %}{% radio checked, 支持简单的 [markdown](https://guides.github.com/features/mastering-markdown/) 语法 %}{% radio red, 支持自定义颜色 %}{% radio green, 绿色 %}{% radio yellow, 黄色 %}{% radio cyan, 青色 %}{% radio blue, 蓝色 %} 可以支持的参数颜色red, yellow, green, cyan, blue 选中状态checked timeline最后更新于 3.0 版本{% timeline 时间线标题（可选） %}{% timenode 时间节点（标题） %}正文内容{% endtimenode %}{% timenode 时间节点（标题） %}正文内容{% endtimenode %}{% endtimeline %} 演示效果 2020-07-24 2.6.6 -> 3.0 如果有 hexo-lazyload-image 插件，需要删除并重新安装最新版本，设置 lazyload.isSPA: true。2.x 版本的 css 和 js 不适用于 3.x 版本，如果使用了 use_cdn: true 则需要删除。2.x 版本的 fancybox 标签在 3.x 版本中被重命名为 gallery 。2.x 版本的置顶 top: true 改为了 pin: true，并且同样适用于 layout: page 的页面。如果使用了 hexo-offline 插件，建议卸载，3.0 版本默认开启了 pjax 服务。 2020-05-15 2.6.3 -> 2.6.6 不需要额外处理。 2020-04-20 2.6.2 -> 2.6.3 全局搜索 seotitle 并替换为 seo_title。group 组件的索引规则有变，使用 group 组件的文章内，group: group_name 对应的组件名必须是 group_name。group 组件的列表名优先显示文章的 short_title 其次是 title。 上述示例的源码example:{% timeline %}{% timenode 2020-07-24 [2.6.6 -> 3.0](https://github.com/volantis-x/hexo-theme-volantis/releases) %}1. 如果有 `hexo-lazyload-image` 插件，需要删除并重新安装最新版本，设置 `lazyload.isSPA: true`。2. 2.x 版本的 css 和 js 不适用于 3.x 版本，如果使用了 `use_cdn: true` 则需要删除。3. 2.x 版本的 fancybox 标签在 3.x 版本中被重命名为 gallery 。4. 2.x 版本的置顶 `top: true` 改为了 `pin: true`，并且同样适用于 `layout: page` 的页面。5. 如果使用了 `hexo-offline` 插件，建议卸载，3.0 版本默认开启了 pjax 服务。{% endtimenode %}{% timenode 2020-05-15 [2.6.3 -> 2.6.6](https://github.com/volantis-x/hexo-theme-volantis/releases/tag/2.6.6) %}不需要额外处理。{% endtimenode %}{% timenode 2020-04-20 [2.6.2 -> 2.6.3](https://github.com/volantis-x/hexo-theme-volantis/releases/tag/2.6.3) %}1. 全局搜索 `seotitle` 并替换为 `seo_title`。2. group 组件的索引规则有变，使用 group 组件的文章内，`group: group_name` 对应的组件名必须是 `group_name`。2. group 组件的列表名优先显示文章的 `short_title` 其次是 `title`。{% endtimenode %}{% endtimeline %} link最后更新于 3.0 版本{% link 标题, 链接, 图片链接（可选） %} 演示效果如何参与项目https://volantis.js.org/contributors/ 上述示例的源码example:{% link 如何参与项目, https://volantis.js.org/contributors/, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets@master/logo/256/safari.png %} button这个页面的标签将会在不久后重构 基础按钮请将您的 Volantis 升级至 2.4 版本以上使用。 语法格式参数列表示例写法示例效果{% btn 样式参数（可选）, 标题, 链接, 图标（可选） %} 可选的参数可以省略，但是前后顺序不能乱。样式参数 regular, large, center 图标 第1个或者第2个参数包含 fa- 的那个被识别为图标。example.md:不设置任何参数的 {% btn 按钮, / %} 适合融入段落中。regular 按钮适合独立于段落之外：{% btn regular, 示例博客, https://xaoxuu.com, fas fa-play-circle %}large 按钮更具有强调作用，建议搭配 center 使用：{% btn center large, 开始使用, https://volantis.js.org/v3/getting-started/, fas fa-download %}行内按钮 不设置任何参数的 按钮 适合融入段落中。 空心按钮 示例博客 示例博客 示例博客 示例博客 居中： 开始使用 实心按钮 示例博客 示例博客 示例博客 示例博客 居中： 开始使用 富文本按钮请将您的 Volantis 升级至 2.3 版本以上使用。 语法格式参数列表示例写法示例效果{% btns 样式参数 %}{% cell 标题, 链接, 图片或者图标 %}{% cell 标题, 链接, 图片或者图标 %}{% endbtns %}样式参数位置可以写图片样式、布局方式，多个样式参数用空格隔开。 圆角样式 默认为方形 rounded, circle 布局方式 默认为自动宽度，适合视野内只有一两个的情况。 参数 含义 wide 宽一点的按钮 fill 填充布局，自动铺满至少一行，多了会换行。 center 居中，按钮之间是固定间距。 around 居中分散 grid2 等宽最多2列，屏幕变窄会适当减少列数。 grid3 等宽最多3列，屏幕变窄会适当减少列数。 grid4 等宽最多4列，屏幕变窄会适当减少列数。 grid5 等宽最多5列，屏幕变窄会适当减少列数。 增加文字样式 可以在容器内增加 <b>标题</b> 和 <p>描述文字</p>如果需要显示类似「团队成员」之类的一组含有头像的链接： example.md:{% btns circle grid5 %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% endbtns %} 或者含有图标的按钮： example.md:{% btns rounded grid5 %}{% cell 下载源码, /, fas fa-download %}{% cell 查看文档, /, fas fa-book-open %}{% endbtns %} 圆形图标 + 标题 + 描述 + 图片 + 网格5列 + 居中 example.md:{% btns circle center grid5 %}<a href='https://apps.apple.com/cn/app/heart-mate-pro-hrm-utility/id1463348922?ls=1'> <i class='fab fa-apple'></i> <b>心率管家</b> {% p red, 专业版 %} <img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/qrcode/heartmate_pro.png'></a><a href='https://apps.apple.com/cn/app/heart-mate-lite-hrm-utility/id1475747930?ls=1'> <i class='fab fa-apple'></i> <b>心率管家</b> {% p green, 免费版 %} <img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/qrcode/heartmate_lite.png'></a>{% endbtns %}如果需要显示类似「团队成员」之类的一组含有头像的链接： xaoxuu xaoxuu xaoxuu xaoxuu xaoxuu 或者含有图标的按钮： 下载源码 查看文档 圆形图标 + 标题 + 描述 + 图片 + 网格5列 + 居中 心率管家 专业版 心率管家 免费版 ghcard最后更新于 4.0 版本{% ghcard 用户名, 其它参数（可选） %}{% ghcard 用户名/仓库, 其它参数（可选） %} 用户信息卡片 上述示例的源码： example:| {% ghcard xaoxuu %} | {% ghcard xaoxuu, theme=vue %} || -- | -- || {% ghcard xaoxuu, theme=buefy %} | {% ghcard xaoxuu, theme=solarized-light %} || {% ghcard xaoxuu, theme=onedark %} | {% ghcard xaoxuu, theme=solarized-dark %} || {% ghcard xaoxuu, theme=algolia %} | {% ghcard xaoxuu, theme=calm %} | 仓库信息卡片 上述示例的源码： example:| {% ghcard volantis-x/hexo-theme-volantis %} | {% ghcard volantis-x/hexo-theme-volantis, theme=vue %} || -- | -- || {% ghcard volantis-x/hexo-theme-volantis, theme=buefy %} | {% ghcard volantis-x/hexo-theme-volantis, theme=solarized-light %} || {% ghcard volantis-x/hexo-theme-volantis, theme=onedark %} | {% ghcard volantis-x/hexo-theme-volantis, theme=solarized-dark %} || {% ghcard volantis-x/hexo-theme-volantis, theme=algolia %} | {% ghcard volantis-x/hexo-theme-volantis, theme=calm %} | 更多参数选择GitHub 卡片 API 参数https://github-readme-stats.vercel.app site网站卡片可以显示网站截图、logo、标题、描述，使用方法和友链标签一模一样，唯一的区别是数据文件名称为 sites.yml，可以和友链数据混用，通过分组过滤实现不一样的效果。 示例写法{% sites only:community_team %} sites only:community_team MHuiG划水Colsrch开发者inkss摸鱼W4J1e打杂 dropmenu这个页面的标签将会在不久后重构 下拉菜单请将您的 Volantis 升级至 3.0 版本以上使用。 语法格式示例写法示例效果容器 {% menu 前缀（可省略）, 标题, 后缀（可省略） %}菜单内容{% endmenu %} 菜单内容 菜单项 {% menuitem 文本, 链接, 图标 %} 分割线 {% menuitem hr %} 子菜单 {% submenu 嵌套菜单, 图标 %}菜单内容{% endsubmenu %}示例1 {% menu 下拉菜单 %}{% menuitem 主题源码, https://github.com/volantis-x/hexo-theme-volantis/, fas fa-file-code %}{% menuitem 更新日志, https://github.com/volantis-x/hexo-theme-volantis/releases/, fas fa-clipboard-list %}{% menuitem hr %}{% submenu 有疑问？, fas fa-question-circle %}{% menuitem 看 FAQ, /faqs/ %}{% menuitem 看 本站源码, https://github.com/volantis-x/volantis-docs/ %}{% menuitem 提 Issue, https://github.com/volantis-x/hexo-theme-volantis/issues/ %}{% endsubmenu %}{% endmenu %} 示例2 {% menu 这个是, 下拉菜单 %}（同上）{% endmenu %} 示例3 {% menu 这个是, 下拉菜单, 的示例效果。 %}（同上）{% endmenu %}示例1 下拉菜单 主题源码 更新日志 有疑问？ 看 FAQ 看 本站源码 提 Issue 示例2 这个是 下拉菜单 主题源码 更新日志 有疑问？ 看 FAQ 看 本站源码 提 Issue 示例3 这个是 下拉菜单 主题源码 更新日志 有疑问？ 看 FAQ 看 本站源码 提 Issue 的示例效果。 tab此插件移植自 NexT #tabs 最后更新于 2.1 版本{% tabs 页面内不重复的ID %}<!-- tab 栏目1 -->内容<!-- endtab --><!-- tab 栏目2 -->内容<!-- endtab -->{% endtabs %} 演示效果栏目1栏目2。。。！！！ 上述示例的源码example:{% tabs tab-id %}<!-- tab 栏目1 -->。。。<!-- endtab --><!-- tab 栏目2 -->！！！<!-- endtab -->{% endtabs %} folding最后更新于 2.3 版本{% folding 参数（可选）, 标题 %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endfolding %} 演示效果 查看图片测试 查看默认打开的折叠框 这是一个默认打开的折叠框。 查看代码测试 {% folding green, 查看代码测试 %}查看代码测试{% endfolding %} 查看列表测试 hahahehe 查看嵌套测试 查看嵌套测试2 查看嵌套测试3 hahaha 上述示例的源码example:{% folding 查看图片测试 %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endfolding %}{% folding cyan open, 查看默认打开的折叠框 %}这是一个默认打开的折叠框。{% endfolding %}{% folding green, 查看代码测试 %}{% endfolding %}{% folding yellow, 查看列表测试 %}- haha- hehe{% endfolding %}{% folding red, 查看嵌套测试 %}{% folding blue, 查看嵌套测试2 %}{% folding 查看嵌套测试3 %}hahaha <span><img src='https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/tieba/%E6%BB%91%E7%A8%BD.png' style='height:24px'></span>{% endfolding %}{% endfolding %}{% endfolding %} 可以支持的参数参数位置可以填写颜色和状态，多个参数用空格隔开。 颜色blue, cyan, green, yellow, red 状态状态填写 open 代表默认打开。 inlineimageInlineimage 标签是一种行内图片标签，可以用来在一段话中间插入表情。 本插件最后更新于 4.0 版本{% inlineimage 图片链接, height=高度（可选） %} 演示效果这是 一段话。 这又是 一段话。 上述示例的源码example:这是 {% inlineimage https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/aru-l/0000.gif %} 一段话。这又是 {% inlineimage https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/aru-l/5150.gif, height=40px %} 一段话。 可以支持的参数高度height=20px imageImage 标签是一种针对单个图片应用场景的标签，支持图片描述文字和指定宽度。 本插件最后更新于 4.0 版本{% image 链接, width=宽度（可选）, height=高度（可选）, alt=描述（可选）, bg=占位颜色（可选） %} 演示效果添加描述： 每天下课回宿舍的路，没有什么故事。 指定宽度： 指定宽度并添加描述： 每天下课回宿舍的路，没有什么故事。 设置占位背景色： 优化不同宽度浏览的观感 上述示例的源码example:添加描述：{% image https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg, alt=每天下课回宿舍的路，没有什么故事。 %}指定宽度：{% image https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg, width=400px %}指定宽度并添加描述：{% image https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg, width=400px, alt=每天下课回宿舍的路，没有什么故事。 %}设置占位背景色：{% image https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg, width=400px, bg=#1D0C04, alt=优化不同宽度浏览的观感 %} 可以支持的参数图片宽高度example:width=300px, height=32px 图片描述example:alt=图片描述 占位背景色example:bg=#f2f2f2 galleryGallery 标签是一种针对一组图片应用场景的标签。 本插件最后更新于 5.0 版本{% gallery 参数, 列数, 分组 %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B18FCBB3-67FD-48CC-B4F3-457BA145F17A.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/67239FBB-E15D-4F4F-8EE8-0F1C9F3C4E7C.jpeg){% endgallery %} 演示效果一行一个图片 图片描述 一行多个图片（不换行） 图片描述 图片描述 图片描述 多行多个图片（每行2～8个图片） 上述示例的源码一行一个图片 example.md:{% gallery %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endgallery %} 一行多个图片（不换行） example.md:{% gallery , , one %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B18FCBB3-67FD-48CC-B4F3-457BA145F17A.jpeg)![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/67239FBB-E15D-4F4F-8EE8-0F1C9F3C4E7C.jpeg)![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/00E0F0ED-9F1C-407A-9AA6-545649D919F4.jpeg){% endgallery %} 多行多个图片（每行2～8个图片） example.md:{% gallery stretch, 6, two %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/001.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/002.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/003.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/004.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/005.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/006.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/007.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/008.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/009.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/010.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/011.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/012.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/013.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/014.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/015.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/016.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/017.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/018.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/019.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/020.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/021.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/022.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/023.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/024.jpg){% endgallery %} 可以支持的参数对齐方向left, center, right 缩放stretch 列数逗号后面直接写列数，支持 2 ～ 8 列。设定列列数之后就是「多行多图」布局，此时图片默认左对齐。为了避免图片大小不一，建议搭配 stretch 来时图片放大填充。 分组相同内容的会被归档在一个分组中。 audio本插件最后更新于 2.4 版本{% audio 音频链接 %} 演示效果Your browser does not support the audio tag. 上述示例的源码example:{% audio https://github.com/volantis-x/volantis-docs/releases/download/assets/Lumia1020.mp3 %} video本插件最后更新于 2.3 版本{% video 视频链接 %} 演示效果100%宽度 Your browser does not support the video tag. 50%宽度 Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. 25%宽度 Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. 上述示例的源码100%宽度 example.md:{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %} 50%宽度 example.md:{% videos, 2 %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% endvideos %} 25%宽度 example.md:{% videos, 4 %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% endvideos %} 可以支持的参数对齐方向left, center, right 列数逗号后面直接写列数，支持 1 ～ 4 列。 frame这是一个能够将图片或者视频套入设备框架中的标签，可以用来更优雅地显示截图、录屏。 本插件最后更新于 4.0 版本{% frame 框架名 | img=图片链接 | alt=图片描述（可选） | part=top/bottom（可选） %}{% frame 框架名 | video=视频链接 | part=top/bottom（可选） %} {% frame iphone11 | img=https://7.dusays.com/2020/09/28/baa33914a34ec.jpg | video=https://7.dusays.com/2020/09/28/39db723f1e200.mp4 | part=top %} 在这个示例中同时出现了 img 和 video 那么它就是一个带有封面的视频，在视频加载完成之前会先显示视频封面。 设备框架目前支持的有： iphone11 如果您有以下其它设备框架图(svg)，欢迎 PR 兼容。 android, ipad, macbook, watch 剪裁通过设置 part=top 或者 part=bottom 来显示上半部分或者下半部分，否则将显示完整的框架及其中的图片/视频。 aplayer主题对 APlayer 插件的样式进行了兼容。安装插件： npm i -S hexo-tag-aplayer 使用方法： hexo-tag-aplayerhttps://github.com/MoePlayer/hexo-tag-aplayer issues最后更新于 4.0 版本{% issues type | api=url | group=key:value1,value2（可选） %} 类型根据需求不同，会将 issues 内容解析成不同的 HTML 标签，目前支持的类型有： timeline: 解析成 timeline 标签，issue 的标题对应 timeline 的时间， issue 的内容对应 timeline 的内容。 sites: 解析成 sites 标签，需要有 JSON 代码块：{ "title": "", "screenshot": "", "url": "", "avatar": "", "description": "", "keywords": ""} API传可以调得通的 URL ，例如： api=https://gitee.com/api/v5/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=activeapi=https://api.github.com/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=active 分组sites 类型的 issues 默认不分组，如果需要分组，可指定分组依据「key」，和分组白名单「value1」「value2」等，例如： group=version:v4,v3,v2 这个参数的作用就是，筛选出 JSON 中包含 "version": "v4" 或者 "version": "v3" 或者 "version": "v2" 的数据，并分组显示。 示例时间线{% issues timeline | api=https://gitee.com/api/v5/repos/xaoxuu/timeline/issues?state=open&creator=xaoxuu&sort=created&direction=desc&page=1&per_page=100 %} 显示效果： 对应的仓库链接： Gitee: xaoxuu/timelinehttps://gitee.com/xaoxuu/timeline/issues 友链{% issues sites | api=https://gitee.com/api/v5/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=active %}{% issues sites | api=https://api.github.com/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=active %} 上例中的 labels=active 参数可以控制默认的 issue 不显示，只有自己审核通过添加了 active 标签之后才会显示。上述示例对应的仓库链接： GitHub: xaoxuu/friendshttps://github.com/xaoxuu/friends/issues 分组这是主题官网的「示例博客」页面的数据： {% issues sites | api=https://api.github.com/repos/volantis-x/examples/issues?sort=updated&state=open&page=1&per_page=100 | group=version:版本：^4.0,版本：^3.0,版本：^2.0 %} 上述示例对应的仓库链接： GitHub: volantis-x/exampleshttps://github.com/volantis-x/examples/issues Hexo 通用标签在文章中使用 <!-- more -->，那么 <!-- more --> 之前的文字将会被视为摘要。首页中将只出现这部分文字，同时这部分文字也会出现在正文之中。详见 Hexo 官方文档： Hexo 官方文档 #标签插件https://hexo.io/zh-cn/docs/tag-plugins"},{"title":"主题配置","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v4/theme-settings/index.html","permalink":"https://volantis.js.org/v4/theme-settings/","excerpt":"","text":"创建主题配置文件主题目录下的 _config.yml 文件通常负责主题相关配置，我们强烈建议您使用代替的主题配置文件以防止自己的配置丢失。那么如何使用代替主题配置文件呢？ 第 1/2 步：创建配置文件 在博客根目录的 _config.yml 文件旁边新建一个文件： _config.volantis.yml ，这个文件中的配置信息优先级高于主题文件夹中的配置文件。 第 2/2 步：覆盖自定义配置 当您需要修改某项内容时，例如导航栏菜单，那么您需要在主题配置文件中找到相关内容，复制进自己创建的配置文件中：blog/_config.volantis.ymlnavbar: visiable: auto # always, auto logo: # choose [img] or [icon + title] img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/Logo-NavBar@3x.png icon: title: menu: - name: 博客 icon: fas fa-rss url: /小提示使用「npm i hexo-theme-volantis」方式安装的主题，主题配置文件在「blog/node_modules/hexo-theme-volantis/_config.yml」使用传统方式安装的主题，主题配置文件在「blog/themes/volantis/_config.yml」 自定义主题外观最大布局宽度blog/_config.volantis.ymlcustom_css: ... max_width: 1080px # Sum of body width and sidebar width 网页所呈现的内容的最大宽度，即 body 和 sidebar 的宽度之和。 抗锯齿blog/_config.volantis.ymlcustom_css: ... font_smoothing: true # font-smoothing for webkit 自定义光标样式blog/_config.volantis.ymlcustom_css: ... cursor: enable: true text: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/text.png pointer: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/pointer.png default: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/left_ptr.png not-allowed: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/circle.png zoom-out: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/zoom-out.png zoom-in: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/zoom-in.png grab: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/openhand.png 导航栏样式您可以设置导航栏的高度以及视觉特效，视觉特效目前可选的有： shadow：卡片阴影。 floatable：当鼠标移动到容器内时，呈现出浮起来的效果。 blur：背景模糊效果（毛玻璃），当浏览器不支持时显示为不透明。 blog/_config.volantis.ymlcustom_css: ... navbar: height: 64px effect: [shadow, blur] # [shadow, floatable, blur] 滚动条样式blog/_config.volantis.ymlcustom_css: ... scrollbar: size: 4px border: 2px color: '#2196f3' hover: '#ff5722' 侧边栏样式视觉特效参数同上，值得注意的是：卡片的 floatable 效果和 blur 效果相冲突。 blog/_config.volantis.ymlcustom_css: ... sidebar: effect: [shadow] # [shadow, floatable, blur] 正文区域样式视觉特效参数同上，值得注意的是：卡片的 floatable 效果和 blur 效果相冲突。您可以在 language: true 这里设置代码块显示语言名称。text_align 可以设置 h1/h2/h3/h4/p 的文字对齐方向。 blog/_config.volantis.ymlcustom_css: ... body: effect: [shadow] # [shadow, floatable, blur] highlight: language: true # show language of codeblock copy_btn: true text_align: # left, right, justify, center h1: left h2: left h3: left h4: left p: justify note: # style for default note: {% note text %} icon: '\\f054' color: '' 布局间距您可以设置几种标题的布局间距 h2/h3/h4、段落间距 line、区块内部的段落间距 inline。 blog/_config.volantis.ymlcustom_css: ... gap: h2: 48px # Spacing above H2 (only px unit) h3: 32px # Spacing above H3 (only px unit) h4: 16px # Spacing above H4 (only px unit) paragraph: 1rem # Paragraph spacing between paragraphs row: .5rem # Paragraph spacing between other elements 自定义字体您可以自定义正文和代码字体。 blog/_config.volantis.ymlcustom_css: ... fontfamily: logofont: fontfamily: '"Varela Round", "PingFang SC", "Microsoft YaHei", Helvetica, Arial' name: 'Varela Round' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/VarelaRound/VarelaRound-Regular.ttf weight: normal style: normal bodyfont: fontfamily: 'UbuntuMono, "PingFang SC", "Microsoft YaHei", Helvetica, Arial' name: 'UbuntuMono' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/UbuntuMono/UbuntuMono-Regular.ttf weight: normal style: normal codefont: fontfamily: 'Menlo, Monaco' name: 'Monaco' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/Monaco/Monaco.ttf weight: normal style: normal 自定义颜色多彩配色方案 blog/_config.volantis.ymlcolor_scheme: # ------------ # 通用颜色 common: # 主题色 theme: '#44D7B6' # 链接色 link: '#2196f3' # 按钮色 button: '#44D7B6' # 鼠标放到交互元素上时的色 hover: '#ff5722' # 主题色块内部的文字颜色 inner: '#fff' # 选中区域文字的背景颜色 selection: 'alpha(#2196f3, 0.2)' # ------------ # 亮色主题（默认） light: # 网站背景色 site_bg: '#f4f4f4' # 网站背景上的文字 site_inner: '#fff' # 网站页脚文字 site_footer: '#666' # 卡片背景色 card: '#fff' # 卡片上的普通文字 text: '#444' # 区块和代码块背景色 block: '#f6f6f6' # 代码块高亮时的背景色 codeblock: '#FFF7EA' # 行内代码颜色 inlinecode: '#D56D28' # 文章部分 h1: '#444' h2: '#444' h3: '#444' h4: '#444' h5: '#444' h6: '#444' p: '#444' # 列表文字 list: '#666' # 列表 hover 时的文字 list_hl: 'mix($color-theme, #000, 80)' # 辅助性文字 meta: '#888' # ------------ # 暗色主题 dark: # 网站背景色 site_bg: '#222' # 网站背景上的文字 site_inner: '#eee' # 网站页脚文字 site_footer: '#aaa' # 卡片背景色 card: '#444' # 卡片上的普通文字 text: '#eee' # 区块和代码块背景色 block: '#3a3a3a' # 代码块高亮时的背景色 codeblock: '#343a3c' # 行内代码颜色 inlinecode: '#D56D28' # 文章部分 h1: '#eee' h2: '#eee' h3: '#ddd' h4: '#ddd' h5: '#ddd' h6: '#ddd' p: '#bbb' # 列表文字 list: '#aaa' # 列表 hover 时的文字 list_hl: 'mix($color-theme, #fff, 80)' # 辅助性文字 meta: '#888' # 夜间图片亮度 brightness: 70% 自定义右键菜单blog/_config.volantis.yml# 自定义右键菜单rightmenu: enable: true # hr: 分割线, music: 音乐控制器 layout: [home, help, examples, contributors, hr, source_docs, source_theme, hr, print, hr, dark_mode, hr, music] # 可选功能项 print: name: 打印页面 icon: fa fa-print onclick: document.execCommand('print') # 自定义菜单的格式如下 help: name: 常见问题 icon: fa fa-question url: https://volantis.js.org/faqs/ examples: name: 示例博客 icon: fa fa-rss url: https://volantis.js.org/examples/ contributors: name: 加入社区 icon: fa fa-fan fa-spin url: https://volantis.js.org/contributors/ source_docs: name: 本站源码 icon: fa fa-code-branch url: https://github.com/volantis-x/volantis-docs/ source_theme: name: 主题源码 icon: fa fa-code-branch url: https://github.com/volantis-x/hexo-theme-volantis/ dark_mode: name: Dark mode icon: fas fa-moon toggle: darkmode 设置网站导航栏导航栏配置导航栏分为 logo、menu、search 三个区域设置，其中 logo 区域如果设置了图片，则不能显示图标和标题， menu 区域的设置可以写在一个单独的文件中。 blog/_config.volantis.yml# 注意事项：建议规范全站路径 URL 最后带一个 "/" 例如 "about/"navbar: logo: # choose [img] or [icon + title] img: icon: title: menu: # The following can be written in `blog/source/_data/menu.yml` - name: 博客 icon: fas fa-rss url: / - name: 分类 icon: fas fa-folder-open url: categories/ - name: 标签 icon: fas fa-tags url: tags/ - name: 归档 icon: fas fa-archive url: archives/ - name: 友链 icon: fas fa-link url: friends/ - name: 关于 icon: fas fa-info-circle url: about/ search: 搜索 # Search bar placeholder 使用数据文件 建议新建一个文件，专门存放导航栏菜单配置，文件的路径为： blog/source/_data/menu.yml 文件的内容为： blog/source/_data/menu.yml- name: 博客 icon: fas fa-rss url: /... 菜单嵌套导航栏菜单支持嵌套，嵌套的属性名为 rows ，写法示例： blog/source/_data/menu.yml...- name: 更多 icon: fas fa-ellipsis-v rows: - name: 主题源码 url: https://github.com/volantis-x/hexo-theme-volantis/ - name: 更新日志 url: https://github.com/volantis-x/hexo-theme-volantis/releases/ - name: hr - name: 有疑问？ rows: - name: 看 FAQ url: faqs/ - name: 看 本站源码 url: https://github.com/volantis-x/volantis-docs/ - name: 提 Issue url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: hr - name: 公告和测试博文 url: archives/ - name: 示例博客 url: examples/ - name: 特别感谢 url: contributors/ 分割线在子菜单中，新增一个只有 name: hr 的“菜单”就会被渲染成一个分割线。 - name: hr 小标题在子菜单中，新增一个只有 name: 小标题内容（也可以有 icon: 小标题的图标）的“菜单”就会被渲染成一个小标题。 ...- name: 近期 icon: fas fa-clock url: / rows: - name: 热门文章 icon: fas fa-fire - name: ProHUD 开源库的设计思路 url: blog/2019-08-27-prohud/ - name: ValueX：实用的安全对象类型转换库 url: blog/2019-08-29-valuex/ - name: 心率管家 App 的设计与开发 url: blog/2019-07-23-heartmate/ 播放器在子菜单中，新增一个 icon: fas fa-compact-disc 的“菜单”就会被渲染成一个 APlayer 播放器。 - name: 背景音乐 icon: fas fa-compact-disc 设置网站页脚您通过 layout 可以自由布局网站页脚内容 aplayer, social, license, info, copyright。 blog/_config.volantis.ymlsite_footer: # layout of footer: [aplayer, social, license, info, copyright] layout: [aplayer, social, license, info, copyright] social: - icon: fas fa-rss url: atom.xml - icon: fas fa-envelope url: mailto:me@xaoxuu.com - icon: fab fa-github url: https://github.com/xaoxuu - icon: fas fa-headphones-alt url: https://music.163.com/#/user/home?id=63035382 copyright: '[Copyright © 2017-2021 XXX](/)' # You can add your own property here. (Support markdown, for example: br: '<br>') br: '<br>' 其中，aplayer 需要在插件部分设置中启用。您可以新增文字属性，用于展示其它文字信息，例如： blog/_config.volantis.ymlsite_footer: layout: [..., br, hello, ...] ... # You can add your own property here. (Support markdown, for example: br: '<br>') br: '<br>' hello: '[Hello World](/)' 网站与文章封面封面高度blog/_config.volantis.ymlcover: height_scheme: full # full, half ... 目前主题提供两种首页封面高度方案，其它页面均为半屏幕高度。 封面布局方案blog/_config.volantis.ymlcover: ... scheme: dock # search (搜索), dock (坞), featured (精选), focus (焦点) ... 布局方案 适合场景 search 注重搜索 dock 入口选项比较多 featured 选项在4个左右 focus 选项在4个左右 默认显示设置blog/_config.volantis.ymlcover: ... display: home: true archive: false others: false # can be written in front-matter 'cover: true' 由于主页、归档是 hexo 自动生成的，您需要在主题配置文件中设置是否显示封面，而其它页面则可以在 front-matter 中通过设置 cover: true/false 来决定显示封面或者不显示封面。 文章布局配置# 文章布局article: # 文章列表页面的文章卡片布局方案 preview: scheme: landscape # landscape # pin icon for post pin_icon: https://cdn.jsdelivr.net/gh/twitter/twemoji@13.0/assets/svg/1f4cc.svg # auto generate title if not exist auto_title: true # false, true # auto generate excerpt if not exist auto_excerpt: true # false, true # show split line or not line_style: solid # hidden, solid, dashed, dotted # show readmore button readmore: auto # auto, always # 文章详情页面的文章卡片本体布局方案 body: # 文章顶部信息 # 从 meta_library 中取 top_meta: [author, category, date, counter] # ---------------- # 文章页脚组件 footer_widget: # ---------------- # 参考资料、相关资料等 (for layout: post/docs) references: title: 参考资料 icon: fas fa-quote-left # 在 front-matter 中: # references: # - title: 某篇文章 # url: https:// # 即可显示此组件。 # ---------------- # 相关文章，需要安装插件 (for layout: post) # npm i hexo-related-popular-posts related_posts: enable: false title: 相关文章 icon: fas fa-bookmark max_count: 5 # 设为空则不使用文章头图 placeholder_img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/046.jpg # ---------------- # 版权声明组件 (for layout: post/docs) copyright: enable: true permalink: '本文永久链接是：' content: - '博客内容遵循 署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 协议' - permalink # ---------------- # 打赏组件 (for layout: post/docs) donate: enable: false images: - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png # 文章底部信息 # 从 meta_library 中取 bottom_meta: [updated, tags, share] # meta library meta_library: # 默认文章作者（可在 front-matter 中覆盖） author: avatar: name: 请设置文章作者 url: / # 文章创建日期 date: icon: fas fa-calendar-alt title: '发布于：' format: 'll' # 日期格式 http://momentjs.com/docs/ # 文章更新日期 updated: icon: fas fa-edit title: '更新于：' format: 'll' # 日期格式 http://momentjs.com/docs/ # 文章分类 category: icon: fas fa-folder-open # 文章浏览计数 counter: icon: fas fa-eye unit: '次浏览' # 文章评论数量：只支持 valine valinecount: icon: fas fa-comment-dots desc: '' # 条评论 # 文章字数和阅读时长 wordcount: icon_wordcount: fas fa-keyboard icon_duration: fas fa-hourglass-half # 文章标签 tags: icon: fas fa-hashtag # 分享 share: - id: qq img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/qq.png - id: qzone img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/qzone.png - id: weibo img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/weibo.png - id: # qrcode # 当id为qrcode时需要安装插件 npm i hexo-helper-qrcode img: # https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/wechat.png - id: # telegram img: # https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/telegram.png 其中 top_meta 和 bottom_meta 部分的取值自 meta_library 库。 侧边栏配置侧边栏小组件与 meta 库不同的是：除了现有的 widget ，您可以很轻易地创建自己的 widget ，然后放在需要的地方。此外，您还可以将 widget 写在单独的文件中。 查看所有相关配置 blog/_config.volantis.ymlsidebar: # 主页、分类、归档等独立页面 for_page: [blogger, category, tagcloud, qrcode] # layout: docs/post 这类文章页面 for_post: [toc] # 侧边栏组件库 widget_library: # --------------------------------------- # blogger info widget blogger: class: blogger display: [desktop, mobile] # [desktop, mobile] avatar: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/Logo-NavBar@3x.png shape: rectangle # circle, rectangle url: /about/ title: subtitle: jinrishici: true # Poetry Today. You can set a string, and it will be displayed when loading fails. social: true # --------------------------------------- # toc widget (valid only in articles) toc: class: toc display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-list title: 本文目录 list_number: false min_depth: 2 max_depth: 5 # --------------------------------------- # category widget category: class: category display: [desktop] # [desktop, mobile] header: icon: fas fa-folder-open title: 文章分类 url: /blog/categories/ # --------------------------------------- # tagcloud widget tagcloud: class: tagcloud display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-tags title: 热门标签 url: /blog/tags/ min_font: 14 max_font: 24 color: true start_color: '#999' end_color: '#555' # --------------------------------------- # qrcode widget donate: class: qrcode display: [desktop, mobile] # [desktop, mobile] height: 64px # Automatic height if not set images: - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png # --------------------------------------- # webinfo widget webinfo: class: webinfo display: [desktop] header: icon: fas fa-award title: 站点信息 type: article: enable: true text: '文章数目：' unit: '篇' runtime: enable: true data: '2020/01/01' # 填写建站日期 text: '已运行时间：' unit: '天' wordcount: enable: true text: '本站总字数：' # 需要启用 wordcount unit: '字' siteuv: enable: true text: '本站访客数：' # 需要启用 busuanzi unit: '人' sitepv: enable: true text: '本站总访问量：' # 需要启用 busuanzi unit: '次' lastupd: enable: true friendlyShow: true # 更友好的时间显示 text: '最后活动时间：' unit: '日' 每一个小部件都有 class 和 display，前者代表这个小部件是什么，后者代表这个小部件在什么桌面和移动平台中是否显示，如果在移动平台显示，由于屏幕宽度有限，侧边栏的小部件则会被移动到正文区域下方，因此部分侧边栏小部件便失去意义，建议设置为仅桌面端显示。 小部件名: class: 小部件类别 display: [小部件在桌面端是否显示, 小部件在移动设备是否显示] 博主信息部件blog/_config.volantis.ymlblogger: class: blogger display: [desktop] # [desktop, mobile] avatar: https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png title: subtitle: jinrishici: true # Poetry Today. You can set a string, and it will be displayed when loading fails. social: true 其中，今日诗词 jinrishici 如果设置为一个字符串，这个字符串会变成占位文字，加载失败时显示。如果不需要，就请设置为 jinrishici: false。social 的具体内容请在网站页脚部分设置。 文章目录部件blog/_config.volantis.ymltoc: class: toc display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-list title: 本文目录 list_number: false min_depth: 2 max_depth: 5 这个部件只能放置在侧边栏，并且在文章中有效。在移动设备中预览时，手指向上滑动时，导航栏右边会出现 TOC 按钮，点击即可展开 TOC 部件。如果您需要显示章节序号，请设置 list_number。 min_depth 和 max_depth 代表 TOC 支持的标题层级，最大范围是2～6。 文章分类部件blog/_config.volantis.ymlcategory: class: category display: [desktop] # [desktop, mobile] header: icon: fas fa-folder-open title: 文章分类 url: /blog/categories/ 这个部件可以直接显示所有文章分类，如果您希望有一个独立的页面来展示，需要自己创建一个文件，具体操作在「页面」部分文档中。 标签云部件blog/_config.volantis.ymltagcloud: class: tagcloud display: [desktop] # [desktop, mobile] header: icon: fas fa-tags title: 热门标签 url: /blog/tags/ min_font: 14 max_font: 24 color: true start_color: '#999' end_color: '#555' 这个部件可以直接显示所有文章的标签，如果您希望有一个独立的页面来展示，需要自己创建一个文件，具体操作在「页面」部分文档中。 二维码部件blog/_config.volantis.ymldonate: class: qrcode display: [desktop, mobile] # [desktop, mobile] height: 64px # Automatic height if not set images: - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png 您可以放置在文章页脚用于展示打赏图片，也可以放置在侧边栏。 通用文本部件blog/_config.volantis.ymlrepos: class: text display: [desktop] # [desktop, mobile] header: icon: fab fa-github title: 点个赞吧 url: https://github.com/xaoxuu/ content: - '您的赞对我来说很重要，如果您喜欢本主题，希望能够给下面的项目点个赞来支持一下。' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/prohud/logo.png" height="50px">](https://github.com/xaoxuu/ProHUD)' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/valuex/logo.png" height="50px">](https://github.com/xaoxuu/ValueX)' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/inspire/logo.png" height="50px">](https://github.com/xaoxuu/Inspire)' 您可以创建用于展示任何文本内容的文本部件。 通用列表部件blog/_config.volantis.ymlwiki-hexo-theme: class: list display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-chevron-left title: Hexo Themes url: /wiki/ rows: - name: Volantis for Hexo url: /wiki/volantis/ - name: Resume for Hexo url: /wiki/resume/ 您可以创建用于展示任何链接列表的列表部件。列表的 rows 中的每一项支持的属性有： name、url、icon、img、avatar，其中 img 是方形图片的链接，avatar 是圆形图片的链接。 组索引这个部件的布局继承自 list 部件，用于展示文章所属的分组的文章列表。请将您的 Volantis 升级至 2.5 版本以上使用。 blog/_config.volantis.ymlgroup-1: class: group display: [desktop, mobile] # [desktop, mobile] header: icon: fab fa-github title: Git url: /wiki/git/ 在文章的 front-matter 中设置： front-mattergroup: group-1order: 16sidebar: [group-1, toc] 「group-1」卡片将会以列表的形式显示所有设置了 group: group-1 的文章，顺序按照 order 从小到大排列。 通用网格部件blog/_config.volantis.ymlfeedback: class: grid display: [desktop, mobile] header: icon: fas fa-headset title: 联系开发者 url: https://github.com/volantis-x/hexo-theme-volantis fixed: true # 固定宽度 rows: - name: 反馈BUG icon: fas fa-bug url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: 疑问求助 icon: fas fa-question-circle url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: 提个建议 icon: fas fa-lightbulb url: https://github.com/volantis-x/hexo-theme-volantis/issues/ 您可以创建用于展示任何链接列表的网格部件。网格默认根据文字长度自动确定每一个格子的宽度，如果文字长短不一，建议通过设置 fixed: true 来固定宽度，此时文字过长的格子中的文字会换行显示。 通用页面部件blog/_config.volantis.ymltest: class: page display: [desktop, mobile] pid: haha content: excerpt # excerpt, more, content 您可以把整个页面的md内容作为一个小部件渲染显示出来。只需要设置小部件里的 pid 属性和文章的 front-matter 中设置一样的 pid 即可。 content 代表这个部件显示的内容，可选 excerpt，more，content 分别对应文章的摘要、摘要后面的内容、全文。 选择评论系统目前支持的评论系统有： valine, twikoo, waline, minivaline, disqus, disqusjs, gitalk, vssue, livere, isso, hashover blog/_config.volantis.ymlcomments: title: <i class='fas fa-comments'></i> 评论 subtitle: service: valine # valine, twikoo, waline, minivaline, disqus, disqusjs, gitalk, vssue, livere, isso, hashover ValinetwikoowalineMiniValineVssueGitalkDisqusDisqusJSLivereIssoHashover... 一款快速、简洁且高效的无后端评论系统 https://valine.js.org blog/_config.volantis.ymlcomments: ... service: valine ... valine: # js: https://cdn.jsdelivr.net/npm/valine@1.4/dist/Valine.min.js path: # 全局评论地址 目前设置全局评论地址后visitor失效,这是valine的问题 placeholder: 快来评论吧~ # 评论占位提示 # 其他配置项按照yml格式继续填写即可 除了 [el path placeholder emojiCDN emojiMaps] 选项 appId: # your appId appKey: # your appKey ... 可选配置项详见源码 其中，placeholder 支持在 front-matter 中设置。 front-matter---valine: placeholder: 你觉得xxx怎么样呢？--- 也可以通过设置 valine.path 实现多个页面共用一个评论框。 front-matter---valine: path: /--- 一个简洁、安全、免费的静态网站评论系统 | A simple, safe, free comment system. https://twikoo.js.org/ blog/_config.volantis.ymlcomments: ... service: twikoo ... twikoo: js: https://cdn.jsdelivr.net/npm/twikoo@latest # 建议锁定版本 path: # 全局评论地址 # 其他配置项按照yml格式继续填写即可 除了 [el path] 选项 envId: xxxxxxxxxxxxxxx # 腾讯云环境id 一个简洁、安全、免费的静态网站评论系统 | A simple, safe, free comment system. https://waline.js.org/ blog/_config.volantis.ymlcomments: ... service: waline ... # Waline # https://waline.js.org/ waline: js: https://cdn.jsdelivr.net/npm/@waline/client/dist/Waline.min.js path: # 全局评论地址 目前设置全局评论地址后visitor失效,这是waline的问题 placeholder: 快来评论吧~ # 评论占位提示 imageHosting: https://7bu.top/api/upload # 图床api（默认使用去不图床） # 其他配置项按照yml格式继续填写即可 除了 [el path placeholder uploadImage] 选项 serverURL: xxxxxxxxxxxxxxx # Waline 的服务端地址（必填） 测试用地址: https://waline-ruddy.vercel.app ... 可选配置项详见源码 一款快速、简洁且高效的无后端评论系统 https://github.com/MiniValine/MiniValine/ blog/_config.volantis.ymlcomments: ... service: minivaline ... # MiniValine # https://github.com/MiniValine/MiniValine minivaline: js: https://cdn.jsdelivr.net/npm/minivaline@latest path: # 全局评论地址 placeholder: 快来评论吧~ # 全局评论占位提示 # 更多选项 https://minivaline.js.org/docs/cn/#/Options 按照yml格式继续填写即可 （除了 [el path placeholder] 选项） # emoticonUrl 等列表选项 可参考 https://github.com/MiniValine/hexo-next-minivaline # 下面是一个例子： backend: waline serverURL: https://waline.vercel.app Vue 驱动的、基于 Issue 的评论插件 https://vssue.js.org/zh/ blog/_config.volantis.ymlcomments: ... service: vssue ... vssue: owner: repo: clientId: clientSecret: A modern comment component based on Github Issue and Preact. https://gitalk.github.io/ blog/_config.volantis.ymlcomments: ... service: gitalk ... gitalk: clientID: clientSecret: repo: owner: admin: # [] clientID 和 clientSecret 的获取方法可自行搜索教程，这里仅简单描述一下步骤： 点击 GitHub -> Settings https://github.com/settings/profile 点击 Developer settings https://github.com/settings/developers 点击 New OAuth App https://github.com/settings/applications/new 填写信息： Application name 随便填，我的是：xaoxuu.comHomepage URL 和 Authorization callback URL 都写你的网址，我的是：https://xaoxuu.com 可以通过设置 gitalk.id 实现多个页面共用一个评论框。 front-matter---gitalk: id: /wiki/volantis/--- Disqus - The #1 way to build an audience on your website. https://disqus.com/ blog/_config.volantis.ymlcomments: ... service: disqus ... disqus: shortname: Render Disqus comments in Mainland China using Disqus API https://github.com/SukkaW/DisqusJS blog/_config.volantis.ymlcomments: ... service: disqusjs ... # DisqusJS # https://github.com/SukkaW/DisqusJS disqusjs: path: # 全局评论地址 # 配置项按照yml格式继续填写即可 除了 [siteName url identifier] 选项 #shortname: #api: #apikey: #admin: #nesting: Communication makes better world. https://www.livere.com/ blog/_config.volantis.ymlcomments: ... service: livere ... livere: uid: #你的livere的uid 在这里查看你的 uid：https://livere.com/insight/myCode，在【代码管理 -> 一般网站】中找到如下这段代码，其中 data-uid 中的内容就是你的 livere_uid。 <!-- 来必力City版安装代码 --><div id="lv-container" data-id="city" data-uid="你的livere的uid">... A commenting server similar to Disqus. https://posativ.org/isso/ blog/_config.volantis.ymlcomments: ... service: isso ... isso: url: https://example.com/(path/) src: https://example.com/(path/)js/embed.min.js A free and open source PHP comment system designed to allow completely anonymous comments and easy theming. https://www.barkdull.org/software/hashover blog/_config.volantis.ymlcomments: ... service: hashover ... hashover: src: https://example.com/(path/)comments.phpblog/themes/volantis/layout/_third-party/comments/评论系统名称/layout.ejs这里写布局代码 blog/themes/volantis/layout/_third-party/comments/评论系统名称/script.ejs这里要写加载 js 的代码 收录更多评论系统 站内搜索blog/_config.volantis.ymlsearch: enable: true service: hexo # hexo, google, algolia, azure, baidu js: https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@2.6.4/js/search.js google: apiKey: engineId: algolia: applicationID: apiKey: indexName: azure: serviceName: indexName: queryKey: baidu: apiId: 默认配置为 Hexo 搜索，但是需要安装插件才能使用： npm i -S hexo-generator-search hexo-generator-json-content 第三方插件插件库Volantis 为丰富的插件提供了兼容性优化。大部分插件您只需开启和关闭，无需进行设置。 blog/_config.volantis.ymlplugins: ################# required plugins ################ # jquery jquery: https://cdn.jsdelivr.net/npm/jquery@3.5/dist/jquery.min.js # fontawesome fontawesome: https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.14/css/all.min.css ################# optional plugins ################ ######### Plugins to improve loading speed: # 预加载 preload: enable: true service: flying_pages # instant_page, flying_pages instant_page: https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@2/js/instant_page.js flying_pages: https://cdn.jsdelivr.net/gh/gijo-varghese/flying-pages@2.1.2/flying-pages.min.js # 图片懒加载 # https://www.npmjs.com/package/vanilla-lazyload lazyload: enable: true js: https://cdn.jsdelivr.net/npm/vanilla-lazyload@17.1.0/dist/lazyload.min.js onlypost: false loadingImg: # https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@3/img/placeholder/c617bfd2497fcea598e621413e315c368f8d8e.svg blurIn: true # 模糊加载效果 （loadingImg为空时有效） ######### Plugins to optimize the experience: # highlight.js highlightjs: enable: #true # Please set hexo.config.highlight.enable = false !!! js: https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10/build/highlight.min.js css: https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10/build/styles/solarized-light.min.css # more: https://www.jsdelivr.com/package/npm/highlight.js?path=styles # https://scrollrevealjs.org/api/reveal.html scrollreveal: enable: #true js: https://cdn.jsdelivr.net/npm/scrollreveal@4.0.6/dist/scrollreveal.min.js distance: 32px duration: 800 # ms interval: 20 # ms scale: 1 # 0.1~1 # Codeblock Copy Button clipboard: enable: #true js: https://cdn.jsdelivr.net/npm/clipboard@2/dist/clipboard.min.js ######### Plugins for SEO: # npm i hexo-wordcount wordcount: enable: #true ######### Plugins for ... # Button Ripple Effect nodewaves: enable: #true css: https://cdn.jsdelivr.net/npm/node-waves@0.7.6/dist/waves.min.css js: https://cdn.jsdelivr.net/npm/node-waves@0.7.6/dist/waves.min.js # fontawesome animation fontawesome_animation: enable: #true css: https://cdn.jsdelivr.net/gh/l-lin/font-awesome-animation/dist/font-awesome-animation.min.css # Typing Effects comment_typing: enable: #true js: https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@2/js/comment_typing.js # Slide Background backstretch: enable: #true js: https://cdn.jsdelivr.net/npm/jquery-backstretch@2.1.18/jquery.backstretch.min.js position: cover # cover: sticky on the cover. fixed: Fixed as background for the site. shuffle: true # shuffle playlist duration: 10000 # Duration (ms) fade: 1500 # fade duration (ms) (Not more than 1500) images: # For personal use only. At your own risk if used for commercial purposes !!! - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/001.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/002.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/003.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/004.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/005.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/006.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/012.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/016.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/019.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/033.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/034.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/035.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/038.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/039.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/042.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/046.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/051.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/052.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/054.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/056.jpg # APlayer is only available in mainland China. # APlayer config: https://github.com/metowolf/MetingJS aplayer: enable: #true js: aplayer: https://cdn.jsdelivr.net/npm/aplayer@1.10/dist/APlayer.min.js meting: https://cdn.jsdelivr.net/npm/meting@2.0/dist/Meting.min.js # Required server: netease # netease, tencent, kugou, xiami, baidu type: playlist # song, playlist, album, search, artist id: 3175833810 # song id / playlist id / album id / search keyword # Optional fixed: false # enable fixed mode theme: '#1BCDFC' # main color autoplay: false # audio autoplay order: list # player play order, values: 'list', 'random' loop: all # player loop play, values: 'all', 'one', 'none' volume: 0.7 # default volume, notice that player will remember user setting, default volume will not work after user set volume themselves list_max_height: 320px # list max height list_folded: true pjax: enable: true cover: true # 封面是否pjax处理 false：每次切换页面封面都重载，适合封面较少的情况 true：封面经过Pjax处理，适合封面较多的情况 timeout: 5000 # The timeout in milliseconds for the XHR requests. Set to 0 to disable the timeout. cacheBust: false # When set to true, Pjax appends a timestamp to skip the browser cache. animation: false # false, nprogress, circle banUrl: # 被屏蔽的 url 地址将不启用 pjax 跳转，可以在控制台下使用 window.location.pathname 获取 # - '/artitalk/' # artitalk 不支持 pjax # - '/bb/' # bbtalk 不支持 pjax # 从 issues 加载动态数据 # {% issues sites/timeline/friends | api=xxx | group=key:a,b,c %} # 例如： # {% issues sites | api=https://api.github.com/repos/volantis-x/examples/issues?sort=updated&state=open&page=1&per_page=100 | group=version:latest,v6,v5,v4,v3,v2,v1,v0 %} # 暗黑模式 darkmode # 样式：source/css/_plugins/dark.styl # 开关按钮：在 navbar.menu 中添加： # - name: 暗黑模式 # 可自定义 # icon: fas fa-moon # 可自定义 # toggle: darkmode darkmodejs: enable: #true # 旧版 Internet Explorer 淘汰行动 # https://www.microsoft.com/zh-cn/WindowsForBusiness/End-of-IE-support # 本主题不支持Internet Explorer的任何版本!!! killOldVersionsOfIE: enable: true # 禁用JavaScript提示 # 本页面需要浏览器支持（启用）JavaScript # 主题中的某些插件必须启用JavaScript才能正常工作，例如开启scrollreveal如果禁用JavaScript会导致卡片消失 killNoScript: enable: true # Artitalk https://artitalk.js.org # 配置过程请参考：https://artitalk.js.org/doc.html # 使用过旧版本的请修改Leancloud shuoshuo class部分列名：https://artitalk.js.org/release.html # 除appID和appKEY外均为选填项 artitalk: # Set `layout: artitalk` to enable in page # 配置项按照yml格式继续填写即可 appId: ogP8qj3veMh0LFpFWMPOyF0X-MdYXbMMI # your appID appKey: nHXLd3N3Jgh460t2iRQKWAtr # your appKEY # serverURL: #leancloud绑定的安全域名，使用国际版的话不需要填写 # lang: # 语言设置，zh为汉语，en为英语，es为西班牙语。默认为汉语 # pageSize: #每页说说的显示数量 # shuoPla: #在编辑说说的输入框中的占位符 # avatarPla: #自定义头像url的输入框的占位符 # motion: #加载动画的开关，1为开，0为关，默认为开 # bgImg: #说说输入框背景图片url # color1: #说说背景颜色1&按钮颜色1 # color2: #说说背景颜色2&按钮颜色2 # color3: #说说字体颜色 # cssUrl: #自定义css接口 # BBtalk https://bb.js.org bbtalk: js: https://cdn.jsdelivr.net/npm/bbtalk@0.1.5/dist/bbtalk.min.js # BBtalk.js appId: 0KzOX4vC7Jsk6vzUGNeEiUaI-gzGzoHsz # your appID appKey: HwCiWuxfpvKiLm4teCUgTIba # your appKEY serverURLs: https://bbapi.heson10.com # Request Api 域名 # Tidio聊天功能 # https://www.tidio.com/ tidio: enable: #true id: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx 幻灯片背景blog/_config.volantis.ymlplugins: ... backstretch: enable: true js: https://cdn.jsdelivr.net/npm/jquery-backstretch@2.1.18/jquery.backstretch.min.js position: cover # cover: sticky on the cover. fixed: Fixed as background for the site. duration: 20000 # Duration (ms) fade: 1500 # fade duration (ms) (Not more than 1500) images: # For personal use only. At your own risk if used for commercial purposes !!! - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg ... 幻灯片背景图片显示的位置可以选择粘贴在封面上，跟随封面一起滑动，也可以选择固定作为网页背景图片。 highlight.jsblog/_config.volantis.ymlplugins: ... # highlight.js highlightjs: enable: true # Please set hexo.config.highlight.enable = false !!! js: https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10/build/highlight.min.js css: https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10/build/styles/solarized-light.min.css # more: https://www.jsdelivr.com/package/npm/highlight.js?path=styles 如果需要使用 highlight.js 进行语法高亮，请将站点配置文件中的 highlight.enable 设置为 false 否则不会加载插件。您可以在 94 种 语法高亮主题 中挑选喜爱的主题，然后替换上面的 css 链接。 如果您使用 highlight.js 请确保没有使用 hexo 官方的 codeblock 标签，否则会报错。 经测试，使用 highlight.js 的情况下，部分容器内的代码可能仍然会被渲染甚至报错。 APlayer 音乐播放器blog/_config.volantis.ymlplugins: ... # APlayer is only available in mainland China. # APlayer config: https://github.com/metowolf/MetingJS aplayer: enable: true js: aplayer: https://cdn.jsdelivr.net/npm/aplayer@1.10/dist/APlayer.min.js meting: https://cdn.jsdelivr.net/npm/meting@2.0/dist/Meting.min.js # Required server: netease # netease, tencent, kugou, xiami, baidu type: playlist # song, playlist, album, search, artist id: 3175833810 # song id / playlist id / album id / search keyword # Optional fixed: false # enable fixed mode theme: '#1BCDFC' # main color autoplay: false # audio autoplay order: list # player play order, values: 'list', 'random' loop: all # player loop play, values: 'all', 'one', 'none' volume: 0.7 # default volume, notice that player will remember user setting, default volume will not work after user set volume themselves list_max_height: 320px # list max height list_folded: true APlayer播放器只可以在中国大陆地区使用。相关文档： APlayer | MetingJS 暗黑模式blog/_config.volantis.ymlplugins: ... # 样式：source/css/_plugins/dark.styl # 开关按钮：在 navbar.menu 中添加： # - name: 暗黑模式 # 可自定义 # icon: fas fa-moon # 可自定义 # toggle: darkmode darkmodejs: enable: true 结束支持blog/_config.volantis.ymlplugins: ... # 旧版 Internet Explorer 淘汰行动 # https://www.microsoft.com/zh-cn/WindowsForBusiness/End-of-IE-support # 本主题不支持Internet Explorer的任何版本!!! killOldVersionsOfIE: enable: true # 禁用JavaScript提示 # 本页面需要浏览器支持（启用）JavaScript # 主题中的某些插件必须启用JavaScript才能正常工作，例如开启scrollreveal如果禁用JavaScript会导致卡片消失 killNoScript: enable: true Artitalkblog/_config.volantis.ymlplugins: ... # Artitalk https://artitalk.js.org # 配置过程请参考：https://artitalk.js.org/doc.html # 使用过旧版本的请修改Leancloud shuoshuo class部分列名：https://artitalk.js.org/release.html # 除appID和appKEY外均为选填项 artitalk: # Set `layout: artitalk` to enable in page # 配置项按照yml格式继续填写即可 appId: ogP8qj3veMh0LFpFWMPOyF0X-MdYXbMMI # your appID appKey: nHXLd3N3Jgh460t2iRQKWAtr # your appKEY # serverURL: #leancloud绑定的安全域名，使用国际版的话不需要填写 # lang: # 语言设置，zh为汉语，en为英语，es为西班牙语。默认为汉语 # pageSize: #每页说说的显示数量 # shuoPla: #在编辑说说的输入框中的占位符 # avatarPla: #自定义头像url的输入框的占位符 # motion: #加载动画的开关，1为开，0为关，默认为开 # bgImg: #说说输入框背景图片url # color1: #说说背景颜色1&按钮颜色1 # color2: #说说背景颜色2&按钮颜色2 # color3: #说说字体颜色 # cssUrl: #自定义css接口 BBtalkblog/_config.volantis.ymlplugins: ... bbtalk: js: https://cdn.jsdelivr.net/npm/bbtalk@0.1.5/dist/bbtalk.min.js # BBtalk.js appId: 0KzOX4vC7Jsk6vzUGNeEiUaI-gzGzoHsz # your appID appKey: HwCiWuxfpvKiLm4teCUgTIba # your appKEY serverURLs: https://bbapi.heson10.com # Request Api 域名 Tidioblog/_config.volantis.ymlplugins: ... # Tidio聊天功能 # https://www.tidio.com/ tidio: enable: true id: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"},{"title":"主题配置","date":"2021-05-11T15:17:11.739Z","updated":"2021-05-11T15:17:11.739Z","comments":true,"path":"v5/theme-settings/index.html","permalink":"https://volantis.js.org/v5/theme-settings/","excerpt":"","text":"创建主题配置文件主题目录下的 _config.yml 文件通常负责主题相关配置，我们强烈建议您使用代替的主题配置文件以防止自己的配置丢失。那么如何使用代替主题配置文件呢？ 第 1/2 步：创建配置文件 在博客根目录的 _config.yml 文件旁边新建一个文件： _config.volantis.yml ，这个文件中的配置信息优先级高于主题文件夹中的配置文件。 第 2/2 步：覆盖自定义配置 当您需要修改某项内容时，例如导航栏菜单，那么您需要在主题配置文件中找到相关内容，复制进自己创建的配置文件中：blog/_config.volantis.ymlnavbar: visiable: auto # always, auto logo: # choose [img] or [icon + title] img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/Logo-NavBar@3x.png icon: title: menu: - name: 博客 icon: fas fa-rss url: /小提示使用「npm i hexo-theme-volantis」方式安装的主题，主题配置文件在「blog/node_modules/hexo-theme-volantis/_config.yml」使用传统方式安装的主题，主题配置文件在「blog/themes/volantis/_config.yml」 自定义主题外观最大布局宽度blog/_config.volantis.ymlcustom_css: ... max_width: 1080px # Sum of body width and sidebar width 网页所呈现的内容的最大宽度，即 body 和 sidebar 的宽度之和。 抗锯齿blog/_config.volantis.ymlcustom_css: ... font_smoothing: true # font-smoothing for webkit 自定义光标样式blog/_config.volantis.ymlcustom_css: ... cursor: enable: true text: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/text.png pointer: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/pointer.png default: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/left_ptr.png not-allowed: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/circle.png zoom-out: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/zoom-out.png zoom-in: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/zoom-in.png grab: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/openhand.png 导航栏样式您可以设置导航栏的高度以及视觉特效，视觉特效目前可选的有： shadow：卡片阴影。 floatable：当鼠标移动到容器内时，呈现出浮起来的效果。 blur：背景模糊效果（毛玻璃），当浏览器不支持时显示为不透明。 blog/_config.volantis.ymlcustom_css: ... navbar: height: 64px effect: [shadow, blur] # [shadow, floatable, blur] 滚动条样式blog/_config.volantis.ymlcustom_css: ... scrollbar: size: 4px border: 2px color: '#2196f3' hover: '#ff5722' 侧边栏样式视觉特效参数同上，值得注意的是：卡片的 floatable 效果和 blur 效果相冲突。 blog/_config.volantis.ymlcustom_css: ... sidebar: effect: [shadow] # [shadow, floatable, blur] 正文区域样式视觉特效参数同上，值得注意的是：卡片的 floatable 效果和 blur 效果相冲突。您可以在 language: true 这里设置代码块显示语言名称。text_align 可以设置 h1/h2/h3/h4/p 的文字对齐方向。 blog/_config.volantis.ymlcustom_css: ... body: effect: [shadow] # [shadow, floatable, blur] highlight: language: true # show language of codeblock copy_btn: true text_align: # left, right, justify, center h1: left h2: left h3: left h4: left p: justify note: # style for default note: {% note text %} icon: '\\f054' color: '' 布局间距您可以设置几种标题的布局间距 h2/h3/h4、段落间距 line、区块内部的段落间距 inline。 blog/_config.volantis.ymlcustom_css: ... gap: h2: 48px # Spacing above H2 (only px unit) h3: 32px # Spacing above H3 (only px unit) h4: 16px # Spacing above H4 (only px unit) paragraph: 1rem # Paragraph spacing between paragraphs row: .5rem # Paragraph spacing between other elements 自定义字体您可以自定义正文和代码字体。 blog/_config.volantis.ymlcustom_css: ... fontfamily: logofont: fontfamily: '"Varela Round", "PingFang SC", "Microsoft YaHei", Helvetica, Arial' name: 'Varela Round' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/VarelaRound/VarelaRound-Regular.ttf weight: normal style: normal bodyfont: fontfamily: 'UbuntuMono, "PingFang SC", "Microsoft YaHei", Helvetica, Arial' name: 'UbuntuMono' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/UbuntuMono/UbuntuMono-Regular.ttf weight: normal style: normal codefont: fontfamily: 'Menlo, Monaco' name: 'Monaco' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/Monaco/Monaco.ttf weight: normal style: normal 自定义颜色多彩配色方案 blog/_config.volantis.ymlcolor_scheme: # ------------ # 通用颜色 common: # 主题色 theme: '#44D7B6' # 链接色 link: '#2196f3' # 按钮色 button: '#44D7B6' # 鼠标放到交互元素上时的色 hover: '#ff5722' # 主题色块内部的文字颜色 inner: '#fff' # 选中区域文字的背景颜色 selection: 'alpha(#2196f3, 0.2)' # ------------ # 亮色主题（默认） light: # 网站背景色 site_bg: '#f4f4f4' # 网站背景上的文字 site_inner: '#fff' # 网站页脚文字 site_footer: '#666' # 卡片背景色 card: '#fff' # 卡片上的普通文字 text: '#444' # 区块和代码块背景色 block: '#f6f6f6' # 代码块高亮时的背景色 codeblock: '#FFF7EA' # 行内代码颜色 inlinecode: '#D56D28' # 文章部分 h1: '#444' h2: '#444' h3: '#444' h4: '#444' h5: '#444' h6: '#444' p: '#444' # 列表文字 list: '#666' # 列表 hover 时的文字 list_hl: 'mix($color-theme, #000, 80)' # 辅助性文字 meta: '#888' # ------------ # 暗色主题 dark: # 网站背景色 site_bg: '#222' # 网站背景上的文字 site_inner: '#eee' # 网站页脚文字 site_footer: '#aaa' # 卡片背景色 card: '#444' # 卡片上的普通文字 text: '#eee' # 区块和代码块背景色 block: '#3a3a3a' # 代码块高亮时的背景色 codeblock: '#343a3c' # 行内代码颜色 inlinecode: '#D56D28' # 文章部分 h1: '#eee' h2: '#eee' h3: '#ddd' h4: '#ddd' h5: '#ddd' h6: '#ddd' p: '#bbb' # 列表文字 list: '#aaa' # 列表 hover 时的文字 list_hl: 'mix($color-theme, #fff, 80)' # 辅助性文字 meta: '#888' # 夜间图片亮度 brightness: 70% 自定义右键菜单blog/_config.volantis.yml# 自定义右键菜单rightmenu: enable: true # hr: 分割线, music: 音乐控制器 layout: [home, help, examples, contributors, hr, source_docs, source_theme, hr, print, hr, dark_mode, hr, music] # 可选功能项 print: name: 打印页面 icon: fa fa-print onclick: document.execCommand('print') # 自定义菜单的格式如下 help: name: 常见问题 icon: fa fa-question url: https://volantis.js.org/faqs/ examples: name: 示例博客 icon: fa fa-rss url: https://volantis.js.org/examples/ contributors: name: 加入社区 icon: fa fa-fan fa-spin url: https://volantis.js.org/contributors/ source_docs: name: 本站源码 icon: fa fa-code-branch url: https://github.com/volantis-x/volantis-docs/ source_theme: name: 主题源码 icon: fa fa-code-branch url: https://github.com/volantis-x/hexo-theme-volantis/ dark_mode: name: Dark mode icon: fas fa-moon toggle: darkmode 设置网站导航栏导航栏配置导航栏分为 logo、menu、search 三个区域设置，其中 logo 区域如果设置了图片，则不能显示图标和标题， menu 区域的设置可以写在一个单独的文件中。 blog/_config.volantis.yml# 注意事项：建议规范全站路径 URL 最后带一个 "/" 例如 "about/"navbar: logo: # choose [img] or [icon + title] img: icon: title: menu: # The following can be written in `blog/source/_data/menu.yml` - name: 博客 icon: fas fa-rss url: / - name: 分类 icon: fas fa-folder-open url: categories/ - name: 标签 icon: fas fa-tags url: tags/ - name: 归档 icon: fas fa-archive url: archives/ - name: 友链 icon: fas fa-link url: friends/ - name: 关于 icon: fas fa-info-circle url: about/ search: 搜索 # Search bar placeholder 使用数据文件 建议新建一个文件，专门存放导航栏菜单配置，文件的路径为： blog/source/_data/menu.yml 文件的内容为： blog/source/_data/menu.yml- name: 博客 icon: fas fa-rss url: /... 菜单嵌套导航栏菜单支持嵌套，嵌套的属性名为 rows ，写法示例： blog/source/_data/menu.yml...- name: 更多 icon: fas fa-ellipsis-v rows: - name: 主题源码 url: https://github.com/volantis-x/hexo-theme-volantis/ - name: 更新日志 url: https://github.com/volantis-x/hexo-theme-volantis/releases/ - name: hr - name: 有疑问？ rows: - name: 看 FAQ url: faqs/ - name: 看 本站源码 url: https://github.com/volantis-x/volantis-docs/ - name: 提 Issue url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: hr - name: 公告和测试博文 url: archives/ - name: 示例博客 url: examples/ - name: 特别感谢 url: contributors/ 分割线在子菜单中，新增一个只有 name: hr 的“菜单”就会被渲染成一个分割线。 - name: hr 小标题在子菜单中，新增一个只有 name: 小标题内容（也可以有 icon: 小标题的图标）的“菜单”就会被渲染成一个小标题。 ...- name: 近期 icon: fas fa-clock url: / rows: - name: 热门文章 icon: fas fa-fire - name: ProHUD 开源库的设计思路 url: blog/2019-08-27-prohud/ - name: ValueX：实用的安全对象类型转换库 url: blog/2019-08-29-valuex/ - name: 心率管家 App 的设计与开发 url: blog/2019-07-23-heartmate/ 播放器在子菜单中，新增一个 icon: fas fa-compact-disc 的“菜单”就会被渲染成一个 APlayer 播放器。 - name: 背景音乐 icon: fas fa-compact-disc 设置网站页脚您通过 layout 可以自由布局网站页脚内容 aplayer, social, license, info, copyright。 blog/_config.volantis.ymlsite_footer: # layout of footer: [aplayer, social, license, info, copyright] layout: [aplayer, social, license, info, copyright] social: - icon: fas fa-rss url: atom.xml - icon: fas fa-envelope url: mailto:me@xaoxuu.com - icon: fab fa-github url: https://github.com/xaoxuu - icon: fas fa-headphones-alt url: https://music.163.com/#/user/home?id=63035382 copyright: '[Copyright © 2017-2021 XXX](/)' # You can add your own property here. (Support markdown, for example: br: '<br>') br: '<br>' 其中，aplayer 需要在插件部分设置中启用。您可以新增文字属性，用于展示其它文字信息，例如： blog/_config.volantis.ymlsite_footer: layout: [..., br, hello, ...] ... # You can add your own property here. (Support markdown, for example: br: '<br>') br: '<br>' hello: '[Hello World](/)' 网站与文章封面封面高度blog/_config.volantis.ymlcover: height_scheme: full # full, half ... 目前主题提供两种首页封面高度方案，其它页面均为半屏幕高度。 封面布局方案blog/_config.volantis.ymlcover: ... scheme: dock # search (搜索), dock (坞), featured (精选), focus (焦点) ... 布局方案 适合场景 search 注重搜索 dock 入口选项比较多 featured 选项在4个左右 focus 选项在4个左右 默认显示设置blog/_config.volantis.ymlcover: ... display: home: true archive: false others: false # can be written in front-matter 'cover: true' 由于主页、归档是 hexo 自动生成的，您需要在主题配置文件中设置是否显示封面，而其它页面则可以在 front-matter 中通过设置 cover: true/false 来决定显示封面或者不显示封面。 文章布局配置# 文章布局article: # 文章列表页面的文章卡片布局方案 preview: scheme: landscape # landscape # pin icon for post pin_icon: https://cdn.jsdelivr.net/gh/twitter/twemoji@13.0/assets/svg/1f4cc.svg # auto generate title if not exist auto_title: true # false, true # auto generate excerpt if not exist auto_excerpt: true # false, true # show split line or not line_style: solid # hidden, solid, dashed, dotted # show readmore button readmore: auto # auto, always # 文章详情页面的文章卡片本体布局方案 body: # 文章顶部信息 # 从 meta_library 中取 top_meta: [author, category, date, counter] # ---------------- # 文章页脚组件 footer_widget: # ---------------- # 参考资料、相关资料等 (for layout: post/docs) references: title: 参考资料 icon: fas fa-quote-left # 在 front-matter 中: # references: # - title: 某篇文章 # url: https:// # 即可显示此组件。 # ---------------- # 相关文章，需要安装插件 (for layout: post) # npm i hexo-related-popular-posts related_posts: enable: false title: 相关文章 icon: fas fa-bookmark max_count: 5 # 设为空则不使用文章头图 placeholder_img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/046.jpg # ---------------- # 版权声明组件 (for layout: post/docs) copyright: enable: true permalink: '本文永久链接是：' content: - '博客内容遵循 署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 协议' - permalink # ---------------- # 打赏组件 (for layout: post/docs) donate: enable: false images: - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png # 文章底部信息 # 从 meta_library 中取 bottom_meta: [updated, tags, share] # meta library meta_library: # 默认文章作者（可在 front-matter 中覆盖） author: avatar: name: 请设置文章作者 url: / # 文章创建日期 date: icon: fas fa-calendar-alt title: '发布于：' format: 'll' # 日期格式 http://momentjs.com/docs/ # 文章更新日期 updated: icon: fas fa-edit title: '更新于：' format: 'll' # 日期格式 http://momentjs.com/docs/ # 文章分类 category: icon: fas fa-folder-open # 文章浏览计数 counter: icon: fas fa-eye unit: '次浏览' # 文章评论数量：只支持 valine valinecount: icon: fas fa-comment-dots desc: '' # 条评论 # 文章字数和阅读时长 wordcount: icon_wordcount: fas fa-keyboard icon_duration: fas fa-hourglass-half # 文章标签 tags: icon: fas fa-hashtag # 分享 share: - id: qq img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/qq.png - id: qzone img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/qzone.png - id: weibo img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/weibo.png - id: # qrcode # 当id为qrcode时需要安装插件 npm i hexo-helper-qrcode img: # https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/wechat.png - id: # telegram img: # https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/telegram.png 其中 top_meta 和 bottom_meta 部分的取值自 meta_library 库。 侧边栏配置侧边栏小组件与 meta 库不同的是：除了现有的 widget ，您可以很轻易地创建自己的 widget ，然后放在需要的地方。此外，您还可以将 widget 写在单独的文件中。 查看所有相关配置 blog/_config.volantis.ymlsidebar: # 主页、分类、归档等独立页面 for_page: [blogger, category, tagcloud, qrcode] # layout: docs/post 这类文章页面 for_post: [toc] # 侧边栏组件库 widget_library: # --------------------------------------- # blogger info widget blogger: class: blogger display: [desktop, mobile] # [desktop, mobile] avatar: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/Logo-NavBar@3x.png shape: rectangle # circle, rectangle url: /about/ title: subtitle: jinrishici: true # Poetry Today. You can set a string, and it will be displayed when loading fails. social: true # --------------------------------------- # toc widget (valid only in articles) toc: class: toc display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-list title: 本文目录 list_number: false min_depth: 2 max_depth: 5 # --------------------------------------- # category widget category: class: category display: [desktop] # [desktop, mobile] header: icon: fas fa-folder-open title: 文章分类 url: /blog/categories/ # --------------------------------------- # tagcloud widget tagcloud: class: tagcloud display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-tags title: 热门标签 url: /blog/tags/ min_font: 14 max_font: 24 color: true start_color: '#999' end_color: '#555' # --------------------------------------- # qrcode widget donate: class: qrcode display: [desktop, mobile] # [desktop, mobile] height: 64px # Automatic height if not set images: - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png # --------------------------------------- # webinfo widget webinfo: class: webinfo display: [desktop] header: icon: fas fa-award title: 站点信息 type: article: enable: true text: '文章数目：' unit: '篇' runtime: enable: true data: '2020/01/01' # 填写建站日期 text: '已运行时间：' unit: '天' wordcount: enable: true text: '本站总字数：' # 需要启用 wordcount unit: '字' siteuv: enable: true text: '本站访客数：' # 需要启用 busuanzi unit: '人' sitepv: enable: true text: '本站总访问量：' # 需要启用 busuanzi unit: '次' lastupd: enable: true friendlyShow: true # 更友好的时间显示 text: '最后活动时间：' unit: '日' 每一个小部件都有 class 和 display，前者代表这个小部件是什么，后者代表这个小部件在什么桌面和移动平台中是否显示，如果在移动平台显示，由于屏幕宽度有限，侧边栏的小部件则会被移动到正文区域下方，因此部分侧边栏小部件便失去意义，建议设置为仅桌面端显示。 小部件名: class: 小部件类别 display: [小部件在桌面端是否显示, 小部件在移动设备是否显示] 博主信息部件blog/_config.volantis.ymlblogger: class: blogger display: [desktop] # [desktop, mobile] avatar: https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png title: subtitle: jinrishici: true # Poetry Today. You can set a string, and it will be displayed when loading fails. social: true 其中，今日诗词 jinrishici 如果设置为一个字符串，这个字符串会变成占位文字，加载失败时显示。如果不需要，就请设置为 jinrishici: false。social 的具体内容请在网站页脚部分设置。 文章目录部件blog/_config.volantis.ymltoc: class: toc display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-list title: 本文目录 list_number: false min_depth: 2 max_depth: 5 这个部件只能放置在侧边栏，并且在文章中有效。在移动设备中预览时，手指向上滑动时，导航栏右边会出现 TOC 按钮，点击即可展开 TOC 部件。如果您需要显示章节序号，请设置 list_number。 min_depth 和 max_depth 代表 TOC 支持的标题层级，最大范围是2～6。 文章分类部件blog/_config.volantis.ymlcategory: class: category display: [desktop] # [desktop, mobile] header: icon: fas fa-folder-open title: 文章分类 url: /blog/categories/ 这个部件可以直接显示所有文章分类，如果您希望有一个独立的页面来展示，需要自己创建一个文件，具体操作在「页面」部分文档中。 标签云部件blog/_config.volantis.ymltagcloud: class: tagcloud display: [desktop] # [desktop, mobile] header: icon: fas fa-tags title: 热门标签 url: /blog/tags/ min_font: 14 max_font: 24 color: true start_color: '#999' end_color: '#555' 这个部件可以直接显示所有文章的标签，如果您希望有一个独立的页面来展示，需要自己创建一个文件，具体操作在「页面」部分文档中。 二维码部件blog/_config.volantis.ymldonate: class: qrcode display: [desktop, mobile] # [desktop, mobile] height: 64px # Automatic height if not set images: - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png 您可以放置在文章页脚用于展示打赏图片，也可以放置在侧边栏。 通用文本部件blog/_config.volantis.ymlrepos: class: text display: [desktop] # [desktop, mobile] header: icon: fab fa-github title: 点个赞吧 url: https://github.com/xaoxuu/ content: - '您的赞对我来说很重要，如果您喜欢本主题，希望能够给下面的项目点个赞来支持一下。' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/prohud/logo.png" height="50px">](https://github.com/xaoxuu/ProHUD)' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/valuex/logo.png" height="50px">](https://github.com/xaoxuu/ValueX)' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/inspire/logo.png" height="50px">](https://github.com/xaoxuu/Inspire)' 您可以创建用于展示任何文本内容的文本部件。 通用列表部件blog/_config.volantis.ymlwiki-hexo-theme: class: list display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-chevron-left title: Hexo Themes url: /wiki/ rows: - name: Volantis for Hexo url: /wiki/volantis/ - name: Resume for Hexo url: /wiki/resume/ 您可以创建用于展示任何链接列表的列表部件。列表的 rows 中的每一项支持的属性有： name、url、icon、img、avatar，其中 img 是方形图片的链接，avatar 是圆形图片的链接。 组索引这个部件的布局继承自 list 部件，用于展示文章所属的分组的文章列表。请将您的 Volantis 升级至 2.5 版本以上使用。 blog/_config.volantis.ymlgroup-1: class: group display: [desktop, mobile] # [desktop, mobile] header: icon: fab fa-github title: Git url: /wiki/git/ 在文章的 front-matter 中设置： front-mattergroup: group-1order: 16sidebar: [group-1, toc] 「group-1」卡片将会以列表的形式显示所有设置了 group: group-1 的文章，顺序按照 order 从小到大排列。 通用网格部件blog/_config.volantis.ymlfeedback: class: grid display: [desktop, mobile] header: icon: fas fa-headset title: 联系开发者 url: https://github.com/volantis-x/hexo-theme-volantis fixed: true # 固定宽度 rows: - name: 反馈BUG icon: fas fa-bug url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: 疑问求助 icon: fas fa-question-circle url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: 提个建议 icon: fas fa-lightbulb url: https://github.com/volantis-x/hexo-theme-volantis/issues/ 您可以创建用于展示任何链接列表的网格部件。网格默认根据文字长度自动确定每一个格子的宽度，如果文字长短不一，建议通过设置 fixed: true 来固定宽度，此时文字过长的格子中的文字会换行显示。 通用页面部件blog/_config.volantis.ymltest: class: page display: [desktop, mobile] pid: haha content: excerpt # excerpt, more, content 您可以把整个页面的md内容作为一个小部件渲染显示出来。只需要设置小部件里的 pid 属性和文章的 front-matter 中设置一样的 pid 即可。 content 代表这个部件显示的内容，可选 excerpt，more，content 分别对应文章的摘要、摘要后面的内容、全文。 选择评论系统目前支持的评论系统有： valine, twikoo, waline, minivaline, disqus, disqusjs, gitalk, vssue, livere, isso, hashover blog/_config.volantis.ymlcomments: title: <i class='fas fa-comments'></i> 评论 subtitle: service: valine # valine, twikoo, waline, minivaline, disqus, disqusjs, gitalk, vssue, livere, isso, hashover ValinetwikoowalineMiniValineVssueGitalkDisqusDisqusJSLivereIssoHashover... 一款快速、简洁且高效的无后端评论系统 https://valine.js.org blog/_config.volantis.ymlcomments: ... service: valine ... valine: # js: https://cdn.jsdelivr.net/npm/valine@1.4/dist/Valine.min.js path: # 全局评论地址 目前设置全局评论地址后visitor失效,这是valine的问题 placeholder: 快来评论吧~ # 评论占位提示 # 其他配置项按照yml格式继续填写即可 除了 [el path placeholder emojiCDN emojiMaps] 选项 appId: # your appId appKey: # your appKey ... 可选配置项详见源码 其中，placeholder 支持在 front-matter 中设置。 front-matter---valine: placeholder: 你觉得xxx怎么样呢？--- 也可以通过设置 valine.path 实现多个页面共用一个评论框。 front-matter---valine: path: /--- 一个简洁、安全、免费的静态网站评论系统 | A simple, safe, free comment system. https://twikoo.js.org/ blog/_config.volantis.ymlcomments: ... service: twikoo ... twikoo: js: https://cdn.jsdelivr.net/npm/twikoo@latest # 建议锁定版本 path: # 全局评论地址 # 其他配置项按照yml格式继续填写即可 除了 [el path] 选项 envId: xxxxxxxxxxxxxxx # 腾讯云环境id 一个简洁、安全、免费的静态网站评论系统 | A simple, safe, free comment system. https://waline.js.org/ blog/_config.volantis.ymlcomments: ... service: waline ... # Waline # https://waline.js.org/ waline: js: https://cdn.jsdelivr.net/npm/@waline/client/dist/Waline.min.js path: # 全局评论地址 目前设置全局评论地址后visitor失效,这是waline的问题 placeholder: 快来评论吧~ # 评论占位提示 imageHosting: https://7bu.top/api/upload # 图床api（默认使用去不图床） # 其他配置项按照yml格式继续填写即可 除了 [el path placeholder uploadImage] 选项 serverURL: xxxxxxxxxxxxxxx # Waline 的服务端地址（必填） 测试用地址: https://waline-ruddy.vercel.app ... 可选配置项详见源码 一款快速、简洁且高效的无后端评论系统 https://github.com/MiniValine/MiniValine/ blog/_config.volantis.ymlcomments: ... service: minivaline ... # MiniValine # https://github.com/MiniValine/MiniValine minivaline: js: https://cdn.jsdelivr.net/npm/minivaline@latest path: # 全局评论地址 placeholder: 快来评论吧~ # 全局评论占位提示 # 更多选项 https://minivaline.js.org/docs/cn/#/Options 按照yml格式继续填写即可 （除了 [el path placeholder] 选项） # emoticonUrl 等列表选项 可参考 https://github.com/MiniValine/hexo-next-minivaline # 下面是一个例子： backend: waline serverURL: https://waline.vercel.app Vue 驱动的、基于 Issue 的评论插件 https://vssue.js.org/zh/ blog/_config.volantis.ymlcomments: ... service: vssue ... vssue: owner: repo: clientId: clientSecret: A modern comment component based on Github Issue and Preact. https://gitalk.github.io/ blog/_config.volantis.ymlcomments: ... service: gitalk ... gitalk: clientID: clientSecret: repo: owner: admin: # [] clientID 和 clientSecret 的获取方法可自行搜索教程，这里仅简单描述一下步骤： 点击 GitHub -> Settings https://github.com/settings/profile 点击 Developer settings https://github.com/settings/developers 点击 New OAuth App https://github.com/settings/applications/new 填写信息： Application name 随便填，我的是：xaoxuu.comHomepage URL 和 Authorization callback URL 都写你的网址，我的是：https://xaoxuu.com 可以通过设置 gitalk.id 实现多个页面共用一个评论框。 front-matter---gitalk: id: /wiki/volantis/--- Disqus - The #1 way to build an audience on your website. https://disqus.com/ blog/_config.volantis.ymlcomments: ... service: disqus ... disqus: shortname: Render Disqus comments in Mainland China using Disqus API https://github.com/SukkaW/DisqusJS blog/_config.volantis.ymlcomments: ... service: disqusjs ... # DisqusJS # https://github.com/SukkaW/DisqusJS disqusjs: path: # 全局评论地址 # 配置项按照yml格式继续填写即可 除了 [siteName url identifier] 选项 #shortname: #api: #apikey: #admin: #nesting: Communication makes better world. https://www.livere.com/ blog/_config.volantis.ymlcomments: ... service: livere ... livere: uid: #你的livere的uid 在这里查看你的 uid：https://livere.com/insight/myCode，在【代码管理 -> 一般网站】中找到如下这段代码，其中 data-uid 中的内容就是你的 livere_uid。 <!-- 来必力City版安装代码 --><div id="lv-container" data-id="city" data-uid="你的livere的uid">... A commenting server similar to Disqus. https://posativ.org/isso/ blog/_config.volantis.ymlcomments: ... service: isso ... isso: url: https://example.com/(path/) src: https://example.com/(path/)js/embed.min.js A free and open source PHP comment system designed to allow completely anonymous comments and easy theming. https://www.barkdull.org/software/hashover blog/_config.volantis.ymlcomments: ... service: hashover ... hashover: src: https://example.com/(path/)comments.phpblog/themes/volantis/layout/_third-party/comments/评论系统名称/layout.ejs这里写布局代码 blog/themes/volantis/layout/_third-party/comments/评论系统名称/script.ejs这里要写加载 js 的代码 收录更多评论系统 站内搜索blog/_config.volantis.ymlsearch: enable: true service: hexo # hexo, google, algolia, azure, baidu js: https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@2.6.4/js/search.js google: apiKey: engineId: algolia: applicationID: apiKey: indexName: azure: serviceName: indexName: queryKey: baidu: apiId: 默认配置为 Hexo 搜索，但是需要安装插件才能使用： npm i -S hexo-generator-search hexo-generator-json-content 第三方插件插件库Volantis 为丰富的插件提供了兼容性优化。大部分插件您只需开启和关闭，无需进行设置。 blog/_config.volantis.ymlplugins: ################# required plugins ################ # jquery jquery: https://cdn.jsdelivr.net/npm/jquery@3.5/dist/jquery.min.js # fontawesome fontawesome: https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.14/css/all.min.css ################# optional plugins ################ ######### Plugins to improve loading speed: # 预加载 preload: enable: true service: flying_pages # instant_page, flying_pages instant_page: https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@2/js/instant_page.js flying_pages: https://cdn.jsdelivr.net/gh/gijo-varghese/flying-pages@2.1.2/flying-pages.min.js # 图片懒加载 # https://www.npmjs.com/package/vanilla-lazyload lazyload: enable: true js: https://cdn.jsdelivr.net/npm/vanilla-lazyload@17.1.0/dist/lazyload.min.js onlypost: false loadingImg: # https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@3/img/placeholder/c617bfd2497fcea598e621413e315c368f8d8e.svg blurIn: true # 模糊加载效果 （loadingImg为空时有效） ######### Plugins to optimize the experience: # highlight.js highlightjs: enable: #true # Please set hexo.config.highlight.enable = false !!! js: https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10/build/highlight.min.js css: https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10/build/styles/solarized-light.min.css # more: https://www.jsdelivr.com/package/npm/highlight.js?path=styles # https://scrollrevealjs.org/api/reveal.html scrollreveal: enable: #true js: https://cdn.jsdelivr.net/npm/scrollreveal@4.0.6/dist/scrollreveal.min.js distance: 32px duration: 800 # ms interval: 20 # ms scale: 1 # 0.1~1 # Codeblock Copy Button clipboard: enable: #true js: https://cdn.jsdelivr.net/npm/clipboard@2/dist/clipboard.min.js ######### Plugins for SEO: # npm i hexo-wordcount wordcount: enable: #true ######### Plugins for ... # Button Ripple Effect nodewaves: enable: #true css: https://cdn.jsdelivr.net/npm/node-waves@0.7.6/dist/waves.min.css js: https://cdn.jsdelivr.net/npm/node-waves@0.7.6/dist/waves.min.js # fontawesome animation fontawesome_animation: enable: #true css: https://cdn.jsdelivr.net/gh/l-lin/font-awesome-animation/dist/font-awesome-animation.min.css # Typing Effects comment_typing: enable: #true js: https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@2/js/comment_typing.js # Slide Background backstretch: enable: #true js: https://cdn.jsdelivr.net/npm/jquery-backstretch@2.1.18/jquery.backstretch.min.js position: cover # cover: sticky on the cover. fixed: Fixed as background for the site. shuffle: true # shuffle playlist duration: 10000 # Duration (ms) fade: 1500 # fade duration (ms) (Not more than 1500) images: # For personal use only. At your own risk if used for commercial purposes !!! - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/001.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/002.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/003.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/004.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/005.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/006.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/012.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/016.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/019.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/033.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/034.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/035.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/038.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/039.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/042.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/046.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/051.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/052.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/054.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/056.jpg # APlayer is only available in mainland China. # APlayer config: https://github.com/metowolf/MetingJS aplayer: enable: #true js: aplayer: https://cdn.jsdelivr.net/npm/aplayer@1.10/dist/APlayer.min.js meting: https://cdn.jsdelivr.net/npm/meting@2.0/dist/Meting.min.js # Required server: netease # netease, tencent, kugou, xiami, baidu type: playlist # song, playlist, album, search, artist id: 3175833810 # song id / playlist id / album id / search keyword # Optional fixed: false # enable fixed mode theme: '#1BCDFC' # main color autoplay: false # audio autoplay order: list # player play order, values: 'list', 'random' loop: all # player loop play, values: 'all', 'one', 'none' volume: 0.7 # default volume, notice that player will remember user setting, default volume will not work after user set volume themselves list_max_height: 320px # list max height list_folded: true pjax: enable: true cover: true # 封面是否pjax处理 false：每次切换页面封面都重载，适合封面较少的情况 true：封面经过Pjax处理，适合封面较多的情况 timeout: 5000 # The timeout in milliseconds for the XHR requests. Set to 0 to disable the timeout. cacheBust: false # When set to true, Pjax appends a timestamp to skip the browser cache. animation: false # false, nprogress, circle banUrl: # 被屏蔽的 url 地址将不启用 pjax 跳转，可以在控制台下使用 window.location.pathname 获取 # - '/artitalk/' # artitalk 不支持 pjax # - '/bb/' # bbtalk 不支持 pjax # 从 issues 加载动态数据 # {% issues sites/timeline/friends | api=xxx | group=key:a,b,c %} # 例如： # {% issues sites | api=https://api.github.com/repos/volantis-x/examples/issues?sort=updated&state=open&page=1&per_page=100 | group=version:latest,v6,v5,v4,v3,v2,v1,v0 %} # 暗黑模式 darkmode # 样式：source/css/_plugins/dark.styl # 开关按钮：在 navbar.menu 中添加： # - name: 暗黑模式 # 可自定义 # icon: fas fa-moon # 可自定义 # toggle: darkmode darkmodejs: enable: #true # 旧版 Internet Explorer 淘汰行动 # https://www.microsoft.com/zh-cn/WindowsForBusiness/End-of-IE-support # 本主题不支持Internet Explorer的任何版本!!! killOldVersionsOfIE: enable: true # 禁用JavaScript提示 # 本页面需要浏览器支持（启用）JavaScript # 主题中的某些插件必须启用JavaScript才能正常工作，例如开启scrollreveal如果禁用JavaScript会导致卡片消失 killNoScript: enable: true # Artitalk https://artitalk.js.org # 配置过程请参考：https://artitalk.js.org/doc.html # 使用过旧版本的请修改Leancloud shuoshuo class部分列名：https://artitalk.js.org/release.html # 除appID和appKEY外均为选填项 artitalk: # Set `layout: artitalk` to enable in page # 配置项按照yml格式继续填写即可 appId: ogP8qj3veMh0LFpFWMPOyF0X-MdYXbMMI # your appID appKey: nHXLd3N3Jgh460t2iRQKWAtr # your appKEY # serverURL: #leancloud绑定的安全域名，使用国际版的话不需要填写 # lang: # 语言设置，zh为汉语，en为英语，es为西班牙语。默认为汉语 # pageSize: #每页说说的显示数量 # shuoPla: #在编辑说说的输入框中的占位符 # avatarPla: #自定义头像url的输入框的占位符 # motion: #加载动画的开关，1为开，0为关，默认为开 # bgImg: #说说输入框背景图片url # color1: #说说背景颜色1&按钮颜色1 # color2: #说说背景颜色2&按钮颜色2 # color3: #说说字体颜色 # cssUrl: #自定义css接口 # BBtalk https://bb.js.org bbtalk: js: https://cdn.jsdelivr.net/npm/bbtalk@0.1.5/dist/bbtalk.min.js # BBtalk.js appId: 0KzOX4vC7Jsk6vzUGNeEiUaI-gzGzoHsz # your appID appKey: HwCiWuxfpvKiLm4teCUgTIba # your appKEY serverURLs: https://bbapi.heson10.com # Request Api 域名 # Tidio聊天功能 # https://www.tidio.com/ tidio: enable: #true id: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx 幻灯片背景blog/_config.volantis.ymlplugins: ... backstretch: enable: true js: https://cdn.jsdelivr.net/npm/jquery-backstretch@2.1.18/jquery.backstretch.min.js position: cover # cover: sticky on the cover. fixed: Fixed as background for the site. duration: 20000 # Duration (ms) fade: 1500 # fade duration (ms) (Not more than 1500) images: # For personal use only. At your own risk if used for commercial purposes !!! - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg ... 幻灯片背景图片显示的位置可以选择粘贴在封面上，跟随封面一起滑动，也可以选择固定作为网页背景图片。 highlight.jsblog/_config.volantis.ymlplugins: ... # highlight.js highlightjs: enable: true # Please set hexo.config.highlight.enable = false !!! js: https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10/build/highlight.min.js css: https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10/build/styles/solarized-light.min.css # more: https://www.jsdelivr.com/package/npm/highlight.js?path=styles 如果需要使用 highlight.js 进行语法高亮，请将站点配置文件中的 highlight.enable 设置为 false 否则不会加载插件。您可以在 94 种 语法高亮主题 中挑选喜爱的主题，然后替换上面的 css 链接。 如果您使用 highlight.js 请确保没有使用 hexo 官方的 codeblock 标签，否则会报错。 经测试，使用 highlight.js 的情况下，部分容器内的代码可能仍然会被渲染甚至报错。 APlayer 音乐播放器blog/_config.volantis.ymlplugins: ... # APlayer is only available in mainland China. # APlayer config: https://github.com/metowolf/MetingJS aplayer: enable: true js: aplayer: https://cdn.jsdelivr.net/npm/aplayer@1.10/dist/APlayer.min.js meting: https://cdn.jsdelivr.net/npm/meting@2.0/dist/Meting.min.js # Required server: netease # netease, tencent, kugou, xiami, baidu type: playlist # song, playlist, album, search, artist id: 3175833810 # song id / playlist id / album id / search keyword # Optional fixed: false # enable fixed mode theme: '#1BCDFC' # main color autoplay: false # audio autoplay order: list # player play order, values: 'list', 'random' loop: all # player loop play, values: 'all', 'one', 'none' volume: 0.7 # default volume, notice that player will remember user setting, default volume will not work after user set volume themselves list_max_height: 320px # list max height list_folded: true APlayer播放器只可以在中国大陆地区使用。相关文档： APlayer | MetingJS 暗黑模式blog/_config.volantis.ymlplugins: ... # 样式：source/css/_plugins/dark.styl # 开关按钮：在 navbar.menu 中添加： # - name: 暗黑模式 # 可自定义 # icon: fas fa-moon # 可自定义 # toggle: darkmode darkmodejs: enable: true 结束支持blog/_config.volantis.ymlplugins: ... # 旧版 Internet Explorer 淘汰行动 # https://www.microsoft.com/zh-cn/WindowsForBusiness/End-of-IE-support # 本主题不支持Internet Explorer的任何版本!!! killOldVersionsOfIE: enable: true # 禁用JavaScript提示 # 本页面需要浏览器支持（启用）JavaScript # 主题中的某些插件必须启用JavaScript才能正常工作，例如开启scrollreveal如果禁用JavaScript会导致卡片消失 killNoScript: enable: true Artitalkblog/_config.volantis.ymlplugins: ... # Artitalk https://artitalk.js.org # 配置过程请参考：https://artitalk.js.org/doc.html # 使用过旧版本的请修改Leancloud shuoshuo class部分列名：https://artitalk.js.org/release.html # 除appID和appKEY外均为选填项 artitalk: # Set `layout: artitalk` to enable in page # 配置项按照yml格式继续填写即可 appId: ogP8qj3veMh0LFpFWMPOyF0X-MdYXbMMI # your appID appKey: nHXLd3N3Jgh460t2iRQKWAtr # your appKEY # serverURL: #leancloud绑定的安全域名，使用国际版的话不需要填写 # lang: # 语言设置，zh为汉语，en为英语，es为西班牙语。默认为汉语 # pageSize: #每页说说的显示数量 # shuoPla: #在编辑说说的输入框中的占位符 # avatarPla: #自定义头像url的输入框的占位符 # motion: #加载动画的开关，1为开，0为关，默认为开 # bgImg: #说说输入框背景图片url # color1: #说说背景颜色1&按钮颜色1 # color2: #说说背景颜色2&按钮颜色2 # color3: #说说字体颜色 # cssUrl: #自定义css接口 BBtalkblog/_config.volantis.ymlplugins: ... bbtalk: js: https://cdn.jsdelivr.net/npm/bbtalk@0.1.5/dist/bbtalk.min.js # BBtalk.js appId: 0KzOX4vC7Jsk6vzUGNeEiUaI-gzGzoHsz # your appID appKey: HwCiWuxfpvKiLm4teCUgTIba # your appKEY serverURLs: https://bbapi.heson10.com # Request Api 域名 Tidioblog/_config.volantis.ymlplugins: ... # Tidio聊天功能 # https://www.tidio.com/ tidio: enable: true id: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"}],"posts":[{"title":"使用 pandoc 正确渲染多行 MathJax 公式","slug":"blogs/2021-4-18-pandoc-renderer","date":"2021-04-18T00:00:00.000Z","updated":"2021-04-18T00:00:00.000Z","comments":true,"path":"blogs/2021-4-18-pandoc-renderer/","link":"https://shiraha.cn/2021/use-pandoc-to-render-multiline-formulas-correctly/","permalink":"https://volantis.js.org/blogs/2021-4-18-pandoc-renderer/","excerpt":"","text":"","categories":[{"name":"开发心得","slug":"开发心得","permalink":"https://volantis.js.org/categories/%E5%BC%80%E5%8F%91%E5%BF%83%E5%BE%97/"}],"tags":[],"author":"Nanami"},{"title":"为volantis添加瀑布流相册","slug":"blogs/2021-4-14-photos","date":"2021-04-14T00:00:00.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"blogs/2021-4-14-photos/","link":"https://goopher.tk/posts/7.html","permalink":"https://volantis.js.org/blogs/2021-4-14-photos/","excerpt":"经过折腾，目前相册功能可用了，就是还不支持分类和懒加载，等后续完善吧。","text":"经过折腾，目前相册功能可用了，就是还不支持分类和懒加载，等后续完善吧。","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"GOOPHER"},{"title":"为volantis添加hls.js以在Chrome上播放m3u8视频","slug":"blogs/2021-4-1-hls","date":"2021-04-01T00:00:00.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"blogs/2021-4-1-hls/","link":"https://goopher.tk/posts/4.html","permalink":"https://volantis.js.org/blogs/2021-4-1-hls/","excerpt":"在文章中插入m3u8视频的时候，由于Chrome等浏览器原生播放不了这种格式，所以需要添加hls.js等让其支持播放，如果你也遇到了这样的问题就来看看吧。","text":"在文章中插入m3u8视频的时候，由于Chrome等浏览器原生播放不了这种格式，所以需要添加hls.js等让其支持播放，如果你也遇到了这样的问题就来看看吧。","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"GOOPHER"},{"title":"volantis主题修改代码高亮样式","slug":"blogs/2021-3-31-highlightjs","date":"2021-03-31T00:00:00.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"blogs/2021-3-31-highlightjs/","link":"https://goopher.tk/posts/3.html","permalink":"https://volantis.js.org/blogs/2021-3-31-highlightjs/","excerpt":"在使用主题内的highlightjs的时候，你是否也遇到了它不换行、没有行号等问题？点进来看看吧。","text":"在使用主题内的highlightjs的时候，你是否也遇到了它不换行、没有行号等问题？点进来看看吧。","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"GOOPHER"},{"title":"为volantis主题添加图片轮播和热门文章","slug":"blogs/2021-2-30-slider","date":"2021-03-30T00:00:00.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"blogs/2021-2-30-slider/","link":"https://goopher.tk/posts/1.html","permalink":"https://volantis.js.org/blogs/2021-2-30-slider/","excerpt":"这篇教程是基于heson大佬的这篇 给Hexo Volantis主题添加图片轮播功能 创作的，由我将新的轮播模板迁移至主题内，由inkss大佬完善。在这感谢两位大佬，如果你也需要轮播插件，就进来看看吧。","text":"这篇教程是基于heson大佬的这篇 给Hexo Volantis主题添加图片轮播功能 创作的，由我将新的轮播模板迁移至主题内，由inkss大佬完善。在这感谢两位大佬，如果你也需要轮播插件，就进来看看吧。","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"GOOPHER"},{"title":"使用volantis更优雅地展示截图/录屏","slug":"blogs/2021-3-7-framei8","date":"2021-03-07T00:00:00.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"blogs/2021-3-7-framei8/","link":"https://goopher.tk/posts/24004.html","permalink":"https://volantis.js.org/blogs/2021-3-7-framei8/","excerpt":"我在主题文档中看到了frame标签，可以更高大上得展示我们的截图/录屏等。可是目前主题内仅内置了一个iPhone11的框架，想要使用其他的框架就得对齐修改，我经过折腾基本实现了，写下了这篇文章。","text":"我在主题文档中看到了frame标签，可以更高大上得展示我们的截图/录屏等。可是目前主题内仅内置了一个iPhone11的框架，想要使用其他的框架就得对齐修改，我经过折腾基本实现了，写下了这篇文章。","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"GOOPHER"},{"title":"为 hexo 博客支持 sweetalert 弹窗","slug":"blogs/2021-2-19-hexo-supports-sweetalert","date":"2021-02-19T00:00:00.000Z","updated":"2021-02-19T00:00:00.000Z","comments":true,"path":"blogs/2021-2-19-hexo-supports-sweetalert/","link":"https://luosw.fun/post/e281.html","permalink":"https://volantis.js.org/blogs/2021-2-19-hexo-supports-sweetalert/","excerpt":"","text":"","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"luosw"},{"title":"通过CoolPush实时推送hexo评论到QQ","slug":"blogs/2020-12-17-comments-push","date":"2020-12-17T00:00:00.000Z","updated":"2020-12-17T00:00:00.000Z","comments":true,"path":"blogs/2020-12-17-comments-push/","link":"https://www.hin.cool/posts/cpush.html","permalink":"https://volantis.js.org/blogs/2020-12-17-comments-push/","excerpt":"","text":"","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"W4J1e"},{"title":"哔哔！换个姿势在静态博客上发短博文（volantis适配版）","slug":"blogs/2020-10-09-bb-on-volantis","date":"2020-10-09T00:00:00.000Z","updated":"2020-10-09T00:00:00.000Z","comments":true,"path":"blogs/2020-10-09-bb-on-volantis/","link":"https://www.heson10.com/posts/15701.html","permalink":"https://volantis.js.org/blogs/2020-10-09-bb-on-volantis/","excerpt":"要在静态博客上发送短博文，不像 wordpress 和 typecho 新建个栏目那么简单。之前博客整的是 artitalk，已经有短博文的那种体验了，而且还能支持发送 markdown、图片、音乐等等功能。感觉唯一的缺点就是：发文不是很方便，需要在博客上登陆。(至少我觉得很麻烦)。后来看到 @熊野 的那篇《哔哔点啥，换个舒服的姿势》，顿时感觉爱了，这就是我梦寐以求发送短博文的姿势。","text":"要在静态博客上发送短博文，不像 wordpress 和 typecho 新建个栏目那么简单。之前博客整的是 artitalk，已经有短博文的那种体验了，而且还能支持发送 markdown、图片、音乐等等功能。感觉唯一的缺点就是：发文不是很方便，需要在博客上登陆。(至少我觉得很麻烦)。后来看到 @熊野 的那篇《哔哔点啥，换个舒服的姿势》，顿时感觉爱了，这就是我梦寐以求发送短博文的姿势。","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"Heson"},{"title":"Hexo 标签函数 list_tags 用法详解","slug":"blogs/2020-09-24-list-tags","date":"2020-09-24T00:00:00.000Z","updated":"2020-09-24T00:00:00.000Z","comments":true,"path":"blogs/2020-09-24-list-tags/","link":"https://www.heson10.com/posts/59108.html","permalink":"https://volantis.js.org/blogs/2020-09-24-list-tags/","excerpt":"","text":"","categories":[{"name":"开发心得","slug":"开发心得","permalink":"https://volantis.js.org/categories/%E5%BC%80%E5%8F%91%E5%BF%83%E5%BE%97/"}],"tags":[],"author":"Heson"},{"title":"如何给博客添加弹窗通知","slug":"blogs/2020-09-03-message-prompt","date":"2020-09-03T00:00:00.000Z","updated":"2020-09-04T00:00:00.000Z","comments":true,"path":"blogs/2020-09-03-message-prompt/","link":"https://colsrch.cn/posts/72bb5148/","permalink":"https://volantis.js.org/blogs/2020-09-03-message-prompt/","excerpt":"","text":"","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"Colsrch"},{"title":"博客访问速度提升：最佳线路分流","slug":"blogs/2020-08-31-hexospeed","date":"2020-08-31T00:00:00.000Z","updated":"2020-08-31T00:00:00.000Z","comments":true,"path":"blogs/2020-08-31-hexospeed/","link":"https://colsrch.cn/posts/56951997/","permalink":"https://volantis.js.org/blogs/2020-08-31-hexospeed/","excerpt":"","text":"","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"Colsrch"},{"title":"静态博客使用 Issues API 发布动态、友链、书签","slug":"blogs/2020-08-28-issue-api","date":"2020-08-28T00:00:00.000Z","updated":"2020-08-28T00:00:00.000Z","comments":true,"path":"blogs/2020-08-28-issue-api/","link":"https://xaoxuu.com/blog/2020-08-23-issues-api/","permalink":"https://volantis.js.org/blogs/2020-08-28-issue-api/","excerpt":"","text":"","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"xaoxuu"},{"title":"给 Volantis 主题调用 Valine 最新评论","slug":"blogs/2020-09-03-latest-comments","date":"2020-08-28T00:00:00.000Z","updated":"2020-09-03T00:00:00.000Z","comments":true,"path":"blogs/2020-09-03-latest-comments/","link":"https://www.heson10.com/posts/7207.html","permalink":"https://volantis.js.org/blogs/2020-09-03-latest-comments/","excerpt":"","text":"","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"Heson"},{"title":"给 Hexo Volantis 主题添加图片轮播功能","slug":"blogs/2020-08-21-main-banner","date":"2020-08-21T00:00:00.000Z","updated":"2020-08-22T00:00:00.000Z","comments":true,"path":"blogs/2020-08-21-main-banner/","link":"https://www.heson10.com/posts/19736.html","permalink":"https://volantis.js.org/blogs/2020-08-21-main-banner/","excerpt":"","text":"","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"Heson"},{"title":"如何快速优雅地删除 Valine 的垃圾评论","slug":"blogs/2020-07-03-valine","date":"2020-07-03T00:00:00.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"blogs/2020-07-03-valine/","link":"","permalink":"https://volantis.js.org/blogs/2020-07-03-valine/","excerpt":"Valine 评论由于可以匿名，发言成本低、质量低，使用 app 可以方便的删除垃圾评论。","text":"Valine 评论由于可以匿名，发言成本低、质量低，使用 app 可以方便的删除垃圾评论。 操作演示Your browser does not support the video tag. App 只支持数据存储于 LeanCloud 的评论系统。 App 登录前需要配置 AppID 和 AppKey，由于字符比较长，输入不方便，所以支持 URL Scheme 配置。将 URL 生成一个二维码，然后用手机扫码就可以打开 App 并自动配置好。 格式为： valine://cfg/id=7yIoRlSmfX09vQCERsuWzFnx-MdYXbMMI&key=3zCL5GFePTUjwbqLop44QFbr&alias=测试项目 也可以把管理员用户的账号和密码配置上，扫码直接登录，但是注意不要泄露出去： valine://cfg/id=7yIoRlSmfX09vQCERsuWzFnx-MdYXbMMI&key=3zCL5GFePTUjwbqLop44QFbr&alias=测试项目&user=me@xaoxuu.com&psw=q 注意：这个管理员用户并不是 LeanCloud 的账号，而是当前 Valine 数据库中的 _User 表中的一个用户，可以在 App 中注册，然后在 LeanCloud 上把注册的用户设置为管理员。 设置管理员的方法：在 _Role 表中新建一个 admin 角色，然后在 admin 角色的 users 列中点击 Relations 把自己刚注册的用户添加进去，这个用户就有了修改和删除评论数据的权限。 App 测试版地址 Valine for iOS Valine for Android","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"xaoxuu"},{"title":"Volantis 主题部署 Pjax","slug":"blogs/2020-05-17-pjax","date":"2020-05-17T00:00:00.000Z","updated":"2020-08-07T00:00:00.000Z","comments":true,"path":"blogs/2020-05-17-pjax/","link":"https://inkss.cn/blog/76993423/","permalink":"https://volantis.js.org/blogs/2020-05-17-pjax/","excerpt":"","text":"","categories":[{"name":"开发心得","slug":"开发心得","permalink":"https://volantis.js.org/categories/%E5%BC%80%E5%8F%91%E5%BF%83%E5%BE%97/"}],"tags":[],"author":"inkss"},{"title":"关于主题与文档的更新","slug":"news/2020-04-04","date":"2020-04-04T00:00:00.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"news/2020-04-04/","link":"https://github.com/volantis-x/hexo-theme-volantis/issues/215","permalink":"https://volantis.js.org/news/2020-04-04/","excerpt":"由于主题目前仍处于青少年阶段，更新迭代速度比较快，所以不会保留旧版本的文档，如果需要查看旧版本的文档，请下载主题文档的源码，回退到旧版本，本地运行查看。 计划 2.x 的最后一个版本的文档会保留至 5.0 发布时，即最终会同时维护3个大版本的文档。 当主题稳定后会提供英文文档。","text":"由于主题目前仍处于青少年阶段，更新迭代速度比较快，所以不会保留旧版本的文档，如果需要查看旧版本的文档，请下载主题文档的源码，回退到旧版本，本地运行查看。 计划 2.x 的最后一个版本的文档会保留至 5.0 发布时，即最终会同时维护3个大版本的文档。 当主题稳定后会提供英文文档。","categories":[{"name":"官方资讯","slug":"官方资讯","permalink":"https://volantis.js.org/categories/%E5%AE%98%E6%96%B9%E8%B5%84%E8%AE%AF/"}],"tags":[]},{"title":"新版本「2.0」正式版发布","slug":"news/2020-03-10-2.0","date":"2020-03-10T00:00:00.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"news/2020-03-10-2.0/","link":"","permalink":"https://volantis.js.org/news/2020-03-10-2.0/","excerpt":"本次更新内容非常多，主要升级了导航栏、使用新的语言重写了全部样式。旧版本 Volantis 用户，请您卸载掉旧的样式渲染插件，并安装新的： 卸载 less npm uninstall hexo-renderer-less --save 安装 stylus npm install hexo-renderer-stylus --save","text":"本次更新内容非常多，主要升级了导航栏、使用新的语言重写了全部样式。旧版本 Volantis 用户，请您卸载掉旧的样式渲染插件，并安装新的： 卸载 less npm uninstall hexo-renderer-less --save 安装 stylus npm install hexo-renderer-stylus --save 新功能导航栏导航栏获得了史诗级的增强，可以设置N级子菜单。考虑到实用性，不太建议使用过多或者过深的菜单（超出屏幕的部分无法被看到）。 样式设置现在可以在主题配置文件中设置更多的样式： 最大布局宽度 导航栏高度、特效（阴影、毛玻璃、鼠标hover时浮起） 卡片特效（阴影、毛玻璃、鼠标hover时浮起） 代码框是否显示语言 标题和正文文本布局（靠左、靠右、居中） 正文字体 代码字体 各部分颜色 封面封面可以在主题配置文件中设置在首页、归档页面、其它页面默认是否显示。封面中可以同时显示logo图片、标题、副标题了。 小部件grid小部件可以设置 fixed: true 来固定网格宽度（适合文字长短不一的场景）。 其它可以设置「评论」的标题和副标题。可以创建多种颜色的折叠框。友链增加分组描述。 功能调整与优化样式渲染器使用 stylus 重写了所有样式，无需安装less插件了。相较于1.7.4，css文件体积缩小了19.75%。 主题配置文件 主题配置文件经过了较大改动，使得层级结构更加清晰。 优化了二维码（微信）分享的使用体验","categories":[{"name":"官方资讯","slug":"官方资讯","permalink":"https://volantis.js.org/categories/%E5%AE%98%E6%96%B9%E8%B5%84%E8%AE%AF/"}],"tags":[]},{"title":"新版本「2.0」测试版发布","slug":"news/2020-03-06-2.0-beta","date":"2020-03-06T19:43:00.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"news/2020-03-06-2.0-beta/","link":"","permalink":"https://volantis.js.org/news/2020-03-06-2.0-beta/","excerpt":"Beta6 导航栏N级菜单支持分割线和小标题，详见我的个人博客。","text":"Beta6 导航栏N级菜单支持分割线和小标题，详见我的个人博客。 Beta5 导航栏二级N级菜单 支持微信二维码分享（需安装二维码生成插件） Beta4 优化样式 更多样式可以在主题配置文件中自定义 调整主题配置文件 Beta3 优化样式 grid 部件新增 fixed: true 参数，用于固定宽度。 Beta2 可以创建多种颜色的折叠框 友链增加分组描述 Beta1 新版本使用 stylus 完全重写了样式。 可在主题配置文件中修改配色、标题等多种样式（需要关闭CDN）。已知的BUG有： Container左侧的图标（图片）始终显示不出来，原因未知。>div.info background-color: alpha($color-mac-cyan, 20%) border-left: $borderradius-codeblock solid $color-mac-cyan border-radius: $borderradius-codeblock >:before ...(省略无关代码) background-size: 16px 16px background-position: 4px 4px background-repeat: no-repeat background-color: $color-mac-cyan background-image: url("data:image/svg+xmlbase64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHdpZHRoPSIxNzkyIiBoZWlnaHQ9IjE3OTIiIHZpZXdCb3g9IjAgMCAxNzkyIDE3OTIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTEyMTYgMTM0NHYxMjhxMCAyNi0xOSA0NXQtNDUgMTloLTUxMnEtMjYgMC00NS0xOXQtMTktNDV2LTEyOHEwLTI2IDE5LTQ1dDQ1LTE5aDY0di0zODRoLTY0cS0yNiAwLTQ1LTE5dC0xOS00NXYtMTI4cTAtMjYgMTktNDV0NDUtMTloMzg0cTI2IDAgNDUgMTl0MTkgNDV2NTc2aDY0cTI2IDAgNDUgMTl0MTkgNDV6bS0xMjgtMTE1MnYxOTJxMCAyNi0xOSA0NXQtNDUgMTloLTI1NnEtMjYgMC00NS0xOXQtMTktNDV2LTE5MnEwLTI2IDE5LTQ1dDQ1LTE5aDI1NnEyNiAwIDQ1IDE5dDE5IDQ1eiIgZmlsbD0iI2ZmZiIvPjwvc3ZnPg==")我试过把url里面的内容换成网络图片的URL是可以正常显示的。源码在： themes/volantis/source/css/_third-party/container.styl","categories":[{"name":"官方资讯","slug":"官方资讯","permalink":"https://volantis.js.org/categories/%E5%AE%98%E6%96%B9%E8%B5%84%E8%AE%AF/"}],"tags":[]},{"title":"测试「文章内链接作文本的话无法生成静态文件」","slug":"test/2020-03-06-test-url","date":"2020-03-06T00:00:00.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"test/2020-03-06-test-url/","link":"","permalink":"https://volantis.js.org/test/2020-03-06-test-url/","excerpt":"","text":"5、测试Tomcat是否配置成功：打开浏览器，输入在地址栏中输入： http://localhost:8080 的运行结果如下图即为即为配置成功！（因为Tomcat已经在运行再次打开会报错） 相关 Issue： #164 结论：存在这篇文章的情况下能够成功 deploy ，说明这不是主题的 BUG。 markdwon 解析插件为 hexo-renderer-marked 时此插件默认会自动识别 URL ，且原文链接前后没有空格，所以链接前后增加一个空格或者在根目录配置文件中设置 autolink: false 都可以避免 deploy 报错。插件：hexo-renderer-marked","categories":[],"tags":[]},{"title":"新增 pjax 开发分支","slug":"news/2020-02-25","date":"2020-02-25T00:00:00.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"news/2020-02-25/","link":"","permalink":"https://volantis.js.org/news/2020-02-25/","excerpt":"","text":"由于功能未完全兼容，如果想率先使用，尽量不要改主题配置文件。 不能使用封面 mathjax 有折叠框的页面，折叠框打开之后目录高亮位置不对应 很多未知问题 感谢 @inkss 发布的这篇教程 《Hexo 博客部署 Pjax 局部刷新》当所有兼容性问题解决或妥协之后，pjax 分支会合并入 master。","categories":[{"name":"官方资讯","slug":"官方资讯","permalink":"https://volantis.js.org/categories/%E5%AE%98%E6%96%B9%E8%B5%84%E8%AE%AF/"}],"tags":[]},{"title":"主题更名为「Volantis」","slug":"news/2020-02-22","date":"2020-02-22T00:00:00.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"news/2020-02-22/","link":"","permalink":"https://volantis.js.org/news/2020-02-22/","excerpt":"","text":"主题原名「Material X」,最初由「Material-Flow」改编，现已完全没有材质化设计的影子了。风格偏向简约风技术类博客，最大的特点是自由。现更名为「Volantis」，取自权力的游戏地名。","categories":[{"name":"官方资讯","slug":"官方资讯","permalink":"https://volantis.js.org/categories/%E5%AE%98%E6%96%B9%E8%B5%84%E8%AE%AF/"}],"tags":[]},{"title":"主题文档网页更新并开源","slug":"news/2020-02-21","date":"2020-02-21T00:00:00.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"news/2020-02-21/","link":"","permalink":"https://volantis.js.org/news/2020-02-21/","excerpt":"","text":"主题经过几年迭代，现已高度模块化和可定制化，功能相对完善，适合用作文档。原来的 文档主题 将不再维护和更新。 现在使用的文档页面源码是： volantis-docs","categories":[{"name":"官方资讯","slug":"官方资讯","permalink":"https://volantis.js.org/categories/%E5%AE%98%E6%96%B9%E8%B5%84%E8%AE%AF/"}],"tags":[]},{"title":"已关闭评论区","slug":"news/2020-02-20","date":"2020-02-20T00:00:00.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"news/2020-02-20/","link":"","permalink":"https://volantis.js.org/news/2020-02-20/","excerpt":"","text":"使用 GitHub Issue由于 Valine 匿名评论不适合追踪和解决问题，因此决定暂时关闭评论区。为了精准高效解决问题，请前往 GitHub Issue 遇到问题怎么办 确定已经查阅文档找不到相关内容。 前往「常见问题」页面，查看是否有解决方案。 访问在线示例，查看是否具有相同第问题。 如果在线示例表示正常，则说明自己配置有误，检查开发环境、主题配置是否正确。如果检查不出问题，提Issue询问。 如果在线示例也存在相同问题，则说明存在BUG，请提Issue反馈。 如果在线示例没有相关内容，下载示例博客源码，修改运行本地预览，进行第3步判断操作。","categories":[{"name":"官方资讯","slug":"官方资讯","permalink":"https://volantis.js.org/categories/%E5%AE%98%E6%96%B9%E8%B5%84%E8%AE%AF/"}],"tags":[]},{"title":"版本命名规范化","slug":"news/2020-02-19","date":"2020-02-19T00:00:00.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"news/2020-02-19/","link":"","permalink":"https://volantis.js.org/news/2020-02-19/","excerpt":"","text":"主版本号.子版本号.修订版本号 主题从2017年至今，已经经历了相当多的大版本迭代和数不尽的小版本更新，但是版本号的更新一直没有遵循规范。从下次更新开始，将遵循下述的规范： 主版本号： 较大改动、框架调整或重构 子版本号： 较小或局部的功能性更新 修订版本号： 修复BUG或无关紧要的细节调整","categories":[{"name":"官方资讯","slug":"官方资讯","permalink":"https://volantis.js.org/categories/%E5%AE%98%E6%96%B9%E8%B5%84%E8%AE%AF/"}],"tags":[]},{"title":"心率测量工具限免活动","slug":"news/2020-02-18","date":"2020-02-18T00:00:00.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"news/2020-02-18/","link":"","permalink":"https://volantis.js.org/news/2020-02-18/","excerpt":"","text":"心率管家 App（仅iOS端），专业版不定期限免，欢迎下载体验。 如果您看到的时候已经过了限免期，可以先下载免费版使用。为了吸引 app 推荐类网站的爬虫进行推荐，专业版的价格通常在0元到68元之间浮动变化的。 心率管家 专业版 心率管家 免费版","categories":[{"name":"官方资讯","slug":"官方资讯","permalink":"https://volantis.js.org/categories/%E5%AE%98%E6%96%B9%E8%B5%84%E8%AE%AF/"}],"tags":[]},{"title":"Code Highlight Style test","slug":"test/code-highlight","date":"2019-07-25T16:43:00.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"test/code-highlight/","link":"","permalink":"https://volantis.js.org/test/code-highlight/","excerpt":"Make sure all the code blocks highlighted correctly. All the code samples are come from the demo of https://highlightjs.org","text":"Make sure all the code blocks highlighted correctly. All the code samples are come from the demo of https://highlightjs.org Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. #[derive(Debug)]pub enum State { Start, Transient, Closed,}impl From<&'a str> for State { fn from(s: &'a str) -> Self { match s { "start" => State::Start, "closed" => State::Closed, _ => unreachable!(), } }} [ { "title": "apples", "count": [12000, 20000], "description": {"text": "...", "sensitive": false} }, { "title": "oranges", "count": [17500, null], "description": {"text": "...", "sensitive": false} }] class MyClass { public static myValue: string; constructor(init: string) { this.myValue = init; }}import fs = require("fs");module MyModule { export interface MyInterface extends Other { myProperty: any; }}declare magicNumber number;myArray.forEach(() => { }); // fat arrow syntax @requires_authorizationdef somefunc(param1='', param2=0): r'''A docstring''' if param1 > param2: # interesting print 'Gre\\'ater' return (param2 - param1 + 1 + 0b10l) or Noneclass SomeClass: pass>>> message = '''interpreter... prompt''' <!DOCTYPE html><title>Title</title><style>body {width: 500px;}</style><script type="application/javascript"> function $init() {return true;}</script><body> <p checked class="title" id='title'>Title</p> <!-- here goes the rest of the page --></body> function $initHighlight(block, cls) { try { if (cls.search(/\\bno\\-highlight\\b/) != -1) return process(block, true, 0x0F) + ` class="${cls}"`; } catch (e) { /* handle exception */ } for (var i = 0 / 2; i < classes.length; i++) { if (checkCondition(classes[i]) === undefined) console.log('undefined'); } return ( <div> <web-component>{block}</web-component> </div> )}export $initHighlight; #include <iostream>int main(int argc, char *argv[]) { /* An annoying "Hello World" example */ for (auto i = 0; i < 0xFFFF; i++) cout << "Hello, World!" << endl; char c = '\\n'; unordered_map <string, vector<string> > m; m["key"] = "\\\\\\\\"; // this is an error return -2e3 + 12l;} CREATE TABLE "topic" ( "id" serial NOT NULL PRIMARY KEY, "forum_id" integer NOT NULL, "subject" varchar(255) NOT NULL);ALTER TABLE "topic"ADD CONSTRAINT forum_id FOREIGN KEY ("forum_id")REFERENCES "forum" ("id");-- Initialsinsert into "topic" ("forum_id", "subject")values (2, 'D''artagnian'); #import <UIKit/UIKit.h>#import "Dependency.h"@protocol WorldDataSource@optional- (NSString *)worldName;@required- (BOOL)allowsToLive;@end// comment@property (nonatomic, readonly) NSString *title;- (IBAction) show;@end /** * @author John Smith <john.smith@example.com>*/package l2f.gameserver.model;public abstract class L2Char extends L2Object { public static final Short ERROR = 0x0001; public void moveTo(int x, int y, int z) { _ai = null; log("Should not be called"); if (1 > 5) { // wtf!? return; } }} import Foundation@objc class Person: Entity { var name: String! var age: Int! init(name: String, age: Int) { /* /* ... */ */ } // Return a descriptive string for this person func description(offset: Int = 0) -> String { return "\\(name) is \\(age + offset) years old" }} @font-face { font-family: Chunkfive; src: url('Chunkfive.otf');}body, .usertext { color: #F0F0F0; background: #600; font-family: Chunkfive, sans;}@import url(print.css);@media print { a[href^=http]::after { content: attr(href) }} # The Greeter classclass Greeter def initialize(name) @name = name.capitalize end def salute puts "Hello #{@name}!" endendg = Greeter.new("world")g.salute # MakefileBUILDDIR = _buildEXTRAS ?= $(BUILDDIR)/extras.PHONY: main cleanmain: @echo "Building main facility..." build_main $(BUILDDIR)clean: rm -rf $(BUILDDIR)/* package mainimport "fmt"func main() { ch := make(chan float64) ch <- 1.0e10 // magic number x, ok := <- ch defer fmt.Println(`exitting now\\`) go println(len("hello world!")) return} #!/bin/bash###### CONFIGACCEPTED_HOSTS="/root/.hag_accepted.conf"BE_VERBOSE=falseif [ "$UID" -ne 0 ]then echo "Superuser rights required" exit 2figenApacheConf(){ echo -e "# Host ${HOME_DIR}$1/$2 :"} ; boilerplate[package]name = "some_name"authors = ["Author"]description = "This is \\a description"[[lib]]name = ${NAME}default = Trueauto = nocounter = 1_000","categories":[],"tags":[]},{"title":"Markdown Style test","slug":"test/markdown","date":"2018-07-24T23:31:06.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"test/markdown/","link":"","permalink":"https://volantis.js.org/test/markdown/","excerpt":"This post is originated from here and is used for testing markdown style. This post contains nearly every markdown usage. Make sure all the markdown elements below show up correctly.","text":"This post is originated from here and is used for testing markdown style. This post contains nearly every markdown usage. Make sure all the markdown elements below show up correctly. Headers# H1## H2### H3#### H4##### H5###### H6Alternatively, for H1 and H2, an underline-ish style:Alt-H1======Alt-H2------ H1H2H3H4H5H6Alternatively, for H1 and H2, an underline-ish style: Alt-H1Alt-H2EmphasisEmphasis, aka italics, with *asterisks* or _underscores_.Strong emphasis, aka bold, with **asterisks** or __underscores__.Combined emphasis with **asterisks and _underscores_**.Strikethrough uses two tildes. ~~Scratch this.~~ Emphasis, aka italics, with asterisks or underscores. Strong emphasis, aka bold, with asterisks or underscores. Combined emphasis with asterisks and underscores. Strikethrough uses two tildes. Scratch this. Lists1. First ordered list item2. Another item * Unordered sub-list.1. Actual numbers don't matter, just that it's a number 1. Ordered sub-list4. And another item. You can have properly indented paragraphs within list items. Notice the blank line above, and the leading spaces (at least one, but we'll use three here to also align the raw Markdown). To have a line break without a paragraph, you will need to use two trailing spaces. Note that this line is separate, but within the same paragraph. (This is contrary to the typical GFM line break behaviour, where trailing spaces are not required.)* Unordered list can use asterisks- Or minuses+ Or pluses- Paragraph In unordered list For example like this.Common Paragraph with some text.And more text. First ordered list item Another item Unordered sub-list. Actual numbers don't matter, just that it's a number Ordered sub-list And another item. You can have properly indented paragraphs within list items. Notice the blank line above, and the leading spaces (at least one, but we'll use three here to also align the raw Markdown). To have a line break without a paragraph, you will need to use two trailing spaces.Note that this line is separate, but within the same paragraph.(This is contrary to the typical GFM line break behaviour, where trailing spaces are not required.) Unordered list can use asterisks Or minuses Or pluses Paragraph In unordered list For example like this. Common Paragraph with some text.And more text. Inline HTML<p>To reboot your computer, press <kbd>ctrl</kbd>+<kbd>alt</kbd>+<kbd>del</kbd>.</p> To reboot your computer, press ctrl+alt+del. <dl> <dt>Definition list</dt> <dd>Is something people use sometimes.</dd> <dt>Markdown in HTML</dt> <dd>Does *not* work **very** well. Use HTML <em>tags</em>.</dd></dl> Definition list Is something people use sometimes. <dt>Markdown in HTML</dt> <dd>Does *not* work **very** well. Use HTML <em>tags</em>.</dd> Links[I'm an inline-style link](https://www.google.com)[I'm an inline-style link with title](https://www.google.com "Google's Homepage")[I'm a reference-style link][Arbitrary case-insensitive reference text][I'm a relative reference to a repository file](https://cdn.jsdelivr.net/gh/theme-volantis/hexo-theme-volantis/LICENSE)[You can use numbers for reference-style link definitions][1]Or leave it empty and use the [link text itself]Some text to show that the reference links can follow later.[arbitrary case-insensitive reference text]: https://hexo.io[1]: https://hexo.io/docs/[link text itself]: https://hexo.io/api/ I'm an inline-style link I'm an inline-style link with title I'm a reference-style link I'm a relative reference to a repository file You can use numbers for reference-style link definitions Or leave it empty and use the link text itself Some text to show that the reference links can follow later. Imageshover to see the title text:Inline-style:![alt text](https://hexo.io/icon/favicon-196x196.png "Logo Title Text 1")Reference-style:![alt text][logo][logo]: https://hexo.io/icon/favicon-196x196.png "Logo Title Text 2" hover to see the title text: Inline-style: Reference-style: Code and Syntax HighlightingInline code has back-ticks around it. var s = "JavaScript syntax highlighting";alert(s); s = "Python syntax highlighting"print s No language indicated, so no syntax highlighting.But let's throw in a <b>tag</b>. Tables| |ASCII |HTML ||----------------|-------------------------------|-----------------------------||Single backticks|`'Isn't this fun?'` |'Isn't this fun?' ||Quotes |`"Isn't this fun?"` |"Isn't this fun?" ||Dashes |`-- is en-dash, --- is em-dash`|-- is en-dash, --- is em-dash| ASCII HTML Single backticks 'Isn't this fun?' 'Isn't this fun?' Quotes "Isn't this fun?" "Isn't this fun?" Dashes -- is en-dash, --- is em-dash -- is en-dash, --- is em-dash Colons can be used to align columns. | Tables | Are | Cool || ------------- |:-------------:| -----:|| col 3 is | right-aligned | || col 2 is | centered | || zebra stripes | are neat | Tables Are Cool col 3 is right-aligned col 2 is centered zebra stripes are neat The outer pipes (|) are optional, and you don't need to make the raw Markdown line up prettily. You can also use inline Markdown. Markdown | Less | Pretty--- | --- | ---*Still* | `renders` | **nicely**1 | 2 | 3 Markdown Less Pretty Still renders nicely 1 2 3 You can find more information about LaTeX mathematical expressions here. Blockquotes Blockquotes are very handy in email to emulate reply text.This line is part of the same quote. Quote break. This is a very long line that will still be quoted properly when it wraps. Oh boy let's keep writing to make sure this is long enough to actually wrap for everyone. Oh, you can put Markdown into a blockquote. Horizontal RuleThree or more... ---Hyphens***Asterisks___Underscores Hyphens Asterisks Underscores Line BreaksHere's a line for us to start with.This line is separated from the one above by two newlines, so it will be a *separate paragraph*.This line is also a separate paragraph, but...This line is only separated by a single newline, so it's a separate line in the *same paragraph*. Here's a line for us to start with. This line is separated from the one above by two newlines, so it will be a separate paragraph. This line is also a separate paragraph, but...This line is only separated by a single newline, so it's a separate line in the same paragraph. This is a regular paragraph.<table> <tr> <td>Foo</td> </tr></table>This is another regular paragraph. This is a regular paragraph. Foo This is another regular paragraph. Youtube videos<a href="https://www.youtube.com/watch?feature=player_embedded&v=ARted4RniaU" target="_blank"><img src="https://img.youtube.com/vi/ARted4RniaU/0.jpg"alt="IMAGE ALT TEXT HERE" width="240" height="180" border="10" /></a>Pure markdown version:[![IMAGE ALT TEXT HERE](https://img.youtube.com/vi/ARted4RniaU/0.jpg)](https://www.youtube.com/watch?v=ARted4RniaU) Pure markdown version:","categories":[],"tags":[{"name":"Foo","slug":"foo","permalink":"https://volantis.js.org/tags/foo/"},{"name":"Bar","slug":"bar","permalink":"https://volantis.js.org/tags/bar/"}]},{"title":"","slug":"news/2017-10-24","date":"2017-10-24T00:00:00.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"news/2017-10-24/","link":"","permalink":"https://volantis.js.org/news/2017-10-24/","excerpt":"","text":"Volantis A Wonderful Theme for Hexo Volantis 是一个功能丰富、高度模块化的 Hexo 博客主题。得益于其强大的模块化特性，您可以轻松搭建一个极简风格的博客，也可以仿照官网搭建一个多人协作的、包含文档模块的大体量综合型博客。 开始使用","categories":[{"name":"官方资讯","slug":"官方资讯","permalink":"https://volantis.js.org/categories/%E5%AE%98%E6%96%B9%E8%B5%84%E8%AE%AF/"}],"tags":[]},{"title":"Images","slug":"test/images","date":"2013-12-26T22:46:49.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"test/images/","link":"","permalink":"https://volantis.js.org/test/images/","excerpt":"","text":"This is a image test post. 截屏2020-03-1317.25.10.png 截屏2020-03-1317.27.42.png 截屏2020-03-1317.28.02.png","categories":[],"tags":[]},{"title":"","slug":"test/no-title","date":"2013-12-25T22:57:49.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"test/no-title/","link":"","permalink":"https://volantis.js.org/test/no-title/","excerpt":"","text":"This post doesn't have a title. Make sure it's accessible.","categories":[],"tags":[]},{"title":"Excerpts","slug":"test/excerpts","date":"2013-12-25T00:23:23.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"test/excerpts/","link":"","permalink":"https://volantis.js.org/test/excerpts/","excerpt":"The following contents should be invisible in home/archive page.","text":"The following contents should be invisible in home/archive page. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce eget urna vitae velit eleifend interdum at ac nisi. In nec ligula lacus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Sed eu cursus erat, ut dapibus quam. Aliquam eleifend dolor vitae libero pharetra adipiscing. Etiam adipiscing dolor a quam tempor, eu convallis nulla varius. Aliquam sollicitudin risus a porta aliquam. Ut nec velit dolor. Proin eget leo lobortis, aliquam est sed, mollis mauris. Fusce vitae leo pretium massa accumsan condimentum. Fusce malesuada gravida lectus vel vulputate. Donec bibendum porta nibh ut aliquam. Sed lorem felis, congue non fringilla eu, aliquam eu eros. Curabitur orci libero, mollis sed semper vitae, adipiscing in lectus. Aenean non egestas odio. Donec sollicitudin nisi quis lorem gravida, in pharetra mauris fringilla. Duis sit amet faucibus dolor, id aliquam neque. In egestas, odio gravida tempor dictum, mauris felis faucibus purus, sit amet commodo lacus diam vitae est. Ut ut quam eget massa semper sodales. Aenean non ipsum cursus, blandit lectus in, ornare odio. Curabitur ultrices porttitor vulputate.","categories":[],"tags":[]},{"title":"Videos","slug":"test/videos","date":"2013-12-25T00:19:15.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"test/videos/","link":"","permalink":"https://volantis.js.org/test/videos/","excerpt":"","text":"This is a video test post. Youtube Vimeo","categories":[],"tags":[]},{"title":"Gallery Post","slug":"test/gallery-post","date":"2013-12-25T00:16:18.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"test/gallery-post/","link":"","permalink":"https://volantis.js.org/test/gallery-post/","excerpt":"","text":"This post contains 4 photos: Widescreen wallpaper Portrait photo Dual widescreen wallpaper Small photo All photos should be displayed properly.","categories":[],"tags":[]},{"title":"Tag Plugins","slug":"test/tag-plugins","date":"2013-12-25T00:14:39.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"test/tag-plugins/","link":"","permalink":"https://volantis.js.org/test/tag-plugins/","excerpt":"","text":"This post is used for testing tag plugins. See docs for more info. Block QuoteNormal blockquote Praesent diam elit, interdum ut pulvinar placerat, imperdiet at magna. Quote from a bookDo not just seek happiness for yourself. Seek happiness for all. Through kindness. Through mercy. David LevithanWide Awake Quote from TwitterNEW: DevDocs now comes with syntax highlighting. http://devdocs.io @DevDocstwitter.com/devdocs/status/356095192085962752 Quote from an article on the webEvery interaction is both precious and an opportunity to delight. Seth Godin `http://sethgodin.typepad.com/seths_blog/2009/07/welcome-to-island-marketing.html` Welcome to Island Marketing Code BlockNormal code blockalert('Hello World!'); With captionArray.maparray.map(callback[, thisArg]) With caption and URL.compactUnderscore.js.compact([0, 1, false, 2, ‘’, 3]);=> [1, 2, 3] With marked linesLine 1,7-8,10 should be marked with different color. const http = require('http');const hostname = '127.0.0.1';const port = 1337;http.createServer((req, res) => { res.writeHead(200, { 'Content-Type': 'text/plain' }); res.end('Hello World\\n');}).listen(port, hostname, () => { console.log(`Server running at http://${hostname}:${port}/`);}); Note: Theme's style should support .highlight.line.marked (recommend to use the selection or current line color). Gist jsFiddle PullquoteLeftLorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas tempus molestie arcu, et fringilla mauris placerat ac. Nullam luctus bibendum risus. Ut cursus sed ipsum feugiat egestas. Suspendisse elementum, velit eu consequat consequat, augue lorem dapibus libero, eget pulvinar dolor est sit amet nulla. Suspendisse a porta tortor, et posuere mi. Pellentesque ultricies, mi quis volutpat malesuada, erat felis vulputate nisl, ac congue ante tortor ut ante. Proin aliquam sem vel mauris tincidunt, eget scelerisque tortor euismod. Nulla tincidunt enim nec commodo dictum. Mauris id sapien et orci gravida luctus id ut dui. In vel vulputate odio. Duis vel turpis molestie, scelerisque enim eu, lobortis eros. Cras at ipsum gravida, sagittis ante vel, viverra tellus. Nunc mauris turpis, elementum ullamcorper nisl pretium, ultrices cursus justo. Mauris porttitor commodo eros, ac ornare orci interdum in. Cras fermentum cursus leo sed mattis. In dignissim lorem sem, sit amet elementum mauris venenatis ac. RightLorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ligula justo, lobortis sit amet semper vel, dignissim sit amet libero. Praesent ac tempus ligula. Maecenas at gravida odio. Etiam tristique volutpat lacus eu faucibus. Donec non tempus arcu. Phasellus adipiscing, mauris nec mollis egestas, ipsum nunc auctor velit, et rhoncus lorem ipsum at ante. Praesent et sem in velit volutpat auctor. Duis vel mauris nulla. Maecenas mattis interdum ante, quis sagittis nibh cursus et. Nulla facilisi. Morbi convallis gravida tortor, ut fermentum enim gravida et. Nunc vel dictum nisl, non ultrices libero. Proin vestibulum felis eget orci consectetur lobortis. Vestibulum augue nulla, iaculis vitae augue vehicula, dignissim ultrices libero. Sed imperdiet urna et quam ultrices tincidunt nec ac magna. Etiam vel pharetra elit.","categories":[],"tags":[]},{"title":"www.google.com","slug":"test/link-post-without-title","date":"2013-12-24T23:44:13.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"test/link-post-without-title/","link":"http://www.google.com/","permalink":"https://volantis.js.org/test/link-post-without-title/","excerpt":"","text":"This is a link post without a title. The title should be the link with or without protocol. Clicking on the link should open Google in a new tab or window.","categories":[],"tags":[]},{"title":"日本語テスト","slug":"test/日本語テスト","date":"2013-12-24T23:33:26.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"test/日本語テスト/","link":"","permalink":"https://volantis.js.org/test/%E6%97%A5%E6%9C%AC%E8%AA%9E%E3%83%86%E3%82%B9%E3%83%88/","excerpt":"","text":"This is a Japanese test post. 私は昨日ついにその助力家というのの上よりするたなけれ。 最も今をお話団はちょうどこの前後なかろでくらいに困りがいるたをは帰着考えたなかって、そうにもするでうたらない。 がたを知っないはずも同時に九月をいよいよたありた。 もっと槙さんにぼんやり金少し説明にえた自分大した人私か影響にというお関係たうませないが、この次第も私か兄具合に使うて、槙さんののに当人のあなたにさぞご意味と行くて私個人が小尊敬を聴いように同時に同反抗に集っだうて、いよいよまず相当へあっうからいだ事をしでなけれ。 それでそれでもご時日をしはずはたったいやと突き抜けるますて、その元がは行ったてという獄を尽すていけですた。 この中道具の日その学校はあなたごろがすまなりかとネルソンさんの考えるですん、辺の事実ないというご盲従ありたですと、爺さんのためが薬缶が結果までの箸の当時してならて、多少の十月にためからそういう上からとにかくしましないと触れべきものたで、ないうですと多少お人達したのでたた。 From すぐ使えるダミーテキスト - 日本語 Lorem ipsum","categories":[],"tags":[]},{"title":"中文測試","slug":"test/中文測試","date":"2013-12-24T23:31:30.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"test/中文測試/","link":"","permalink":"https://volantis.js.org/test/%E4%B8%AD%E6%96%87%E6%B8%AC%E8%A9%A6/","excerpt":"","text":"This is a Chinese test post. 善我王上魚、產生資西員合兒臉趣論。畫衣生這著爸毛親可時，安程幾？合學作。觀經而作建。都非子作這！法如言子你關！手師也。 以也座論頭室業放。要車時地變此親不老高小是統習直麼調未，行年香一？ 就竟在，是我童示讓利分和異種百路關母信過明驗有個歷洋中前合著區亮風值新底車有正結，進快保的行戰從：弟除文辦條國備當來際年每小腳識世可的的外的廣下歌洲保輪市果底天影；全氣具些回童但倒影發狀在示，數上學大法很，如要我……月品大供這起服滿老？應學傳者國：山式排只不之然清同關；細車是！停屋常間又，資畫領生，相們制在？公別的人寫教資夠。資再我我！只臉夫藝量不路政吃息緊回力之；兒足灣電空時局我怎初安。意今一子區首者微陸現際安除發連由子由而走學體區園我車當會，經時取頭，嚴了新科同？很夫營動通打，出和導一樂，查旅他。坐是收外子發物北看蘭戰坐車身做可來。道就學務。 國新故。 工步他始能詩的，裝進分星海演意學值例道……於財型目古香亮自和這乎？化經溫詩。只賽嚴大一主價世哥受的沒有中年即病行金拉麼河。主小路了種就小為廣不？ From 亂數假文產生器 - Chinese Lorem Ipsum","categories":[],"tags":[]},{"title":"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam justo turpis, tincidunt ac convallis id.","slug":"test/long-title","date":"2013-12-24T23:31:06.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"test/long-title/","link":"","permalink":"https://volantis.js.org/test/long-title/","excerpt":"","text":"This post has a long title. Make sure the title displayed right.","categories":[],"tags":[]},{"title":"Link Post","slug":"test/link-post","date":"2013-12-24T23:30:04.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"test/link-post/","link":"http://www.google.com/","permalink":"https://volantis.js.org/test/link-post/","excerpt":"","text":"This is a link post. Clicking on the link should open Google in a new tab or window.","categories":[],"tags":[]},{"title":"Elements","slug":"test/elements","date":"2013-12-24T23:29:08.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"test/elements/","link":"","permalink":"https://volantis.js.org/test/elements/","excerpt":"","text":"The purpose of this post is to help you make sure all of HTML elements can display properly. If you use CSS reset, don't forget to redefine the style by yourself. Heading 1Heading 2Heading 3Heading 4Heading 5Heading 6 ParagraphLorem ipsum dolor sit amet, test link consectetur adipiscing elit. Strong text pellentesque ligula commodo viverra vehicula. Italic text at ullamcorper enim. Morbi a euismod nibh. Underline text non elit nisl. Deleted text tristique, sem id condimentum tempus, metus lectus venenatis mauris, sit amet semper lorem felis a eros. Fusce egestas nibh at sagittis auctor. Sed ultricies ac arcu quis molestie. Donec dapibus nunc in nibh egestas, vitae volutpat sem iaculis. Curabitur sem tellus, elementum nec quam id, fermentum laoreet mi. Ut mollis ullamcorper turpis, vitae facilisis velit ultricies sit amet. Etiam laoreet dui odio, id tempus justo tincidunt id. Phasellus scelerisque nunc sed nunc ultricies accumsan. Interdum et malesuada fames ac ante ipsum primis in faucibus. Sed erat diam, blandit eget felis aliquam, rhoncus varius urna. Donec tellus sapien, sodales eget ante vitae, feugiat ullamcorper urna. Praesent auctor dui vitae dapibus eleifend. Proin viverra mollis neque, ut ullamcorper elit posuere eget. Praesent diam elit, interdum ut pulvinar placerat, imperdiet at magna. Maecenas ornare arcu at mi suscipit, non molestie tortor ultrices. Aenean convallis, diam et congue ultricies, erat magna tincidunt orci, pulvinar posuere mi sapien ac magna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Praesent vitae placerat mauris. Nullam laoreet ante posuere tortor blandit auctor. Sed id ligula volutpat leo consequat placerat. Mauris fermentum dolor sed augue malesuada sollicitudin. Vivamus ultrices nunc felis, quis viverra orci eleifend ut. Donec et quam id urna cursus posuere. Donec elementum scelerisque laoreet. List TypesDefinition List (dl)Definition List TitleThis is a definition list division. Ordered List (ol) List Item 1 List Item 2 List Item 3 Unordered List (ul) List Item 1 List Item 2 List Item 3 Checkbox List (ul) List Item 1 unchecked List Item 2 checked List Item 3 checked Table Table Header 1 Table Header 2 Table Header 3 Division 1 Division 2 Division 3 Division 1 Division 2 Division 3 Division 1 Division 2 Division 3 Misc Stuff - abbr, acronym, sub, sup, kbd, etc.Lorem superscript dolor subscript amet, consectetuer adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. cite. Nunc iaculis suscipit dui. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus. Maecenas ornare tortor. Donec sed tellus eget sapien fringilla nonummy. NBA Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus. AVE. Use Crtl + C to stop.","categories":[],"tags":[]},{"title":"Hello World","slug":"test/hello-world","date":"2013-12-24T17:49:32.000Z","updated":"2021-05-11T15:17:11.735Z","comments":true,"path":"test/hello-world/","link":"","permalink":"https://volantis.js.org/test/hello-world/","excerpt":"","text":"Welcome to Hexo! This is your very first post. Check documentation to learn how to use.","categories":[],"tags":[]}],"categories":[{"name":"开发心得","slug":"开发心得","permalink":"https://volantis.js.org/categories/%E5%BC%80%E5%8F%91%E5%BF%83%E5%BE%97/"},{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"},{"name":"官方资讯","slug":"官方资讯","permalink":"https://volantis.js.org/categories/%E5%AE%98%E6%96%B9%E8%B5%84%E8%AE%AF/"}],"tags":[{"name":"Foo","slug":"foo","permalink":"https://volantis.js.org/tags/foo/"},{"name":"Bar","slug":"bar","permalink":"https://volantis.js.org/tags/bar/"}]} \ No newline at end of file +{"meta":{"title":"Volantis","subtitle":"","description":"Volantis 是一个功能丰富、高度模块化的 Hexo 博客主题。得益于其强大的模块化特性，您可以轻松搭建一个极简风格的博客，也可以仿照官网搭建一个多人协作的、包含文档模块的大体量综合型博客。","author":"Volantis Team","url":"https://volantis.js.org","root":"/"},"pages":[{"title":"","date":"2021-05-17T08:08:37.075Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"404.html","permalink":"https://volantis.js.org/404","excerpt":"","text":"404 很抱歉，您访问的页面不存在 可能是输入地址有误或该地址已被删除"},{"title":"鸣谢项目和社区贡献者","date":"2021-05-17T08:08:37.075Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"contributors/index.html","permalink":"https://volantis.js.org/contributors/","excerpt":"Volantis 社区的发展离不开团队大佬们的无私奉献和社区小伙伴们的热情互助。每一个心怀梦想、有着独特见解的朋友都可以成为团队的一员。目前 Volantis 社区正处于建设初期，我们缺少各方面的人才，如果您使用主题至少一个月且长期活跃于社区，例如： 解答 issues / discussions 提交有效的建议 官网文档补全/纠错 发现并收录有意思的文章（搭建博客方面）到官网 我们非常欢迎您的加入，请在论坛发帖告诉我们。","text":"Volantis 社区的发展离不开团队大佬们的无私奉献和社区小伙伴们的热情互助。每一个心怀梦想、有着独特见解的朋友都可以成为团队的一员。目前 Volantis 社区正处于建设初期，我们缺少各方面的人才，如果您使用主题至少一个月且长期活跃于社区，例如： 解答 issues / discussions 提交有效的建议 官网文档补全/纠错 发现并收录有意思的文章（搭建博客方面）到官网 我们非常欢迎您的加入，请在论坛发帖告诉我们。 感谢开发者 感谢社区建设者 如何参与社区建设社区建设主要包括 Issues Discussions(论坛) 官网博客收录 官网文档维护 几个方面。 如何维护文档目前 Volantis 4.x 已是已知的 Hexo 主题中文档最全面的，但仍有部分功能缺少明确的文档、部分文档已经过时，如果您发现了遗漏或者错误之处，我们非常希望您能够帮忙完善一下。 Volantis 官网支持 CI ，您可以直接在线编辑源码： 在线编辑文档https://github.com/volantis-x/community/tree/master/source 如何收录博客每位用户在使用或更新主题的时候都需要阅读官网的文档，收录的相关内容能帮助用户更高效地上手，同时也能够提高被收录的文章的曝光率。如果在官网能看到更多的有价值的文章，就会有更多 Volantis 用户或者非 Volantis 用户来访问。 如果您有或者发现了与 Hexo 博客搭建相关的文章，可以转载外链到 Volantis 官网，示例如下： _posts/blogs/2020-05-17-pjax.md---title: Volantis 主题部署 Pjaxdate: 2020-05-17updated: 2020-08-07categories: [开发心得]author: inksslink: https://inkss.cn/blog/76993423/description: 本篇文章记录了我对 Volantis 主题做 Pjax 兼容的种种，大抵算是种记录吧~headimg: # 可以设置文章头图backup: https://archive.vn/U36NG # 将页面存档到 archive.tody 网页快照档案馆的存档链接 https://archive.tody--- 如果这篇文章的作者是第一次出现在官网，还需要在 _data/author.yml 文件中添加作者信息，例如： _data/author.yml...inkss: name: 枋柚梓 avatar: https://cdn.jsdelivr.net/gh/inkss/common@1.4.2/hexo/img/static/avatar.jpg url: https://inkss.cn 注意事项文章存放在 _posts/blogs/ 目录中，且文件名格式为「年-月-日-文章话题」。鼓励原创文章，摘要部分300字符以内。如果想不出摘要可以不写，不要在摘要里重复一遍文章标题。最好选择一个文章分类，如果现有的分类中没有合适的，可以自己新增。如果有文章头图，请确保图片内最多只有一个单词或短语，图片不清晰或者与文章无关的话不建议使用。不仅限于自己的文章，可以在征得文章作者同意的情况下将其链接收录到官网。 在线编辑文档https://github.com/volantis-x/community/tree/master/source/_posts/blogs"},{"title":"","date":"2021-05-17T08:08:37.075Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"examples/index.html","permalink":"https://volantis.js.org/examples/","excerpt":"示 例 博 客 社区维护团队的博客MHuiG划水Colsrch开发者inkss摸鱼W4J1e打杂volantis-x.js.orgTest Site For Development 使用 Volantis 的博客示例","text":"示 例 博 客 社区维护团队的博客MHuiG划水Colsrch开发者inkss摸鱼W4J1e打杂volantis-x.js.orgTest Site For Development 使用 Volantis 的博客示例 如何添加自己的博客链接 第一步：新建 Issue 按照格式填写并提交 { "title": "", "description": "", "screenshot": "", "url": "", "avatar": "", "version": "版本：^4.0"}为了提高图片加载速度，建议优化图片尺寸：打开 压缩图 上传自己的截图，将图片的高度调整到 360px 后下载。将压缩后的图片上传到 去不图床 并使用此图片链接作为截图链接。 第二步：刷新 回来刷新即可生效。 如何更新自己的博客链接 如果是自己创建的 issue ，可以自己修改。 如果是管理员创建的，请自己重新创建一份，然后让管理员删掉旧的。"},{"title":"常见问题与反馈渠道","date":"2021-05-17T08:08:37.075Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"faqs/index.html","permalink":"https://volantis.js.org/faqs/","excerpt":"通常来说，一个全新的工程全部使用默认配置是正常没有故障的。如果无法使用或者效果与示例有较大区别，可以使用 Hexo 官方提供的用于单元测试的博客应用本主题查看样式是否正常，对比 _config.yml 文件排查问题。 Hexo 官方的单元测试项目： https://github.com/hexojs/hexo-theme-unit-test 向开发者反馈问题","text":"通常来说，一个全新的工程全部使用默认配置是正常没有故障的。如果无法使用或者效果与示例有较大区别，可以使用 Hexo 官方提供的用于单元测试的博客应用本主题查看样式是否正常，对比 _config.yml 文件排查问题。 Hexo 官方的单元测试项目： https://github.com/hexojs/hexo-theme-unit-test 向开发者反馈问题 如何更新主题使用主题的时候，尽量 fork 主题到自己的 GitHub，然后进行修改并使用。这样做的好处是：当主题进行重要更新的时候可以根据需要拉取合并代码，使自己 DIY 的主题能够通过更新获取 BUG 修复或者新特性。 如果不懂请自行搜索关键词：fork 更新 实用小技巧所有需要写在主题配置文件中的配置都可以写在站点配置文件的 theme_config: 中，在 Hexo 5.0 后，还可以写在 _config.volantis.yml 文件中，详见 Hexo 官方文档：覆盖主题配置https://hexo.io/zh-cn/docs/configuration#%E8%A6%86%E7%9B%96%E4%B8%BB%E9%A2%98%E9%85%8D%E7%BD%AE也可以直接查看本站源码中站点配置文件的写法：_config.volantis.yml 无法成功运行本地预览 可能是没有安装依赖，请按照「开始」页面中的步骤进行安装，并安装所需依赖。 如果开启了某些第三方服务，请查看文档中是否要求安装插件。 如果报错信息有 lastIndex，你可以尝试把博客根目录配置文件中找到 highlight，并将 auto_detect 设置为 false。 主题配置修改没有生效请确认文档中要求修改的是博客主目录的配置文件 blog/_config.yml 还是主题的配置文件 blog/_config.volantis.yml。 主题样式修改没有生效如果主题配置文件中开启了 cdn 服务，那么修改本地的样式是不会生效的，需要关闭 cdn 服务。 修改什么都没有生效需要 hexo clean 然后重新 hexo s 如果安装了「相关文章推荐」插件后，每次修改 md 文件后都需要重新 hexo s 关掉 CDN 之后样式错乱 请前往文档「开始」页面，检查是否安装了必要的依赖包。 搜索无法使用 请前往文档「开始」页面，检查是否安装了必要的依赖包。 检查根目录配置文件是否有 search 字段冲突。 如果以上两步都无法找到问题，请下载示例源码进行对比。 搜索结果链接不正确请检查根目录配置文件中的链接是否正确，如： blog/_config.ymlurl: https://xaoxuu.comroot: / 教程与指南 Hexo 官方文档 | Valine 官方文档请一定要阅读官方文档！ 可供交流的渠道解决问题 渠道 方式 用途 Issues @volantis-x/hexo-theme-volantis 和开发者沟通的唯一渠道，用于跟进和解决问题 请不要发送邮件开源项目的开发者很反感别人不通过正确的途径如 Issues 而是通过私人邮件询问开源项目问题，所以一般不会回复此类邮件。 交流 渠道 方式 用途 论坛 @volantis-x/discussions 慢，相对正式，方便检索，可以给其他用户参考 QQ群 1146399464 (验证码: vlts-2021) 非正式，即时通讯，易于斗图；不利于给其他用户参考 佛系互动 渠道 方式 用途 评论区 留言 可以测试、灌水、推广自己的博客。"},{"title":"文章分类","date":"2021-05-17T08:08:37.075Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"blog/categories/index.html","permalink":"https://volantis.js.org/blog/categories/","excerpt":"","text":""},{"title":"所有标签","date":"2021-05-17T08:08:37.075Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"blog/tags/index.html","permalink":"https://volantis.js.org/blog/tags/","excerpt":"","text":""},{"title":"进阶设定","date":"2021-05-17T08:08:37.075Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"v2/advanced-settings/index.html","permalink":"https://volantis.js.org/v2/advanced-settings/","excerpt":"","text":"建议有一定基础知识的朋友进行尝试。 将主题添加为子模块 git submodule add https://github.com/volantis-x/hexo-theme-volantis themes/volantis 为网站提速加载速度 尝试安装 hexo-all-minifier 插件来压缩文件。 减少不必要的 js 插件，例如字数统计、动态背景。 查找并解决拖慢速度的资源，以 Chrome 浏览器为例： 页面中点击右键，选择「检查」。 在右边的窗口中「Network」选项卡，并勾选「Disable cache」。 刷新网页，查看加载速度慢的资源。 加载缓慢的图片，建议使用 CDN。 加载缓慢的可以不用的 js 插件，建议舍弃。 加载缓慢却必须使用的 js 插件，建议下载并自己上传至 jsdelivr。 运行速度 访问具有动态特效背景（如雪花、粒子等）的网站时，手机很快会发烫变卡，笔记本很快会风扇狂转并且浏览器提示建议关闭此页面。如果你希望网站有好的使用体验请尽量不要安装这类插件。 强烈推荐安装 hexo-offline 插件，初次加载速度不变，后期切换页面和刷新网页速度越来越快。 推荐安装图片懒加载插件 hexo-lazyload-image（需同时安装 hexo-fs 依赖库）。 优化 SEO在 front-matter 中，可以设置 keywords、description、robots 和 seo_title。其中 seo_title 仅仅用作网页标题，优先级高于 title。 文章内部不要使用 H1 标题。 通过死链检测工具检查并删除无法访问的链接。 安装 SEO 优化插件： hexo-autonofollow hexo-generator-seo-friendly-sitemap 页面不要堆砌关键词，不要频繁更改路径。 使用 CDN对于大部分将博客 deploy 到 GitHub 的用户来说，直接加载本地资源速度比较慢，可以使用 jsdelivr 为开源项目提供的 CDN 服务。 开启方法blog/_config.ymluse_cdn: true 如果你需要对样式进行 DIY，可以只关闭 style 文件的 CDN。 自定义 CDN如果你把对应的文件上传到自己的 CDN 服务器，可以把对应的链接改为自己的 CDN 链接。 安装「相关文章」插件 安装插件 npm i -S hexo-related-popular-posts 在需要显示的位置添加 related_posts 例如放在侧边栏： blog/themes/volantis/_config.ymllayout: on_page: sidebar: [related_posts] 插件的自定义配置方法： hexo-related-popular-posts 分析与统计默认支持 不蒜子 的访问统计，可以自行添加百度统计和 Google Analytics。 字数和阅读时长 安装以下插件：npm i --save hexo-wordcount 修改配置文件，将 wordcount 插件打开blog/themes/volantis/_config.ymlplugins: ... # 文章字数统计、阅读时长，开启需要安装插件: npm i --save hexo-wordcount wordcount: true 然后修改配置文件，将 wordcount 写入需要显示的 meta 位置：blog/themes/volantis/_config.yml# 布局layout: on_list: meta: [..., wordcount, ...] on_page: meta: header: [..., wordcount, ...] footer: [..., wordcount, ...] 百度统计blog/_config.ymlbaidu_analytics_key: 百度统计的key Google Analyticsblog/_config.ymlgoogle_analytics_key: Google Analytics Key CNZZ 统计请参考 ZYMIN 的这篇教程：《hexo+ejs+material x 添加CNZZ统计代码》 网站运行时间等请参考 TRHX 的这篇教程：《Hexo 博客主题个性化》 更多 DIY 玩法详见 @TRHX 的这篇博客：《Hexo 博客主题个性化》 内含卡片半透明、增加卡通人物、自定义鼠标样式、鼠标特效、烟花特效、彩色滚动字体、网站运行时间、动态浏览器标题、雪花飘落特效等多种详细教程。"},{"title":"开始使用","date":"2021-05-17T08:08:37.075Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"v2/getting-started/index.html","permalink":"https://volantis.js.org/v2/getting-started/","excerpt":"","text":" Volantis2 A Wonderful Theme for Hexo Volantis，一个高度模块化和可定制化、功能相对完善的 Hexo 博客主题，既可以用作个人博客，也适合用来搭建文档。 这些是使用了本主题的博客： 示例博客 能力要求自建博客需要一定的相关知识，在开始前，请务必确保： 已掌握 markdown 语法 已阅读 Hexo 官方文档 会使用终端（命令行），会使用 git 会阅读文档、搜索文档 为了更好地使用，还建议掌握以下知识： 规范地使用 GitHub Issues（解决文档中没有的问题） GitHub Fork、Pull Request 操作（使主题保持更新） 环境要求如果您从旧版本更新或着其它主题迁移，请确保环境版本不要太低，否则会产生兼容性问题。 Hexo: 4.2hexo-cli: 3.1node.js: 12.16 # LTS版npm: 6.13 下载与安装脚本自动安装手动安装在博客路径打开终端，下载安装并应用主题： curl -s https://volantis.js.org/start | bash 如果您还没有博客，执行这行命令将会自动检测并安装所需环境，初始化博客，然后下载安装并应用主题。 脚本更多使用方法：#hexo.sh第1/3步：下载主题源码到 themes/ 文件夹 git clone https://github.com/volantis-x/hexo-theme-volantis themes/volantis 第2/3步：修改站点配置文件 blog/_config.ymltheme: volantis 第3/3步：检查并安装依赖 安装 Hexo 搜索的依赖包：npm i -S hexo-generator-search hexo-generator-json-content 安装 stylus 渲染器：npm i -S hexo-renderer-stylus 升级小助手升级前请查看 更新日志 2.6.3 -> 2.6.6 不需要额外处理。 2.6.2 -> 2.6.3 全局搜索 seotitle 并替换为 seo_title。group 组件的索引规则有变，使用 group 组件的文章内，group: group_name 对应的组件名必须是 group_name。group 组件的列表名优先显示文章的 short_title 其次是 title。 许可协议本主题采用 MIT开源许可协议 ，永久无限制免费使用。 MIT开源许可协议被授权人有权利使用、复制、修改、合并、出版发行、散布、再授权及贩售软件及软件的副本。被授权人可根据程式的需要修改授权条款为适当的内容。在软件和软件的所有副本中都必须包含版权声明和许可声明。"},{"title":"页面配置","date":"2021-05-17T08:08:37.075Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"v2/page-settings/index.html","permalink":"https://volantis.js.org/v2/page-settings/","excerpt":"","text":"如无特殊说明，本页面的配置信息写在 页面 文件的 front-matter 中。 布局模板 取值 含义 page 独立页面 post 文章页面 category 分类页面 tag 标签页面 links 友链页面 list 列表页面 page & postpost 页面布局几乎与 page 页面相同，但是有以下细微区别： post 文章有 title 时，向下滚动网页，导航栏会向上移出屏幕显出文章标题，而 page 不会。 主题配置中的 article_footer 只作用于 post，如果 page 也要显示，可以在 front-matter 中设置meta: article_footer: [xxx] front-matterfront-matter 是文件最上方以 --- 分隔的区域，用于指定个别文件的变量。更多请见 Hexo 官方文档：#front-matter 查看全部取值 字段含义值类型默认值layout布局模版String-title页面标题String-seo_title网页标题Stringpage.titleshort_title页面标题（在group列表中显示）Stringpage.titledate创建时间Date文件创建时间updated更新日期Date文件修改时间link外部文章网址String-music内部音乐控件[Object]-robotsrobotsString-keywords页面关键词String-description页面描述、摘要String-cover是否显示封面Booltruemeta文章或页面的meta信息Bool, Arraytheme.layout.*.metasidebar页面侧边栏Bool, Arraytheme.layout.*.sidebarbody页面主体元素Arraytheme.layout.on_page.bodymathjax是否渲染公式Bool, Stringfalsethumbnail缩略图Stringfalseicons图标Array[]layout:post 时特有的字段：字段含义值类型默认值author文章作者[Object]config.authorcategories分类String, Array-tags标签String, Array-toc是否生成目录Booltruetop是否置顶Boolfalseauthor字段含义值类型默认值name作者名Stringconfig.authoravatar头像Stringconfig.avatarurl链接Stringconfig.urlmusic字段是否必须值类型server是netease, tencent, kugou, xiami, baidutype是song, playlist, album, search, artistid是song id / playlist id / album id / search keyword 独立页面除了归档页面是自动生成的，其它独立页面都需要手动创建 md 文件。 归档页面归档页面是自动生成的，并且初始化的时候已经生成，路径如下： blog/_config.yml# Directoryarchive_dir: archives 关于页面Create file if not exists: source/about/index.md---layout: pagetitle: 关于meta: header: [] footer: []sidebar: []valine: placeholder: 有什么想对我说的呢？---下面写关于自己的内容 分类页面Create file if not exists: source/categories/index.md---layout: categoryindex: truetitle: 所有分类--- 标签页面Create file if not exists: source/tags/index.md---layout: tagindex: truetitle: 所有标签--- 列表页面Create file if not exists: source/mylist/index.md---layout: listgroup: mylistindex: true--- 结果就是筛选出所有文章中 front-matter 部分含有 group: mylist 的文章。 友链页面Create file if not exists: source/friends/index.md---layout: links # 必须title: 我的朋友们 # 可选，这是友链页的标题links: - group: 分组1 icon: fas fa-user-tie desc: 这个分组的描述 items: - name: # 博客名 avatar: # 头像链接 url: # 博客链接 backgroundColor: '#3E74C9' # 卡片背景颜色 textColor: '#fff' # 卡片文字颜色 tags: [标签1, 标签2] # 标签 desc: 描述文字 - group: 分组2 icon: fas fa-user-tie desc: 这个分组的描述 items: - name: # 博客名 avatar: # 头像链接 url: # 博客链接 backgroundColor: '#3E74C9' # 卡片背景颜色 textColor: '#fff' # 卡片文字颜色 tags: [标签1, 标签2] # 标签 desc: 描述文字---这里写友链上方的内容。<!-- more -->这里可以写友链页面下方的文字备注，例如自己的友链规范、示例等。 姓名、头像、链接是必填项，其它选填。 404页面Create file if not exists: source/404.md---layout: pagetitle: 404 Not Foundbody: [article, comments]meta: header: [] footer: []sidebar: []valine: path: /404.html placeholder: 请留言告诉我您要访问哪个页面找不到了---{% p center huge, 404 %}{% p center bold, 很抱歉，您访问的页面不存在 %}{% p center small, 可能是输入地址有误或该地址已被删除 %} 页面元素排列默认是文章+评论： front-matter---body: [article, comments]--- 如果你想把相关文章卡片显示在评论前，可以这样写： front-matter---body: [article, related_posts, comments]--- 如果想全局修改，在主题配置文件中的 layout.on_page.body 中设置。 文章属性文章置顶在 front-matter 中设置以下值： front-mattertop: true 如果想自定义置顶标签的文字，可以直接设置为字符串，例如： front-mattertop: 近期更新 文章分类多个分类有两种关系，一种是层级（等同于文件夹），一种是并列（等同于标签）。 多级分类： front-matter---categories: [分类A, 分类B]--- 或者 front-matter---categories: - 分类A - 分类B--- 并列分类 front-mattercategories: - [分类A] - [分类B] 多级+并列分类 front-mattercategories: - [分类A, 分类B] - [分类C, 分类D] 文章摘要在文章中插入 <!-- more -->，前面的部分即为摘要。 某篇文章源码---title: xxxdate: 2020-02-21---这是摘要<!-- more -->这是正文 注意： <!-- more --> 前后一定要有空行，不然可能导致显示错位。 设置文章作者由于支持多个作者在一个站点发布文章，所以可以设置单独一篇文章的作者： front-matter---author: name: 作者 avatar: https://img.vim-cn.com/a1/d53c11fb5d4fd69529bc805d385fe818feb3f6.png url: https://baidu.com--- 显示迷你音乐播放器标题右边显示迷你音乐播放器，支持的字段有：server、type、id。 front-matter---music: server: netease # netease, tencent, kugou, xiami, baidu type: song # song, playlist, album, search, artist id: 16846091 # song id / playlist id / album id / search keyword--- 实际效果见： #contributors 显示 meta 标签文章顶部和底部的日期、分类、更新日期、标签、分享等属于 meta 标签，默认跟随主题配置文件，可在 front-matter 中关闭。 front-matter---top_meta: falsebottom_meta: false--- 标题右边显示缩略图front-matter---thumbnail: https://img.vim-cn.com/17/0c7b02722686d1527a1df807dae0794d995860.png--- 缩略图仅在文章列表和文章页面显示，不会在归档页面显示。 标题右边显示图标front-matter---icons: [fas fa-fire red, fas fa-star green]--- 图标仅在归档页面中显示，可以用来标注热门文章。 可以通过 red / blue / green / yellow / orange / theme / accent 来设置图标的颜色 meta 区域显示外链按钮例如当前文档页面的设置： front-matter---meta: footer: [btns]btns: repo: https://github.com/volantis-x/hexo-theme-volantis bug: https://github.com/volantis-x/hexo-theme-volantis/issues/ doubt: https://github.com/volantis-x/hexo-theme-volantis/issues/ idea: https://github.com/volantis-x/hexo-theme-volantis/issues/--- 按钮的颜色、图标、标题在主题配置文件中设置。 是否要显示封面如果某个页面需要封面，可以这样写： front-matter---cover: true--- 引入外部文章利用 link，搭配自定义的文章作者信息，你可以在文章列表中显示外部文章或者网址，例如： front-matter---layout: postdate: 2017-07-05title: [转]如何搭建基于Hexo的独立博客categories: [Dev, Hexo]tags: - Hexoauthor: name: xaoxuu avatar: https://cdn.jsdelivr.net/gh/xaoxuu/assets@master/avatar/avatar.png url: https://xaoxuu.comlink: https://xaoxuu.com/blog/2017-07-05-hexo-blog/---![](https://img.vim-cn.com/d9/a9af7dc49fc0af8ca3e6dd2450a2f7095a87db.png) 显示侧边栏通过自由设置边栏卡片来删减对应页面的冗余信息，提高有价值的信息在页面中的权重。 如果某个页面不需要侧边栏，可以这样写： front-matter---sidebar: []--- 某个页面想指定显示某几个侧边栏，就这样写: front-matter---sidebar: [grid, toc, tags] # 放置任何你想要显示的侧边栏部件--- 关闭评论可以 front-matter---comments: false--- 也可以 front-matter---body: [article]--- 只显示留言板如果你想创建一个只有留言板的页面 front-matter---body: [comments]---"},{"title":"站点配置","date":"2021-05-17T08:08:37.075Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"v2/site-settings/index.html","permalink":"https://volantis.js.org/v2/site-settings/","excerpt":"","text":"如无特殊说明，本页面的配置信息写在 博客根目录 的 _config.yml 文件中。 网站标题blog/_config.yml# 网站标题title: my blog 网站图标简单方式完全自定义blog/_config.yml# 网站图标，更多尺寸等图标请使用import方式批量导入favicon: https://cdn.jsdelivr.net/gh/xaoxuu/assets@master/favicon/favicon.icoblog/_config.ymlimport: meta: - <meta name="msapplication-TileColor" content="#ffffff"> - <meta name="msapplication-config" content="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/browserconfig.xml"> - <meta name="theme-color" content="#ffffff"> link: - <link rel="apple-touch-icon" sizes="180x180" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/apple-touch-icon.png"> - <link rel="icon" type="image/png" sizes="32x32" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-32x32.png"> - <link rel="icon" type="image/png" sizes="16x16" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-16x16.png"> - <link rel="manifest" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/site.webmanifest"> - <link rel="mask-icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/safari-pinned-tab.svg" color="#5bbad5"> - <link rel="shortcut icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon.ico"> Import可以在无需修改主题文件的情况下在 head 和 body 中添加各种标签。meta 和 link 对应 head 中的 <meta> 和 <link> 标签。script 可以在 body 末尾导入 js 文件。 blog/_config.ymlimport: meta: - <meta name="msapplication-TileColor" content="#ffffff"> - <meta name="msapplication-config" content="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/browserconfig.xml"> - <meta name="theme-color" content="#ffffff"> link: - <link rel="apple-touch-icon" sizes="180x180" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/apple-touch-icon.png"> - <link rel="icon" type="image/png" sizes="32x32" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-32x32.png"> - <link rel="icon" type="image/png" sizes="16x16" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-16x16.png"> - <link rel="manifest" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/site.webmanifest"> - <link rel="mask-icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/safari-pinned-tab.svg" color="#5bbad5"> - <link rel="shortcut icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon.ico"> script: 更多配置更多请见 Hexo 官方文档：#Hexo配置"},{"title":"进阶设定","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/advanced-settings/index.html","permalink":"https://volantis.js.org/v3/advanced-settings/","excerpt":"","text":"使用数据文件有时您可能需要在主题中使用某些资料，而这些资料并不在文章内，并且是需要重复使用的，那么您可以考虑使用 Hexo 3.0 新增的「数据文件」功能。此功能会载入 source/_data 内的 YAML 或 JSON 文件，如此一来您便能在网站中复用这些文件了。 举例来说，在 source/_data 文件夹中新建 menu.yml 文件： Home: /Gallery: /gallery/Archives: /archives/ 您就能在模板中使用这些资料： <% for (var link in site.data.menu) { %> <a href="<%= site.data.menu[link] %>"> <%= link %> </a><% } %> 渲染结果如下 : <a href="/"> Home </a><a href="/gallery/"> Gallery </a><a href="/archives/"> Archives </a> Volantis 的数据文件source/_data/layout.ymlsource/_data/menu.ymlsource/_data/widget.yml 设置子模块 将主题添加为子模块 git submodule add git@github.com:theme-volantis/hexo-theme-volantis themes/volantisorgit submodule add https://github.com/volantis-x/hexo-theme-volantis.git themes/volantis 为网站提速加载速度 尝试安装 hexo-all-minifier 插件来压缩文件。 减少不必要的 js 插件，例如字数统计、动态背景。 查找并解决拖慢速度的资源，以 Chrome 浏览器为例： 页面中点击右键，选择「检查」。 在右边的窗口中「Network」选项卡，并勾选「Disable cache」。 刷新网页，查看加载速度慢的资源。 加载缓慢的图片，建议使用 CDN。 加载缓慢的可以不用的 js 插件，建议舍弃。 加载缓慢却必须使用的 js 插件，建议下载并自己上传至 jsdelivr。 运行速度 访问具有动态特效背景（如雪花、粒子等）的网站时，手机很快会发烫变卡，笔记本很快会风扇狂转并且浏览器提示建议关闭此页面。如果你希望网站有好的使用体验请尽量不要安装这类插件。 推荐安装图片懒加载插件 hexo-lazyload-image（需同时安装 hexo-fs 依赖库）。 优化 SEOblog/_config.volantis.ymlseo: # When there are no keywords in the article's front-matter, use tags as keywords. use_tags_as_keywords: true # When there is no description in the article's front-matter, use excerpt as the description. use_excerpt_as_description: true robots: home_first_page: index,follow home_other_pages: noindex,follow archive: noindex,follow category: noindex,follow tag: noindex,follow # robots can be written in front-matter 在 front-matter 中，可以设置 keywords、description、robots 和 seo_title。其中 seo_title 仅仅用作网页标题，优先级高于 title。 文章内部不要使用 H1 标题。 通过死链检测工具检查并删除无法访问的链接。 安装 SEO 优化插件： hexo-autonofollowhttps://github.com/liuzc/hexo-autonofollow hexo-generator-seo-friendly-sitemaphttps://github.com/ludoviclefevre/hexo-generator-seo-friendly-sitemap 页面不要堆砌关键词，不要频繁更改路径。 使用 CDN对于大部分将博客 deploy 到 GitHub 的用户来说，直接加载本地资源速度比较慢，可以使用 jsdelivr 为开源项目提供的 CDN 服务。 开启方法blog/_config.ymluse_cdn: true 如果你需要对样式进行 DIY，可以只关闭 style 文件的 CDN。 自定义 CDN如果你把对应的文件上传到自己的 CDN 服务器，可以把对应的链接改为自己的 CDN 链接。 安装「相关文章」插件 安装插件 npm i -S hexo-related-popular-posts 在需要显示的位置添加 related_posts 例如放在侧边栏： blog/_config.volantis.ymllayout: on_page: sidebar: [related_posts] 插件的自定义配置方法： hexo-related-popular-postshttps://github.com/tea3/hexo-related-popular-posts 分析与统计默认支持 不蒜子 的访问统计，可以自行添加百度统计和 Google Analytics。 字数和阅读时长 安装以下插件：npm i --save hexo-wordcount 修改配置文件，将 wordcount 插件打开blog/_config.volantis.ymlplugins: ... # 文章字数统计、阅读时长，开启需要安装插件: npm i --save hexo-wordcount wordcount: true 然后修改配置文件，将 wordcount 写入需要显示的 meta 位置：blog/_config.volantis.yml# 布局layout: on_list: meta: [..., wordcount, ...] on_page: meta: header: [..., wordcount, ...] footer: [..., wordcount, ...] 百度统计blog/_config.ymlbaidu_analytics_key: 百度统计的key Google Analyticsblog/_config.ymlgoogle_analytics_key: Google Analytics Key CNZZ 统计请参考 ZYMIN 的这篇教程： Hexo hexo+ejs+material x 添加CNZZ统计代码https://zymin.cn/arcticle/hexo+ejs+material.html 更多 DIY 玩法详见 @TRHX 的这篇博客： Hexo 博客主题个性化https://www.itrhx.com/2018/08/27/A04-Hexo-blog-topic-personalization/ 内含卡片半透明、增加卡通人物、自定义鼠标样式、鼠标特效、烟花特效、彩色滚动字体、网站运行时间、动态浏览器标题、雪花飘落特效等多种详细教程。"},{"title":"安装与版本更新","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/getting-started/index.html","permalink":"https://volantis.js.org/v3/getting-started/","excerpt":"","text":" Volantis3 A Wonderful Theme for Hexo 5 Volantis，一个高度模块化和可定制化、功能相对完善的 Hexo 博客主题，既可以用作个人博客，也适合用来搭建文档。 这些是使用了本主题的博客： 示例博客 能力要求 !!!自建博客需要一定的相关知识，在开始前，请务必确保： 已掌握 markdown 语法 已阅读 Hexo 官方文档 会使用终端（命令行），会使用 git 会阅读文档、搜索文档 为了更好地使用，还建议掌握以下知识： 会阅读源码，知道本站源码在哪里，会参照源码仿写、对比差异 规范地使用 GitHub Issues（解决文档中没有的问题） GitHub Fork、Pull Request 操作（使主题保持最新） 环境要求如果您从旧版本更新或着其它主题迁移，请确保环境版本不要太低，否则会产生兼容性问题。 Hexo: 4.2 ~ 5.xhexo-cli: 3.1 ~ 4.xnode.js: 12.16 ~ latest # 推荐使用 LTS 版npm: 6.13 ~ latest 下载与安装全新博客安装从其它主题迁移第 1/2 步：修改站点配置文件 在 blog/_config.yml 文件中找到并修改：theme: volantis 第 2/2 步：下载主题 在终端中输入：npm i hexo-theme-volantis 如果您是 Mac 用户，可以使用脚本完成全部流程 在博客路径打开终端，下载安装并应用主题：curl -s https://volantis.js.org/start | bash这行命令将会自动检测并安装所需环境，初始化博客，然后下载安装并应用主题。脚本详细使用方法：#hexo.sh 第 1/3 步：修改站点配置文件 在 blog/_config.yml 文件中找到并修改：theme: volantis 第 2/3 步：下载主题 如果您已经升级到 Hexo 5.0.2 及以上，可以直接使用 npm 命令安装：npm i hexo-theme-volantis对于旧版本，需要下载主题源码到 themes/ 文件夹：git clone https://github.com/volantis-x/hexo-theme-volantis themes/volantis如果您无法访问 GitHub 可以使用国内镜像源：git clone https://e.coding.net/volantis/volantis/volantis.git themes/volantis 第 3/3 步：检查并安装依赖 安装 Hexo 搜索的依赖包：npm i hexo-generator-search hexo-generator-json-content安装 Stylus 渲染器：npm i hexo-renderer-stylus 版本更新请对照 更新日志 进行更新，下面是更新之后需要注意的事项： 2020-08-09 2.6.6 -> 3.0.0 如果有 hexo-lazyload-image 插件，需要重新安装最新版本并增加设置 lazyload.isSPA: true 。2.x 版本的 css 和 js 不适用于 3.x 版本，如果使用了 use_cdn: true 则需要删除。2.x 版本的 fancybox 标签在 3.x 版本中被重命名为 gallery 。2.x 版本的置顶 top: true 改为了 pin: true 并且同样适用于 layout: page 的页面。如果使用了 hexo-offline 插件，建议卸载，3.0 版本使用了 pjax 服务。欢迎补充 许可协议本主题采用 MIT开源许可协议 ，永久无限制免费使用。 MIT开源许可协议被授权人有权利使用、复制、修改、合并、出版发行、散布、再授权及贩售软件及软件的副本。被授权人可根据程式的需要修改授权条款为适当的内容。在软件和软件的所有副本中都必须包含版权声明和许可声明。"},{"title":"进阶设定","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v4/advanced-settings/index.html","permalink":"https://volantis.js.org/v4/advanced-settings/","excerpt":"","text":"设置子模块 将主题添加为子模块 git submodule add https://github.com/volantis-x/hexo-theme-volantis.git themes/volantis 多人协同默认的作者信息在主题配置文件中设置： blog/themes/volantis/_config.yml# 文章布局article: ... body: ... meta_library: author: avatar: name: 请设置文章作者 url: / Volantis 支持多个作者在一个站点发布文章，其他作者信息需要写在数据文件中，例如： blog/source/_data/author.ymlJon: name: Jon Snow avatar: https://cn.bing.com/th?id=AMMS_fc8f99fd41ebd737a71c4e13806db9a0&w=110&h=110&c=7&rs=1&qlt=80&pcl=f9f9f9&cdv=1&dpr=2&pid=16.1 url: https://gameofthrones.fandom.com/wiki/Jon_SnowDany: name: Daenerys Targaryen avatar: https://tse1-mm.cn.bing.net/th?id=OIP.Yax4wLzIFbcBVUa_RsKywQHaLH&w=80&h=80&c=8&rs=1&qlt=90&dpr=2&pid=3.1&rm=2 url: https://gameofthrones.fandom.com/wiki/Daenerys_Targaryen 在文章的 front-matter 中新增 author 即可： ---title: Jon Snow | Game of Thrones Wiki | Fandomauthor: Jon--- 为网站提速加载速度 减少不必要的 js 插件，例如字数统计、动态背景。 查找并解决拖慢速度的资源，以 Chrome 浏览器为例： 页面中点击右键，选择「检查」。 在右边的窗口中「Network」选项卡，并勾选「Disable cache」。 刷新网页，查看加载速度慢的资源。 加载缓慢的图片，建议使用 CDN。 加载缓慢的可以不用的 js 插件，建议舍弃。 加载缓慢却必须使用的 js 插件，建议下载并自己上传至 jsdelivr。 运行速度 访问具有动态特效背景（如雪花、粒子等）的网站时，手机很快会发烫变卡，笔记本很快会风扇狂转并且浏览器提示建议关闭此页面。如果你希望网站有好的使用体验请尽量不要安装这类插件。 优化 SEOblog/_config.volantis.ymlseo: # When there are no keywords in the article's front-matter, use tags as keywords. use_tags_as_keywords: true # When there is no description in the article's front-matter, use excerpt as the description. use_excerpt_as_description: true robots: home_first_page: index,follow home_other_pages: noindex,follow archive: noindex,follow category: noindex,follow tag: noindex,follow # robots can be written in front-matter 在 front-matter 中，可以设置 keywords、description、robots 和 seo_title。其中 seo_title 仅仅用作网页标题，优先级高于 title。 文章内部不要使用 H1 标题。 通过死链检测工具检查并删除无法访问的链接。 安装 SEO 优化插件： hexo-autonofollowhttps://github.com/liuzc/hexo-autonofollow hexo-generator-seo-friendly-sitemaphttps://github.com/ludoviclefevre/hexo-generator-seo-friendly-sitemap 页面不要堆砌关键词，不要频繁更改路径。 使用 CDN对于大部分将博客 deploy 到 GitHub 的用户来说，直接加载本地资源速度比较慢，可以使用 jsdelivr 为开源项目提供的 CDN 服务。 开启方法blog/_config.volantis.yml# use_cdn: /source/js/* 中的JS文件(JS Only)使用jsdelivr的min版本加速# 默认使用 https://cdn.jsdelivr.net/npm/hexo-theme-volantis@<%- theme.info.theme_version %>/source/js/*.min.js 的CDN压缩版本(min.js)，注意版本号对应关系！！可以通过修改以下配置项覆盖# 开发者注意 use_cdn 设置为 falseuse_cdn: trueinfo: theme_version: 'x.x.x' # This is theme's version. cdn: js: # https://cdn.jsdelivr.net/npm/hexo-theme-volantis@<%- theme.info.theme_version %>/source/js/app.min.js # 注意版本!!! css: first: # /css/first.css (默认不提供CDN，first.css 中为首屏渲染的样式，内含 cover navbar search 的样式。) style: # /css/style.css (默认不提供CDN，style.css 为异步延迟加载的样式。) 如果你需要对样式进行 DIY，可以只关闭 style 文件的 CDN。 如果你需要对样式进行 DIY，请注意首屏渲染和异步延迟加载的差异。 自定义 CDN如果你把对应的文件上传到自己的 CDN 服务器，可以把对应的链接改为自己的 CDN 链接。 尝试使用 Terser 压缩 ES6安装压缩工具npm install -g gulpnpm install --save-dev gulp gulp-html-minifier-terser gulp-htmlclean gulp-htmlmin gulp-minify-css gulp-terser gulp 配置文件blog/gulpfile.jsvar gulp = require('gulp');var minifycss = require('gulp-minify-css');var htmlmin = require('gulp-html-minifier-terser');var htmlclean = require('gulp-htmlclean');var terser = require('gulp-terser');// 压缩css文件const minify_css = () => ( gulp.src(['./public/**/*.css']) .pipe(minifycss()) .pipe(gulp.dest('./public')));// 压缩html文件const minify_html = () => ( gulp.src(['./public/**/*.html','!./public/{lib,lib/**}']) .pipe(htmlclean()) .pipe(htmlmin({ removeComments: true, minifyJS: true, minifyCSS: true, minifyURLs: true, })) .pipe(gulp.dest('./public')))// 压缩js文件const minify_js = () => ( gulp.src(['./public/**/*.js', '!./public/**/*.min.js','!./public/{lib,lib/**}']) .pipe(terser()) .pipe(gulp.dest('./public')))module.exports = { minify_html: minify_html, minify_css: minify_css, minify_js: minify_js};gulp.task('one', gulp.parallel( minify_html, minify_css, minify_js))gulp.task('default', gulp.series('one')); 运行压缩gulp 安装 Service Worker 服务blog/_config.yml# 全局导入import: script: - <script>"serviceWorker"in navigator&&navigator.serviceWorker.register("/sw.js").then(function(n){n.onupdatefound=function(){var e=n.installing;e.onstatechange=function(){switch(e.state){case"installed":navigator.serviceWorker.controller?console.log("Updated serviceWorker."):console.log("serviceWorker Sucess!");break;case"redundant":console.log("The installing service worker became redundant.")}}}}).catch(function(e){console.log("Error during service worker registration:",e)}); </script> 在blog/source中创建sw.js文件。 内容如下： importScripts('https://cdn.jsdelivr.net/npm/workbox-cdn@5.1.3/workbox/workbox-sw.js');workbox.setConfig({ modulePathPrefix: 'https://cdn.jsdelivr.net/npm/workbox-cdn@5.1.3/workbox/'});const { core, precaching, routing, strategies, expiration, cacheableResponse, backgroundSync } = workbox;const { CacheFirst, NetworkFirst, NetworkOnly, StaleWhileRevalidate } = strategies;const { ExpirationPlugin } = expiration;const { CacheableResponsePlugin } = cacheableResponse;const cacheSuffixVersion = '-000010', // 缓存版本号 极端重要，修改静态文件后发布网页一定要修改缓存版本号 maxEntries = 100;self.addEventListener('activate', (event) => { event.waitUntil( caches.keys().then((keys) => { return Promise.all(keys.map((key) => { if (!key.includes(cacheSuffixVersion)) return caches.delete(key); })); }) );});core.setCacheNameDetails({ prefix: 'volantis', // 极端重要 自己拟定一个名字 suffix: cacheSuffixVersion});core.skipWaiting();core.clientsClaim();precaching.cleanupOutdatedCaches();/* * Precache * - Static Assets */precaching.precacheAndRoute( // 极端重要 定义首次缓存的静态文件 如果开启CDN需要修改为CDN链接 [ { url: '/css/first.css', revision: null }, { url: '/css/style.css', revision: null }, { url: '/js/app.js', revision: null }, ],);/* * Cache File From CDN * * Method: CacheFirst * cacheName: static-immutable * cacheTime: 30d */// cdn.jsdelivr.net - cors enabledrouting.registerRoute( /.*cdn\\.jsdelivr\\.net/, new CacheFirst({ cacheName: 'static-immutable' + cacheSuffixVersion, fetchOptions: { mode: 'cors', credentials: 'omit' }, plugins: [ new ExpirationPlugin({ maxAgeSeconds: 30 * 24 * 60 * 60, purgeOnQuotaError: true }) ] }));// m7.music.126.net - cors enabledrouting.registerRoute( /.*m7\\.music\\.126\\.net/, new CacheFirst({ cacheName: 'static-immutable' + cacheSuffixVersion, fetchOptions: { mode: 'cors', credentials: 'omit' }, plugins: [ new ExpirationPlugin({ maxAgeSeconds: 30 * 24 * 60 * 60, purgeOnQuotaError: true }) ] }));/* * No Cache * * Method: networkOnly */routing.registerRoute( /.*baidu\\.com.*/, new NetworkOnly());/* * Others img fonts * Method: staleWhileRevalidate */routing.registerRoute( // Cache image fonts files /.*\\.(?:png|jpg|jpeg|svg|gif|webp|ico|eot|ttf|woff|woff2|mp3)/, new StaleWhileRevalidate());/* * Static Assets * Method: staleWhileRevalidate */routing.registerRoute( // Cache CSS files /.*\\.(css|js)/, // Use cache but update in the background ASAP new StaleWhileRevalidate());/* * sw.js - Revalidate every time * staleWhileRevalidate */routing.registerRoute( '/sw.js', // 本文件名 new StaleWhileRevalidate());/* * Default - Serve as it is * networkFirst */routing.setDefaultHandler( new NetworkFirst({ networkTimeoutSeconds: 3 })); 安装「相关文章」插件 安装插件 npm i -S hexo-related-popular-posts 插件的自定义配置方法： hexo-related-popular-postshttps://github.com/tea3/hexo-related-popular-posts 如果您使用了头图，可以在站点配置文件中添加以下设置来让相关文章显示正确的文章头图： blog/_config.ymlpopularPosts: eyeCatchImageAttributeName: headimg 注意需要升级到 5.0.1 及以上版本才可以支持自定义头图，详见 #29 分析与统计默认支持 不蒜子 的访问统计，可以自行添加百度统计和 Google Analytics。 字数和阅读时长 安装以下插件：npm i --save hexo-wordcount 修改配置文件，将 wordcount 插件打开blog/_config.volantis.ymlplugins: ... # 文章字数统计、阅读时长，开启需要安装插件: npm i --save hexo-wordcount wordcount: enable: #true 然后修改配置文件，将 wordcount 写入需要显示的 meta 位置：blog/_config.volantis.yml# 文章布局article: ... # 文章详情页面的文章卡片本体布局方案 body: # 文章顶部信息 # 从 meta_library 中取 top_meta: [..., wordcount, ...] ... # 文章底部信息 # 从 meta_library 中取 bottom_meta: [..., wordcount, ...] CNZZ 统计请参考 ZYMIN 的这篇教程： Hexo hexo+ejs+material x 添加CNZZ统计代码https://zymin.cn/arcticle/hexo+ejs+material.html 更多进阶玩法详见 @TRHX 的这篇博客： Hexo 博客主题个性化https://www.itrhx.com/2018/08/27/A04-Hexo-blog-topic-personalization/ 内含卡片半透明、增加卡通人物、自定义鼠标样式、鼠标特效、烟花特效、彩色滚动字体、网站运行时间、动态浏览器标题、雪花飘落特效等多种详细教程。 主题官网 #进阶玩法https://volantis.js.org/categories/进阶玩法/"},{"title":"","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v4/getting-started/index.html","permalink":"https://volantis.js.org/v4/getting-started/","excerpt":"","text":" Volantis4 A Wonderful Theme for Hexo Volantis 是一个功能丰富、高度模块化的 Hexo 博客主题。得益于其强大的模块化特性，您可以轻松搭建一个极简风格的博客，也可以仿照官网搭建一个多人协作的、包含文档模块的大体量综合型博客。 示例博客https://volantis.js.org/examples/ 所有的 Volantis 用户都可以按照格式自行创建 Issue 来将自己的博客添加到官网的示例博客页面中。 准备工作能力条件环境配置条件自建博客需要一定的相关知识，在开始前，请务必确保您会使用 markdown 语法，掌握简单的 git 知识，最最重要的是，遇到困难知道该怎么寻求解决： 翻阅和搜索文档 搜索 issues 中是否有解决办法 新建 issue 并按照要求进行操作，详尽地描述您遇到的问题 如果您没有使用过 Hexo 也不要着急，可以先通读一遍 Hexo 中文文档，要想使用地得心应手，最好参照团队提供的开源项目的源码进行搭建： Demo 源码 ｜ 官网源码如果您从旧版本更新或着其它主题迁移，请确保环境版本不要太低，否则会产生兼容性问题。 Hexo: 4.2 ~ 5.xhexo-cli: 3.1 ~ 4.xnode.js: 12.16 ~ latest # 推荐使用 LTS 版npm: 6.13 ~ latest 快速体验如果您已经具备环境配置条件，可以在终端中输入下面这行代码，稍等片刻即可尝鲜体验： git clone https://github.com/volantis-x/demo.git && cd demo && npm i && hexo s 下载与安装全新博客安装从其它主题迁移第 1/2 步：修改站点配置文件 在 blog/_config.yml 文件中找到并修改：theme: volantis 第 2/2 步：下载主题 在终端中输入：npm i hexo-theme-volantis 如果您是 Mac 用户，可以使用脚本完成全部流程 在博客路径打开终端，下载安装并应用主题：curl -s https://volantis.js.org/start | bash这行命令将会自动检测并安装所需环境，初始化博客，然后下载安装并应用主题。脚本详细使用方法：#hexo.sh 第 1/3 步：修改站点配置文件 在 blog/_config.yml 文件中找到并修改：theme: volantis 第 2/3 步：下载主题 如果您已经升级到 Hexo 5.0.2 及以上，可以直接使用 npm 命令安装：npm i hexo-theme-volantis对于旧版本，需要下载主题源码到 themes/ 文件夹：git clone https://github.com/volantis-x/hexo-theme-volantis themes/volantis如果您无法访问 GitHub 可以使用国内镜像源：git clone https://e.coding.net/volantis-x/p/hexo-theme-volantis.git themes/volantis 第 3/3 步：检查并安装依赖 安装 Hexo 搜索的依赖包：npm i hexo-generator-search hexo-generator-json-content安装 Stylus 渲染器：npm i hexo-renderer-stylus 版本更新注意事项使用主题的时候，尽量 fork 主题到自己的 GitHub，然后进行修改并使用。这样做的好处是：当主题进行重要更新的时候可以根据需要拉取合并代码，使自己 DIY 的主题能够通过更新获取 BUG 修复或者新特性。 如果不懂请自行搜索关键词：fork 更新 实用小技巧所有需要写在主题配置文件中的配置都可以写在站点配置文件的 theme_config: 中，在 Hexo 5.0 后，还可以写在 _config.volantis.yml 文件中，详见 Hexo 官方文档：覆盖主题配置https://hexo.io/zh-cn/docs/configuration#%E8%A6%86%E7%9B%96%E4%B8%BB%E9%A2%98%E9%85%8D%E7%BD%AE也可以直接查看本站源码中站点配置文件的写法：_config.volantis.yml 请对照 更新日志 进行更新，下面是更新之后需要注意的事项： 2021-01-15 4.2.0 -> 4.3.0 更多关于Volantis的小版本更新请点击上方更新日志按钮增加 disqusjs 评论系统；增加 waline 评论系统；增加 旧版 Internet Explorer 淘汰行动 ；增加 Tidio聊天功能；增加 twitoo waline valine minivaline 文章阅读量统计；增加 bbtalk.js；修复#514 #538 #567 #431 #468；修复关闭 pjax 时 cover样式失效 和 报错 的问题 。 2020-09-26 3.0.0 -> 4.0.0 4.0.0 的配置文件改动非常大，强烈建议不要在旧的配置文件上改。原数据文件中的配置项不再支持，请在配置文件中进行设置。主题配置文件进行了重新设计，需要「完全」重新配置一遍。友链使用数据文件，并支持 issues 标签实现动态自助友链。原 meta 自定义布局现在只支持文章内部的 top_meta 和 bottom_meta 。文章列表页面布局现在只能在有限范围内进行自定义。侧边栏组件现在只支持侧边栏位置；文章末尾有专用的组件。如果安装了懒加载插件，需要卸载掉，使用主题内置的懒加载（和插件冲突）。如果想要关闭评论，需要改为 comments: false 。如果要隐藏文章顶部或者底部的 meta 标签，需设置 top_meta: false 或者 bottom_meta: false 。如果需要同时隐藏标题和顶部的 meta 标签也可以把 title: xxx 改为 seo_title: xxx 。作者的信息使用数据文件进行定义，文章中只需要写 author: xxx 而不需要重复写作者的信息了。现在只有 gallery 标签的图片支持放大。友链页面 layout: links 改为 layout: friends。 许可协议本主题采用 MIT开源许可协议 ，永久无限制免费使用。 MIT开源许可协议被授权人有权利使用、复制、修改、合并、出版发行、散布、再授权及贩售软件及软件的副本。被授权人可根据程式的需要修改授权条款为适当的内容。在软件和软件的所有副本中都必须包含版权声明和许可声明。 配置与使用配置与使用/v4/site-settings/"},{"title":"页面配置","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v4/page-settings/index.html","permalink":"https://volantis.js.org/v4/page-settings/","excerpt":"","text":"页面布局模板布局模板 取值 含义 page 独立页面 post 文章页面 docs 文档页面 category 分类页面 tag 标签页面 friends 友链页面 list 列表页面 page & post & docs这三种页面相同，但是有以下细微区别： post 文章有 title 时，向下滚动网页，导航栏会向上移出屏幕显出文章标题，而 page 和 docs 不会。 post 文章末尾最多可以显示「参考资料」、「相关文章」、「版权标识」、「打赏」四个模块。 docs 文章末尾最多可以显示「参考资料」一个模块。 除了归档页面是自动生成的，其它独立页面都需要手动创建 md 文件。 归档页面归档页面是自动生成的，并且初始化的时候已经生成，路径如下： blog/_config.yml# Directoryarchive_dir: archives 关于页面Create file if not exists: source/about/index.md---layout: docsseo_title: 关于bottom_meta: falsesidebar: []valine: placeholder: 有什么想对我说的呢？---下面写关于自己的内容 分类页面Create file if not exists: source/categories/index.md---layout: categoryindex: truetitle: 所有分类--- 标签页面Create file if not exists: source/tags/index.md---layout: tagindex: truetitle: 所有标签--- 列表页面Create file if not exists: source/mylist/index.md---layout: listgroup: mylistindex: true--- 结果就是筛选出所有文章中 front-matter 部分含有 group: mylist 的文章。 友链页面创建页面文件Create file if not exists: source/friends/index.md---layout: friends # 必须title: 我的朋友们 # 可选，这是友链页的标题---这里写友链上方的内容。<!-- more -->这里可以写友链页面下方的文字备注，例如自己的友链规范、示例等。 选择布局方案在主题配置文件中找到以下内容： pages: # 友链页面配置 friends: layout_scheme: traditional # simple: 简单布局, traditional: 传统布局, sites: 网站卡片布局 目前提供三种布局方案： simple: 简单布局，只有头像和标题。 traditional: 传统布局，是 Volantis 旧版本的风格。 sites: 网站卡片布局，是 Volantis 4.x 新增的网站卡片标签的样式。 设置数据源静态数据源动态数据源友链的数据源写在以下路径，如果没有请自行创建： blog/source/_data/friends.yml 内容格式为： blog/source/_data/friends.yml- group: # 分组标题 description: # 分组描述 items: - title: # 名称 avatar: # 头像 url: # 链接 screenshot: # 截图 keywords: # 关键词 description: # 描述 - title: # 名称 avatar: # 头像 url: # 链接 screenshot: # 截图 keywords: # 关键词 description: # 描述 不同的布局方式，会用到一部分的字段，一般来说，title、avatar 和 url 都是必须的。这些数据被转成 HTML 标签插入到友链页面的 <!-- more --> 部分。使用 issues 标签可以从 issues 中获取 JSON 数据解析并生成 HTML 填充到页面中，使用方法如下： {% issues sites | api=https://api.github.com/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=active %} 这样添加友链的方式就变成了：对方提 Issue ，自己审核，然后添加 active 标签，然后刷新网页就生效了。更新友链内容也变得十分方便， Issue 的创建者拥有修改和关闭的权限。 新建一个 GitHub 或者 Gitee 仓库，创建 Issues 模板，如下： { "title": "", "screenshot": "", "url": "", "avatar": "", "description": "", "keywords": ""} 关于如何使用 issues 标签，详见这篇文章： 静态博客使用 Issues API 发布动态、友链、书签https://xaoxuu.com/blog/2020-08-23-issues-api/ 建议两者是可以同时使用的哦，建议开放 issues 友链给大家，常联系的自己再保存到静态友链。实测 GitHub API 速度和稳定性不如 Gitee ，如果追求稳定建议使用 Gitee。 404页面Create file if not exists: source/404.md---cover: truerobots: noindex,nofollowsitemap: falseseo_title: 404 Not Foundbottom_meta: falsesidebar: []valine: path: /404.html placeholder: 请留言告诉我您要访问哪个页面找不到了---{% p logo center huge, 404 %}{% p center bold, 很抱歉，您访问的页面不存在 %}{% p center small, 可能是输入地址有误或该地址已被删除 %} front-matterfront-matter 是文件最上方以 --- 分隔的区域，用于指定个别文件的变量。更多请见 Hexo 官方文档：#front-matter 字段 含义 值类型 默认值 layout 布局模版 String - title 页面标题 String - seo_title 网页标题 String page.title short_title 页面标题（在group列表中显示） String page.title date 创建时间 Date 文件创建时间 updated 更新日期 Date 文件修改时间 link 外部文章网址 String - music 内部音乐控件 [Object] - robots robots String - keywords 页面关键词 String - description 页面描述、摘要 String - cover 是否显示封面 Bool true top_meta 是否显示文章或页面顶部的meta信息 Bool true bottom_meta 是否显示文章或页面底部的meta信息 Bool true sidebar 页面侧边栏 Bool, Array theme.layout.*.sidebar body 页面主体元素 Array theme.layout.on_page.body mathjax 是否渲染公式 Bool, String false thumbnail 缩略图 String false icons 图标 Array [] pin 是否置顶 Bool false headimg 文章头图 url - layout:post 时特有的字段： 字段 含义 值类型 默认值 author 文章作者 [Object] config.author categories 分类 String, Array - tags 标签 String, Array - toc 是否生成目录 Bool true music 字段 是否必须 值类型 server 是 netease, tencent, kugou, xiami, baidu type 是 song, playlist, album, search, artist id 是 song id / playlist id / album id / search keyword 文章置顶在 front-matter 中设置以下值： front-matterpin: true 文章分类多个分类有两种关系，一种是层级（等同于文件夹），一种是并列（等同于标签）。 多级分类： front-matter---categories: [分类A, 分类B]--- 或者 front-matter---categories: - 分类A - 分类B--- 并列分类 front-mattercategories: - [分类A] - [分类B] 多级+并列分类 front-mattercategories: - [分类A, 分类B] - [分类C, 分类D] 文章摘要在文章中插入 <!-- more -->，前面的部分即为摘要。 某篇文章源码---title: xxxdate: 2020-02-21---这是摘要<!-- more -->这是正文 注意： <!-- more --> 前后一定要有空行，不然可能导致显示错位。 设置文章作者Volantis 支持多个作者在一个站点发布文章，其他作者信息需要写在数据文件中，例如： blog/source/_data/author.ymlJon: name: Jon Snow avatar: https://cn.bing.com/th?id=AMMS_fc8f99fd41ebd737a71c4e13806db9a0&w=110&h=110&c=7&rs=1&qlt=80&pcl=f9f9f9&cdv=1&dpr=2&pid=16.1 url: https://gameofthrones.fandom.com/wiki/Jon_SnowDany: name: Daenerys Targaryen avatar: https://tse1-mm.cn.bing.net/th?id=OIP.Yax4wLzIFbcBVUa_RsKywQHaLH&w=80&h=80&c=8&rs=1&qlt=90&dpr=2&pid=3.1&rm=2 url: https://gameofthrones.fandom.com/wiki/Daenerys_Targaryen 在文章的 front-matter 中新增 author 即可： front-matter---title: Jon Snow | Game of Thrones Wiki | Fandomauthor: Jon--- 引入外部文章利用 link，搭配自定义的文章作者信息，你可以在文章列表中显示外部文章或者网址，例如： blog/source/_data/author.ymlxaoxuu: name: xaoxuu avatar: https://cdn.jsdelivr.net/gh/xaoxuu/assets@master/avatar/avatar.png url: https://xaoxuu.com front-matter---layout: postdate: 2017-07-05title: [转]如何搭建基于Hexo的独立博客categories: [Dev, Hexo]tags: - Hexoauthor: xaoxuulink: https://xaoxuu.com/blog/2017-07-05-hexo-blog/---![](https://img.vim-cn.com/d9/a9af7dc49fc0af8ca3e6dd2450a2f7095a87db.png) 置顶对于任何文章或者页面，设置 pin: true 即可置顶在首页。 front-matter---pin: true--- 这会导致一个小问题：首页 post 卡片数量多于设定值，如果有强迫症希望每一个分页数量一致，可以安装插件来实现，详见：#421 不归档存放在 _posts 文件夹下的文章一般都会出现在归档页，如果某篇文章不希望出现在归档页面： front-matter---archive: false--- 页面自定义布局显示迷你音乐播放器标题右边显示迷你音乐播放器，支持的字段有：server、type、id。 front-matter---music: server: netease # netease, tencent, kugou, xiami, baidu type: song # song, playlist, album, search, artist id: 16846091 # song id / playlist id / album id / search keyword--- 实际效果见： #contributors 显示 meta 标签文章顶部和底部的日期、分类、更新日期、标签、分享等属于 meta 标签。 front-matter---top_meta: falsebottom_meta: false--- 如果一个页面没有 title 则不会显示 top_meta ，像404、关于页面就可以完全隐藏： front-matter---seo_title: 关于top_meta: falsebottom_meta: false--- 标题右边显示缩略图front-matter---thumbnail: https://img.vim-cn.com/17/0c7b02722686d1527a1df807dae0794d995860.png--- 缩略图仅在文章列表和文章页面显示，不会在归档页面显示。 标题右边显示图标front-matter---icons: [fas fa-fire red, fas fa-star green]--- 图标仅在归档页面中显示，可以用来标注热门文章。 可以通过 red / blue / green / yellow / orange / theme / accent 来设置图标的颜色 是否要显示封面如果某个页面需要封面，可以这样写： front-matter---cover: true--- 显示侧边栏通过自由设置边栏卡片来删减对应页面的冗余信息，提高有价值的信息在页面中的权重。 如果某个页面不需要侧边栏，可以这样写： front-matter---sidebar: []--- 某个页面想指定显示某几个侧边栏，就这样写: front-matter---sidebar: [grid, toc, tags] # 放置任何你想要显示的侧边栏部件--- 关闭评论front-matter---comments: false--- 渲染公式默认是不渲染的，如果文章内有公式，需要在 front-matter 中设置开启。即便开启了，文章列表中也不会进行渲染，请注意不要把公式写在文章开头。 example.md:---title: 渲染公式（MathJax）date: 2020-02-23mathjax: true # false: 不渲染, true: 渲染---添加一段描述性文字<!-- more -->$$t+1=2$$$$\\mbox{积累因子}=\\begin{cases}1+ni & \\mbox{单利}\\\\\\\\(1+i)^n & \\mbox{复利}\\end{cases}$$$$\\begin{equation}\\sum_{i=0}^n F_i \\cdot \\phi (H, p_i) - \\sum_{i=1}^n a_i \\cdot ( \\tilde{x_i}, \\tilde{y_i}) + b_i \\cdot ( \\tilde{x_i}^2 , \\tilde{y_i}^2 )\\end{equation}$$$$\\begin{equation}\\beta^*(D) = \\mathop{argmin} \\limits_{\\beta} \\lambda {||\\beta||}^2 + \\sum_{i=1}^n max(0, 1 - y_i f_{\\beta}(x_i))\\end{equation}$$ 查看公式渲染效果 $$t+1=2$$$$\\mbox{积累因子}=\\begin{cases}1+ni & \\mbox{单利}\\\\(1+i)^n & \\mbox{复利}\\end{cases}$$$$\\begin{equation}\\sum_{i=0}^n F_i \\cdot \\phi (H, p_i) - \\sum_{i=1}^n a_i \\cdot ( \\tilde{x_i}, \\tilde{y_i}) + b_i \\cdot ( \\tilde{x_i}^2 , \\tilde{y_i}^2 )\\end{equation}$$$$\\begin{equation}\\beta^*(D) = \\mathop{argmin} \\limits_{\\beta} \\lambda {||\\beta||}^2 + \\sum_{i=1}^n max(0, 1 - y_i f_{\\beta}(x_i))\\end{equation}$$ 如果公式仍无法正确渲染可以阅读 @MicDZ 的这篇文章： 在Material-X上使用KaTeXhttps://www.micdz.cn/article/katex-on-volantis/"},{"title":"站点配置","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v4/site-settings/index.html","permalink":"https://volantis.js.org/v4/site-settings/","excerpt":"","text":"博客根目录下的 _config.yml 文件通常负责站点相关配置、第三方 npm 插件相关的配置。 网站标题blog/_config.yml# 网站标题title: my blog 网站图标简单方式完全自定义blog/_config.yml# 网站图标，更多尺寸等图标请使用import方式批量导入favicon: https://cdn.jsdelivr.net/gh/xaoxuu/assets@master/favicon/favicon.icoblog/_config.ymlimport: meta: - <meta name="msapplication-TileColor" content="#ffffff"> - <meta name="msapplication-config" content="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/browserconfig.xml"> - <meta name="theme-color" content="#ffffff"> link: - <link rel="apple-touch-icon" sizes="180x180" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/apple-touch-icon.png"> - <link rel="icon" type="image/png" sizes="32x32" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-32x32.png"> - <link rel="icon" type="image/png" sizes="16x16" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-16x16.png"> - <link rel="manifest" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/site.webmanifest"> - <link rel="mask-icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/safari-pinned-tab.svg" color="#5bbad5"> - <link rel="shortcut icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon.ico"> 多语言设置blog/_config.ymllanguage: - zh-CN - en - zh-HK - zh-TW 对应的翻译文件路径： themes/volantis/languages/ 使用 Import 导入外部文件Volantis 用户可以在不修改主题文件的情况下向 head 和 body 中添加各种标签。meta 和 link 对应 head 中的 <meta> 和 <link> 标签。script 可以在 body 末尾导入 js 代码。 blog/_config.ymlimport: meta: - <meta name="msapplication-TileColor" content="#ffffff"> - <meta name="msapplication-config" content="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/browserconfig.xml"> - <meta name="theme-color" content="#ffffff"> link: - <link rel="apple-touch-icon" sizes="180x180" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/apple-touch-icon.png"> - <link rel="icon" type="image/png" sizes="32x32" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-32x32.png"> - <link rel="icon" type="image/png" sizes="16x16" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-16x16.png"> - <link rel="manifest" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/site.webmanifest"> - <link rel="mask-icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/safari-pinned-tab.svg" color="#5bbad5"> - <link rel="shortcut icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon.ico"> script: - <script></script> 更多Hexo 官方文档 #配置https://hexo.io/zh-cn/docs/configuration"},{"title":"进阶设定","date":"2021-05-17T08:08:37.083Z","updated":"2021-05-17T08:08:37.083Z","comments":true,"path":"v5/advanced-settings/index.html","permalink":"https://volantis.js.org/v5/advanced-settings/","excerpt":"","text":"设置子模块 将主题添加为子模块 git submodule add https://github.com/volantis-x/hexo-theme-volantis.git themes/volantis 多人协同默认的作者信息在主题配置文件中设置： blog/themes/volantis/_config.yml# 文章布局article: ... body: ... meta_library: author: avatar: name: 请设置文章作者 url: / Volantis 支持多个作者在一个站点发布文章，其他作者信息需要写在数据文件中，例如： blog/source/_data/author.ymlJon: name: Jon Snow avatar: https://cn.bing.com/th?id=AMMS_fc8f99fd41ebd737a71c4e13806db9a0&w=110&h=110&c=7&rs=1&qlt=80&pcl=f9f9f9&cdv=1&dpr=2&pid=16.1 url: https://gameofthrones.fandom.com/wiki/Jon_SnowDany: name: Daenerys Targaryen avatar: https://tse1-mm.cn.bing.net/th?id=OIP.Yax4wLzIFbcBVUa_RsKywQHaLH&w=80&h=80&c=8&rs=1&qlt=90&dpr=2&pid=3.1&rm=2 url: https://gameofthrones.fandom.com/wiki/Daenerys_Targaryen 在文章的 front-matter 中新增 author 即可： ---title: Jon Snow | Game of Thrones Wiki | Fandomauthor: Jon--- 为网站提速加载速度 减少不必要的 js 插件，例如字数统计、动态背景。 查找并解决拖慢速度的资源，以 Chrome 浏览器为例： 页面中点击右键，选择「检查」。 在右边的窗口中「Network」选项卡，并勾选「Disable cache」。 刷新网页，查看加载速度慢的资源。 加载缓慢的图片，建议使用 CDN。 加载缓慢的可以不用的 js 插件，建议舍弃。 加载缓慢却必须使用的 js 插件，建议下载并自己上传至 jsdelivr。 运行速度 访问具有动态特效背景（如雪花、粒子等）的网站时，手机很快会发烫变卡，笔记本很快会风扇狂转并且浏览器提示建议关闭此页面。如果你希望网站有好的使用体验请尽量不要安装这类插件。 优化 SEOblog/_config.volantis.ymlseo: # When there are no keywords in the article's front-matter, use tags as keywords. use_tags_as_keywords: true # When there is no description in the article's front-matter, use excerpt as the description. use_excerpt_as_description: true robots: home_first_page: index,follow home_other_pages: noindex,follow archive: noindex,follow category: noindex,follow tag: noindex,follow # robots can be written in front-matter 在 front-matter 中，可以设置 keywords、description、robots 和 seo_title。其中 seo_title 仅仅用作网页标题，优先级高于 title。 文章内部不要使用 H1 标题。 通过死链检测工具检查并删除无法访问的链接。 安装 SEO 优化插件： hexo-autonofollowhttps://github.com/liuzc/hexo-autonofollow hexo-generator-seo-friendly-sitemaphttps://github.com/ludoviclefevre/hexo-generator-seo-friendly-sitemap 页面不要堆砌关键词，不要频繁更改路径。 使用 CDN对于大部分将博客 deploy 到 GitHub 的用户来说，直接加载本地资源速度比较慢，可以使用 jsdelivr 为开源项目提供的 CDN 服务。 开启方法blog/_config.volantis.yml# 本地静态文件使用jsdelivr的min版本加速 https://www.jsdelivr.com/features# 默认使用 https://cdn.jsdelivr.net/npm/hexo-theme-volantis@<%- theme.info.theme_version %>/source/js/*.min.js 的CDN压缩版本(min.js)，注意版本号对应关系！！可以通过修改以下配置项覆盖# 开发者注意 cdn.enable 设置为 falsecdn: enable: false prefix: # CDN 前缀，为空使用默认值，链接最后不加 "/",例如： https://cdn.jsdelivr.net/gh/volantis-x/volantis-x.github.io@gh-page 填写最后编译生成的源码CDN地址前缀，此路径下应该含有/js与/css目录,该配置默认值是："https://cdn.jsdelivr.net/npm/hexo-theme-volantis@"+ theme.info.theme_version +"/source" # 以下配置可以覆盖 cdn.prefix,配置项的值可以为空，但是要使用CDN必须依据路径填写配置项的键 set: js: app: #/js/app.js css: style: #/css/style.css # (异步加载样式) 如果你需要对样式进行 DIY，可以只关闭 style 文件的 CDN。 从V5版本开始，首屏样式采用硬编码的方式写在HTML中。首屏样式内含 cover navbar search 的样式，其他样式放入/css/style.css异步加载。 如果你需要对样式进行 DIY，请注意首屏渲染和异步延迟加载的差异。 可以对 style.css 使用 HTTP/2 Server Push，但是此方案并不推荐。我们已经对style.css进行了preload处理，推荐使用对服务器压力成本较小的 CDN 服务。 自定义 CDN如果你把对应的文件上传到自己的 CDN 服务器，可以把对应的链接改为自己的 CDN 链接。 尝试使用 Terser 压缩 ES6安装压缩工具npm install -g gulpnpm install --save-dev gulp gulp-html-minifier-terser gulp-htmlclean gulp-htmlmin gulp-minify-css gulp-terser gulp 配置文件 gulp 配置文件 blog/gulpfile.jsvar gulp = require('gulp');var minifycss = require('gulp-minify-css');var htmlmin = require('gulp-html-minifier-terser');var htmlclean = require('gulp-htmlclean');var terser = require('gulp-terser');// 压缩css文件const minify_css = () => ( gulp.src(['./public/**/*.css']) .pipe(minifycss()) .pipe(gulp.dest('./public')));// 压缩html文件const minify_html = () => ( gulp.src(['./public/**/*.html','!./public/{lib,lib/**}']) .pipe(htmlclean()) .pipe(htmlmin({ removeComments: true, minifyJS: true, minifyCSS: true, minifyURLs: true, })) .pipe(gulp.dest('./public')))// 压缩js文件const minify_js = () => ( gulp.src(['./public/**/*.js', '!./public/**/*.min.js','!./public/{lib,lib/**}']) .pipe(terser()) .pipe(gulp.dest('./public')))module.exports = { minify_html: minify_html, minify_css: minify_css, minify_js: minify_js};gulp.task('one', gulp.parallel( minify_html, minify_css, minify_js))gulp.task('default', gulp.series('one')); 运行压缩gulp 安装 Service Worker 服务方案一 安装插件安装 hexo-offline-popup 或者 hexo-offline 插件，初次加载速度不变，后期切换页面和刷新网页速度越来越快。 方案二 使用 workbox 自定义配置 step 1. 修改 blog/_config.yml 文件。 blog/_config.yml# 全局导入import: script: - <script>"serviceWorker"in navigator&&navigator.serviceWorker.register("/sw.js").then(function(n){n.onupdatefound=function(){var e=n.installing;e.onstatechange=function(){switch(e.state){case"installed":navigator.serviceWorker.controller?console.log("Updated serviceWorker."):console.log("serviceWorker Sucess!");break;case"redundant":console.log("The installing service worker became redundant.")}}}}).catch(function(e){console.log("Error during service worker registration:",e)}); </script> step 2. 在 blog/source 中创建 sw.js 文件。 blog/source/sw.jsimportScripts('https://cdn.jsdelivr.net/npm/workbox-cdn@5.1.3/workbox/workbox-sw.js');workbox.setConfig({ modulePathPrefix: 'https://cdn.jsdelivr.net/npm/workbox-cdn@5.1.3/workbox/'});const { core, precaching, routing, strategies, expiration, cacheableResponse, backgroundSync } = workbox;const { CacheFirst, NetworkFirst, NetworkOnly, StaleWhileRevalidate } = strategies;const { ExpirationPlugin } = expiration;const { CacheableResponsePlugin } = cacheableResponse;const cacheSuffixVersion = '-000010', // 缓存版本号 极端重要，修改静态文件后发布网页一定要修改缓存版本号 maxEntries = 100;self.addEventListener('activate', (event) => { event.waitUntil( caches.keys().then((keys) => { return Promise.all(keys.map((key) => { if (!key.includes(cacheSuffixVersion)) return caches.delete(key); })); }) );});core.setCacheNameDetails({ prefix: 'volantis', // 极端重要 自己拟定一个名字 suffix: cacheSuffixVersion});core.skipWaiting();core.clientsClaim();precaching.cleanupOutdatedCaches();/* * Precache * - Static Assets */precaching.precacheAndRoute( // 极端重要 定义首次缓存的静态文件 如果开启CDN需要修改为CDN链接 [ { url: '/css/first.css', revision: null }, { url: '/css/style.css', revision: null }, { url: '/js/app.js', revision: null }, ],);/* * Cache File From CDN * * Method: CacheFirst * cacheName: static-immutable * cacheTime: 30d */// cdn.jsdelivr.net - cors enabledrouting.registerRoute( /.*cdn\\.jsdelivr\\.net/, new CacheFirst({ cacheName: 'static-immutable' + cacheSuffixVersion, fetchOptions: { mode: 'cors', credentials: 'omit' }, plugins: [ new ExpirationPlugin({ maxAgeSeconds: 30 * 24 * 60 * 60, purgeOnQuotaError: true }) ] }));// m7.music.126.net - cors enabledrouting.registerRoute( /.*m7\\.music\\.126\\.net/, new CacheFirst({ cacheName: 'static-immutable' + cacheSuffixVersion, fetchOptions: { mode: 'cors', credentials: 'omit' }, plugins: [ new ExpirationPlugin({ maxAgeSeconds: 30 * 24 * 60 * 60, purgeOnQuotaError: true }) ] }));/* * No Cache * * Method: networkOnly */routing.registerRoute( /.*baidu\\.com.*/, new NetworkOnly());/* * Others img fonts * Method: staleWhileRevalidate */routing.registerRoute( // Cache image fonts files /.*\\.(?:png|jpg|jpeg|svg|gif|webp|ico|eot|ttf|woff|woff2|mp3)/, new StaleWhileRevalidate());/* * Static Assets * Method: staleWhileRevalidate */routing.registerRoute( // Cache CSS files /.*\\.(css|js)/, // Use cache but update in the background ASAP new StaleWhileRevalidate());/* * sw.js - Revalidate every time * staleWhileRevalidate */routing.registerRoute( '/sw.js', // 本文件名 new StaleWhileRevalidate());/* * Default - Serve as it is * networkFirst */routing.setDefaultHandler( new NetworkFirst({ networkTimeoutSeconds: 3 })); 如果你使用了此方案，修改静态文件后发布网页一定要修改缓存版本号。 安装「相关文章」插件 安装插件 npm i -S hexo-related-popular-posts 插件的自定义配置方法： hexo-related-popular-postshttps://github.com/tea3/hexo-related-popular-posts 如果您使用了头图，可以在站点配置文件中添加以下设置来让相关文章显示正确的文章头图： blog/_config.ymlpopularPosts: eyeCatchImageAttributeName: headimg 注意需要升级到 5.0.1 及以上版本才可以支持自定义头图，详见 #29 分析与统计默认支持 不蒜子 的访问统计，可以自行添加百度统计和 Google Analytics。 字数和阅读时长 安装以下插件：npm i --save hexo-wordcount 修改配置文件，将 wordcount 插件打开blog/_config.volantis.ymlplugins: ... # 文章字数统计、阅读时长，开启需要安装插件: npm i --save hexo-wordcount wordcount: enable: #true 然后修改配置文件，将 wordcount 写入需要显示的 meta 位置：blog/_config.volantis.yml# 文章布局article: ... # 文章详情页面的文章卡片本体布局方案 body: # 文章顶部信息 # 从 meta_library 中取 top_meta: [..., wordcount, ...] ... # 文章底部信息 # 从 meta_library 中取 bottom_meta: [..., wordcount, ...] CNZZ 统计请参考 ZYMIN 的这篇教程： Hexo hexo+ejs+material x 添加CNZZ统计代码https://zymin.cn/arcticle/hexo+ejs+material.html 更多进阶玩法详见 @TRHX 的这篇博客： Hexo 博客主题个性化https://www.itrhx.com/2018/08/27/A04-Hexo-blog-topic-personalization/ 内含卡片半透明、增加卡通人物、自定义鼠标样式、鼠标特效、烟花特效、彩色滚动字体、网站运行时间、动态浏览器标题、雪花飘落特效等多种详细教程。 主题官网 #进阶玩法https://volantis.js.org/categories/进阶玩法/"},{"title":"开发文档","date":"2021-05-17T08:08:37.083Z","updated":"2021-05-17T08:08:37.083Z","comments":true,"path":"v5/development-api/index.html","permalink":"https://volantis.js.org/v5/development-api/","excerpt":"","text":" Volantis5 Development API for Volantis 全局变量 volantis我们提供了全局变量 volantis 和一些全局函数等主题开发调用接口。 源码参考：layout/_partial/scripts/global.ejs PjaxPjax 重载区域划分接口我们提供了可以实现Pjax重载区域灵活划分的开发接口。 源码参考：layout/_third-party/pjax/index.ejs <pjax></pjax> 标签所有被 <pjax></pjax> 标签包裹的所有元素将被pjax重载。 <pjax> <!--我是将被pjax重载的内容 begin--> <div> <div></div> <script></script> </div> <!--我是将被pjax重载的内容 end--></pjax> 使用案例：layout/_partial/snackbar.ejs script[data-pjax]所有含有 data-pjax 标记的 script 标签将被pjax重载。 <script data-pjax>我是将被pjax重载的内容</script> .pjax-reload script所有在 pjax-reload Class元素内部的 script 标签将被pjax重载。 <div class="pjax-reload"> <div> <div>我不是将被pjax重载的内容</div> <script>我是将被pjax重载的内容</script> </div></div> Pjax 回调方法我们提供了灵活的 Pjax 回调方法。 源码参考： layout/_partial/scripts/global.ejs layout/_third-party/pjax/index.ejs 使用案例：layout/_third-party/pjax/animate.ejs 中括号[]里面的内容表示选项是可选的，可以不填。下同，不再赘述。 volantis.pjax.push 在Pjax请求完成后触发。使用 volantis.pjax.push(callBack[,"callBackName"]) 传入pjax:complete回调函数。 callBack是回调函数,必填。 "callBackName" string类型 默认值是回调函数的函数名，选填。 volantis.pjax.send 在Pjax请求开始后触发。使用 volantis.pjax.send(callBack[,"callBackName"]) 传入pjax:send回调函数。 callBack是回调函数,必填。 "callBackName" string类型 默认值是回调函数的函数名，选填。 volantis.pjax.error 在Pjax请求失败后触发。使用 volantis.pjax.error(callBack[,"callBackName"]) 传入pjax:error回调函数。 callBack是回调函数,必填。 "callBackName" string类型 默认值是回调函数的函数名，选填。 暗黑模式我们提供了暗黑模式灵活的开发接口。 源码参考： layout/_partial/scripts/global.ejs layout/_partial/scripts/darkmode.ejs 暗黑模式样式详见：source/css/_plugins/dark.styl 当前模式调用 volantis.dark.mode 查看当前模式。返回值为字符串 dark 或者 light。 暗黑模式触发器调用 volantis.dark.toggle() 触发切换亮黑模式。 暗黑模式触发器回调函数调用 volantis.dark.push(callBack[,"callBackName"]) 传入触发器回调函数. 使用案例：layout/_third-party/comments/utterances/script.ejs Message 消息提示我们提供了 Message 消息提示灵活的开发接口。 源码参考： layout/_partial/scripts/global.ejs layout/_third-party/message/script.ejs volantis.message("title","message","type",autoClose,time) 参数都是String类型，可选的。 title 标题 message 信息 type 图标类型 【info、warning、error、question】 autoClose 自动关闭 time 显示时间，默认3秒 动态加载脚本源码参考： layout/_partial/scripts/global.ejs volantis.js("src", cb)volantis.css("src") src String类型 加载脚本URL cb 可选 可以传入onload回调函数 或者 JSON对象 例如: volantis.js("src", ()=>{}) 或 volantis.js("src", {defer:true,onload:()=>{}}) 返回 Promise 对象 如下方法同步加载资源，这利于处理文件资源之间的依赖关系，例如：APlayer 需要在 MetingJS 之前加载 (async () => { await volantis.js("...theme.plugins.aplayer.js.aplayer...") await volantis.js("...theme.plugins.aplayer.js.meting...")})(); 使用案例：layout/_third-party/aplayer/script.ejs 由于返回的是 Promise 对象，也可以采用以下方式实现加载完成后调用回调函数： volantis.js("https://cdn.jsdelivr.net/npm/jquery").then(()=>{ console.log("我在脚本加载完成后调用")}) 对本地文件使用CDN源码参考： layout/_partial/scripts/cdnCtrl.ejs theme.cdn.addJS("name","source","force")theme.cdn.addCSS("name","source","force") 参数都为 String 类型，其中 source 和 force 是可选的。 返回值为 CDN 处理后的链接，并存入theme.cdn.map.js和theme.cdn.map.css中 可以使用theme.cdn.map.js["name"]再次调用。 "name" 是自定义名称 "source" 是资源路径 "force" 是强制覆盖的资源路径 如果"source"为空，则将"name"赋值给"source"。 例如： 对于文件source/js/plugins/sites.js使用CND链接，使用如下方法生成。 theme.cdn.addJS("sites","plugins/sites") 生成的CDN链接可使用 theme.cdn.map.js.sites 回调。 以下用于配置项 cdn.set 覆盖配置,下面是覆盖配置的方法 cdn: enable: true # 以下配置可以覆盖 cdn.prefix,配置项的值可以为空，但是要使用CDN必须依据路径填写配置项的键 set: js: app: https://cdn.jsdelivr.net/gh/volantis-x/volantis-x.github.io@gh-page/js/app.js rightMenu: https://cdn.jsdelivr.net/gh/volantis-x/volantis-x.github.io@gh-page/js/rightMenu.js parallax: https://cdn.jsdelivr.net/gh/volantis-x/volantis-x.github.io@gh-page/js/jquery.parallax.min.js plugins: contributors: https://cdn.jsdelivr.net/gh/volantis-x/volantis-x.github.io@gh-page/js/plugins/contributors.js friends: https://cdn.jsdelivr.net/gh/volantis-x/volantis-x.github.io@gh-page/js/plugins/friends.js sites: https://cdn.jsdelivr.net/gh/volantis-x/volantis-x.github.io@gh-page/js/plugins/sites.js css: style: https://cdn.jsdelivr.net/gh/volantis-x/volantis-x.github.io@gh-page/css/style.css message: https://cdn.jsdelivr.net/gh/volantis-x/volantis-x.github.io@gh-page/css/message.css 直接使用cdn配置项，不使用theme.cdn.addJS("sites","plugins/sites") 也可以生成 theme.cdn.map.js.sites CDN链接回调 请注意，以上是主题开发文档，不是使用文档！"},{"title":"","date":"2021-05-17T08:08:37.083Z","updated":"2021-05-17T08:08:37.083Z","comments":true,"path":"v5/getting-started/index.html","permalink":"https://volantis.js.org/v5/getting-started/","excerpt":"","text":" Volantis5 A Wonderful Theme for Hexo Volantis 是一个功能丰富、高度模块化的 Hexo 博客主题。得益于其强大的模块化特性，您可以轻松搭建一个极简风格的博客，也可以仿照官网搭建一个多人协作的、包含文档模块的大体量综合型博客。 示例博客https://volantis.js.org/examples/ 所有的 Volantis 用户都可以按照格式自行创建 Issue 来将自己的博客添加到官网的示例博客页面中。 准备工作能力条件环境配置条件自建博客需要一定的相关知识，在开始前，请务必确保您会使用 markdown 语法，掌握简单的 git 知识，最最重要的是，遇到困难知道该怎么寻求解决： 翻阅和搜索文档 搜索 issues 中是否有解决办法 新建 issue 并按照要求进行操作，详尽地描述您遇到的问题 如果您没有使用过 Hexo 也不要着急，可以先通读一遍 Hexo 中文文档，要想使用地得心应手，最好参照团队提供的开源项目的源码进行搭建： Demo 源码 ｜ 官网源码如果您从旧版本更新或着其它主题迁移，请确保环境版本不要太低，否则会产生兼容性问题。 Hexo: 4.2 ~ 5.xhexo-cli: 3.1 ~ 4.xnode.js: 12.16 ~ latest # 推荐使用 LTS 版npm: 6.13 ~ latest 快速体验如果您已经具备环境配置条件，可以在终端中输入下面这行代码，稍等片刻即可尝鲜体验： git clone https://github.com/volantis-x/demo.git && cd demo && npm i && hexo s 下载与安装全新博客安装从其它主题迁移第 1/2 步：修改站点配置文件 在 blog/_config.yml 文件中找到并修改：theme: volantis 第 2/2 步：下载主题 在终端中输入：npm i hexo-theme-volantis 如果您是 Mac 用户，可以使用脚本完成全部流程 在博客路径打开终端，下载安装并应用主题：curl -s https://volantis.js.org/start | bash这行命令将会自动检测并安装所需环境，初始化博客，然后下载安装并应用主题。脚本详细使用方法：#hexo.sh 第 1/3 步：修改站点配置文件 在 blog/_config.yml 文件中找到并修改：theme: volantis 第 2/3 步：下载主题 如果您已经升级到 Hexo 5.0.2 及以上，可以直接使用 npm 命令安装：npm i hexo-theme-volantis对于旧版本，需要下载主题源码到 themes/ 文件夹：git clone https://github.com/volantis-x/hexo-theme-volantis themes/volantis如果您无法访问 GitHub 可以使用国内镜像源：git clone https://e.coding.net/volantis-x/p/hexo-theme-volantis.git themes/volantis 第 3/3 步：检查并安装依赖 安装 Hexo 搜索的依赖包：npm i hexo-generator-search hexo-generator-json-content安装 Stylus 渲染器：npm i hexo-renderer-stylus 版本更新注意事项使用主题的时候，尽量 fork 主题到自己的 GitHub，然后进行修改并使用。这样做的好处是：当主题进行重要更新的时候可以根据需要拉取合并代码，使自己 DIY 的主题能够通过更新获取 BUG 修复或者新特性。 如果不懂请自行搜索关键词：fork 更新 实用小技巧所有需要写在主题配置文件中的配置都可以写在站点配置文件的 theme_config: 中，在 Hexo 5.0 后，还可以写在 _config.volantis.yml 文件中，详见 Hexo 官方文档：覆盖主题配置https://hexo.io/zh-cn/docs/configuration#%E8%A6%86%E7%9B%96%E4%B8%BB%E9%A2%98%E9%85%8D%E7%BD%AE也可以直接查看本站源码中站点配置文件的写法：_config.volantis.yml 请对照 更新日志 进行更新. 许可协议本主题采用 MIT开源许可协议 ，永久无限制免费使用。 MIT开源许可协议被授权人有权利使用、复制、修改、合并、出版发行、散布、再授权及贩售软件及软件的副本。被授权人可根据程式的需要修改授权条款为适当的内容。在软件和软件的所有副本中都必须包含版权声明和许可声明。 配置与使用配置与使用/v4/site-settings/"},{"title":"页面配置","date":"2021-05-17T08:08:37.083Z","updated":"2021-05-17T08:08:37.083Z","comments":true,"path":"v5/page-settings/index.html","permalink":"https://volantis.js.org/v5/page-settings/","excerpt":"","text":"页面布局模板布局模板 取值 含义 page 独立页面 post 文章页面 docs 文档页面 category 分类页面 tag 标签页面 friends 友链页面 list 列表页面 artitalk 说说页面 page & post & docs这三种页面相同，但是有以下细微区别： post 文章有 title 时，向下滚动网页，导航栏会向上移出屏幕显出文章标题，而 page 和 docs 不会。 post 文章末尾最多可以显示「参考资料」、「相关文章」、「版权标识」、「打赏」四个模块。 docs 文章末尾最多可以显示「参考资料」一个模块。 除了归档页面是自动生成的，其它独立页面都需要手动创建 md 文件。 归档页面归档页面是自动生成的，并且初始化的时候已经生成，路径如下： blog/_config.yml# Directoryarchive_dir: archives 关于页面Create file if not exists: source/about/index.md---layout: docsseo_title: 关于bottom_meta: falsesidebar: []valine: placeholder: 有什么想对我说的呢？---下面写关于自己的内容 分类页面Create file if not exists: source/categories/index.md---layout: categoryindex: truetitle: 所有分类--- 标签页面Create file if not exists: source/tags/index.md---layout: tagindex: truetitle: 所有标签--- 列表页面Create file if not exists: source/mylist/index.md---layout: listgroup: mylistindex: true--- 结果就是筛选出所有文章中 front-matter 部分含有 group: mylist 的文章。 友链页面创建页面文件Create file if not exists: source/friends/index.md---layout: friends # 必须title: 我的朋友们 # 可选，这是友链页的标题---这里写友链上方的内容。<!-- more -->这里可以写友链页面下方的文字备注，例如自己的友链规范、示例等。 选择布局方案在主题配置文件中找到以下内容： pages: # 友链页面配置 friends: layout_scheme: traditional # simple: 简单布局, traditional: 传统布局, sites: 网站卡片布局 目前提供三种布局方案： simple: 简单布局，只有头像和标题。 traditional: 传统布局，是 Volantis 旧版本的风格。 sites: 网站卡片布局，是 Volantis 4.x 新增的网站卡片标签的样式。 设置数据源静态数据源动态数据源友链的数据源写在以下路径，如果没有请自行创建： blog/source/_data/friends.yml 内容格式为： blog/source/_data/friends.yml- group: # 分组标题 description: # 分组描述 items: - title: # 名称 avatar: # 头像 url: # 链接 screenshot: # 截图 keywords: # 关键词 description: # 描述 - title: # 名称 avatar: # 头像 url: # 链接 screenshot: # 截图 keywords: # 关键词 description: # 描述 不同的布局方式，会用到一部分的字段，一般来说，title、avatar 和 url 都是必须的。这些数据被转成 HTML 标签插入到友链页面的 <!-- more --> 部分。使用 issues 标签可以从 issues 中获取 JSON 数据解析并生成 HTML 填充到页面中，使用方法如下： {% issues sites | api=https://api.github.com/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=active %} 这样添加友链的方式就变成了：对方提 Issue ，自己审核，然后添加 active 标签，然后刷新网页就生效了。更新友链内容也变得十分方便， Issue 的创建者拥有修改和关闭的权限。 新建一个 GitHub 或者 Gitee 仓库，创建 Issues 模板，如下： { "title": "", "screenshot": "", "url": "", "avatar": "", "description": "", "keywords": ""} 关于如何使用 issues 标签，详见这篇文章： 静态博客使用 Issues API 发布动态、友链、书签https://xaoxuu.com/blog/2020-08-23-issues-api/ 建议两者是可以同时使用的哦，建议开放 issues 友链给大家，常联系的自己再保存到静态友链。实测 GitHub API 速度和稳定性不如 Gitee ，如果追求稳定建议使用 Gitee。 Artitalk页面创建页面文件Create file if not exists: source/artitalk/index.md---layout: artitalkseo_title: 说说comments: false--- 配置Artitalk在主题配置文件中找到以下内容 artitalk: # Set `layout: artitalk` to enable in page # 配置项按照yml格式继续填写即可 appId: # your appID appKey: # your appKEY # serverURL: #leancloud绑定的安全域名，使用国际版的话不需要填写 # lang: # 语言设置，zh为汉语，en为英语，es为西班牙语。默认为汉语 # pageSize: #每页说说的显示数量 # shuoPla: #在编辑说说的输入框中的占位符 # avatarPla: #自定义头像url的输入框的占位符 # motion: #加载动画的开关，1为开，0为关，默认为开 # bgImg: #说说输入框背景图片url # color1: #说说背景颜色1&按钮颜色1 # color2: #说说背景颜色2&按钮颜色2 # color3: #说说字体颜色 # cssUrl: #自定义css接口 最后记得屏蔽Artitalk页面的pjax 404页面Create file if not exists: source/404.md---cover: truerobots: noindex,nofollowsitemap: falseseo_title: 404 Not Foundbottom_meta: falsesidebar: []valine: path: /404.html placeholder: 请留言告诉我您要访问哪个页面找不到了---{% p logo center huge, 404 %}{% p center bold, 很抱歉，您访问的页面不存在 %}{% p center small, 可能是输入地址有误或该地址已被删除 %} front-matterfront-matter 是文件最上方以 --- 分隔的区域，用于指定个别文件的变量。更多请见 Hexo 官方文档：#front-matter 字段 含义 值类型 默认值 layout 布局模版 String - title 页面标题 String - seo_title 网页标题 String page.title short_title 页面标题（在group列表中显示） String page.title date 创建时间 Date 文件创建时间 updated 更新日期 Date 文件修改时间 link 外部文章网址 String - music 内部音乐控件 [Object] - robots robots String - keywords 页面关键词 String - description 页面描述、摘要 String - cover 是否显示封面 Bool true top_meta 是否显示文章或页面顶部的meta信息 Bool true bottom_meta 是否显示文章或页面底部的meta信息 Bool true sidebar 页面侧边栏 Bool, Array theme.layout.*.sidebar body 页面主体元素 Array theme.layout.on_page.body mathjax 是否渲染公式 Bool, String false thumbnail 缩略图 String false icons 图标 Array [] pin 是否置顶 Bool false headimg 文章头图 url - layout:post 时特有的字段： 字段 含义 值类型 默认值 author 文章作者 [Object] config.author categories 分类 String, Array - tags 标签 String, Array - toc 是否生成目录 Bool true music 字段 是否必须 值类型 server 是 netease, tencent, kugou, xiami, baidu type 是 song, playlist, album, search, artist id 是 song id / playlist id / album id / search keyword 文章置顶在 front-matter 中设置以下值： front-matterpin: true 文章分类多个分类有两种关系，一种是层级（等同于文件夹），一种是并列（等同于标签）。 多级分类： front-matter---categories: [分类A, 分类B]--- 或者 front-matter---categories: - 分类A - 分类B--- 并列分类 front-mattercategories: - [分类A] - [分类B] 多级+并列分类 front-mattercategories: - [分类A, 分类B] - [分类C, 分类D] 文章摘要在文章中插入 <!-- more -->，前面的部分即为摘要。 某篇文章源码---title: xxxdate: 2020-02-21---这是摘要<!-- more -->这是正文 注意： <!-- more --> 前后一定要有空行，不然可能导致显示错位。 设置文章作者Volantis 支持多个作者在一个站点发布文章，其他作者信息需要写在数据文件中，例如： blog/source/_data/author.ymlJon: name: Jon Snow avatar: https://cn.bing.com/th?id=AMMS_fc8f99fd41ebd737a71c4e13806db9a0&w=110&h=110&c=7&rs=1&qlt=80&pcl=f9f9f9&cdv=1&dpr=2&pid=16.1 url: https://gameofthrones.fandom.com/wiki/Jon_SnowDany: name: Daenerys Targaryen avatar: https://tse1-mm.cn.bing.net/th?id=OIP.Yax4wLzIFbcBVUa_RsKywQHaLH&w=80&h=80&c=8&rs=1&qlt=90&dpr=2&pid=3.1&rm=2 url: https://gameofthrones.fandom.com/wiki/Daenerys_Targaryen 在文章的 front-matter 中新增 author 即可： front-matter---title: Jon Snow | Game of Thrones Wiki | Fandomauthor: Jon--- 引入外部文章利用 link，搭配自定义的文章作者信息，你可以在文章列表中显示外部文章或者网址，例如： blog/source/_data/author.ymlxaoxuu: name: xaoxuu avatar: https://cdn.jsdelivr.net/gh/xaoxuu/assets@master/avatar/avatar.png url: https://xaoxuu.com front-matter---layout: postdate: 2017-07-05title: [转]如何搭建基于Hexo的独立博客categories: [Dev, Hexo]tags: - Hexoauthor: xaoxuulink: https://xaoxuu.com/blog/2017-07-05-hexo-blog/---![](https://img.vim-cn.com/d9/a9af7dc49fc0af8ca3e6dd2450a2f7095a87db.png) 置顶对于任何文章或者页面，设置 pin: true 即可置顶在首页。 front-matter---pin: true--- 这会导致一个小问题：首页 post 卡片数量多于设定值，如果有强迫症希望每一个分页数量一致，可以安装插件来实现，详见：#421 不归档存放在 _posts 文件夹下的文章一般都会出现在归档页，如果某篇文章不希望出现在归档页面： front-matter---archive: false--- 页面自定义布局显示迷你音乐播放器标题右边显示迷你音乐播放器，支持的字段有：server、type、id。 front-matter---music: server: netease # netease, tencent, kugou, xiami, baidu type: song # song, playlist, album, search, artist id: 16846091 # song id / playlist id / album id / search keyword--- 实际效果见： #contributors 显示 meta 标签文章顶部和底部的日期、分类、更新日期、标签、分享等属于 meta 标签。 front-matter---top_meta: falsebottom_meta: false--- 如果一个页面没有 title 则不会显示 top_meta ，像404、关于页面就可以完全隐藏： front-matter---seo_title: 关于top_meta: falsebottom_meta: false--- 标题右边显示缩略图front-matter---thumbnail: https://img.vim-cn.com/17/0c7b02722686d1527a1df807dae0794d995860.png--- 缩略图仅在文章列表和文章页面显示，不会在归档页面显示。 标题右边显示图标front-matter---icons: [fas fa-fire red, fas fa-star green]--- 图标仅在归档页面中显示，可以用来标注热门文章。 可以通过 red / blue / green / yellow / orange / theme / accent 来设置图标的颜色 是否要显示封面如果某个页面需要封面，可以这样写： front-matter---cover: true--- 显示侧边栏通过自由设置边栏卡片来删减对应页面的冗余信息，提高有价值的信息在页面中的权重。 如果某个页面不需要侧边栏，可以这样写： front-matter---sidebar: []--- 某个页面想指定显示某几个侧边栏，就这样写: front-matter---sidebar: [grid, toc, tags] # 放置任何你想要显示的侧边栏部件--- 关闭评论front-matter---comments: false--- 渲染公式默认是不渲染的，如果文章内有公式，需要在 front-matter 中设置开启。即便开启了，文章列表中也不会进行渲染，请注意不要把公式写在文章开头。 example.md:---title: 渲染公式（MathJax）date: 2020-02-23mathjax: true # false: 不渲染, true: 渲染---添加一段描述性文字<!-- more -->$$t+1=2$$$$\\mbox{积累因子}=\\begin{cases}1+ni & \\mbox{单利}\\\\\\\\(1+i)^n & \\mbox{复利}\\end{cases}$$$$\\begin{equation}\\sum_{i=0}^n F_i \\cdot \\phi (H, p_i) - \\sum_{i=1}^n a_i \\cdot ( \\tilde{x_i}, \\tilde{y_i}) + b_i \\cdot ( \\tilde{x_i}^2 , \\tilde{y_i}^2 )\\end{equation}$$$$\\begin{equation}\\beta^*(D) = \\mathop{argmin} \\limits_{\\beta} \\lambda {||\\beta||}^2 + \\sum_{i=1}^n max(0, 1 - y_i f_{\\beta}(x_i))\\end{equation}$$ 查看公式渲染效果 $$t+1=2$$$$\\mbox{积累因子}=\\begin{cases}1+ni & \\mbox{单利}\\\\(1+i)^n & \\mbox{复利}\\end{cases}$$$$\\begin{equation}\\sum_{i=0}^n F_i \\cdot \\phi (H, p_i) - \\sum_{i=1}^n a_i \\cdot ( \\tilde{x_i}, \\tilde{y_i}) + b_i \\cdot ( \\tilde{x_i}^2 , \\tilde{y_i}^2 )\\end{equation}$$$$\\begin{equation}\\beta^*(D) = \\mathop{argmin} \\limits_{\\beta} \\lambda {||\\beta||}^2 + \\sum_{i=1}^n max(0, 1 - y_i f_{\\beta}(x_i))\\end{equation}$$ 如果公式仍无法正确渲染可以阅读 @MicDZ 的这篇文章： 在Material-X上使用KaTeXhttps://www.micdz.cn/article/katex-on-volantis/"},{"title":"站点配置","date":"2021-05-17T08:08:37.083Z","updated":"2021-05-17T08:08:37.083Z","comments":true,"path":"v5/site-settings/index.html","permalink":"https://volantis.js.org/v5/site-settings/","excerpt":"","text":"博客根目录下的 _config.yml 文件通常负责站点相关配置、第三方 npm 插件相关的配置。 网站标题blog/_config.yml# 网站标题title: my blog 网站图标简单方式完全自定义blog/_config.yml# 网站图标，更多尺寸等图标请使用import方式批量导入favicon: https://cdn.jsdelivr.net/gh/xaoxuu/assets@master/favicon/favicon.icoblog/_config.ymlimport: meta: - <meta name="msapplication-TileColor" content="#ffffff"> - <meta name="msapplication-config" content="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/browserconfig.xml"> - <meta name="theme-color" content="#ffffff"> link: - <link rel="apple-touch-icon" sizes="180x180" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/apple-touch-icon.png"> - <link rel="icon" type="image/png" sizes="32x32" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-32x32.png"> - <link rel="icon" type="image/png" sizes="16x16" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-16x16.png"> - <link rel="manifest" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/site.webmanifest"> - <link rel="mask-icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/safari-pinned-tab.svg" color="#5bbad5"> - <link rel="shortcut icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon.ico"> 多语言设置blog/_config.ymllanguage: - zh-CN - en - zh-HK - zh-TW 对应的翻译文件路径： themes/volantis/languages/ 使用 Import 导入外部文件Volantis 用户可以在不修改主题文件的情况下向 head 和 body 中添加各种标签。meta 和 link 对应 head 中的 <meta> 和 <link> 标签。script 可以在 body 末尾导入 js 代码。 blog/_config.ymlimport: meta: - <meta name="msapplication-TileColor" content="#ffffff"> - <meta name="msapplication-config" content="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/browserconfig.xml"> - <meta name="theme-color" content="#ffffff"> link: - <link rel="apple-touch-icon" sizes="180x180" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/apple-touch-icon.png"> - <link rel="icon" type="image/png" sizes="32x32" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-32x32.png"> - <link rel="icon" type="image/png" sizes="16x16" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-16x16.png"> - <link rel="manifest" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/site.webmanifest"> - <link rel="mask-icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/safari-pinned-tab.svg" color="#5bbad5"> - <link rel="shortcut icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon.ico"> script: - <script></script> 更多Hexo 官方文档 #配置https://hexo.io/zh-cn/docs/configuration"},{"title":"页面自定义布局","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/page-settings/body/index.html","permalink":"https://volantis.js.org/v3/page-settings/body/","excerpt":"","text":"正文布局默认是文章+评论： front-matter---body: [article, comments]--- 如果你想把相关文章卡片显示在评论前，可以这样写： front-matter---body: [article, related_posts, comments]--- 如果想全局修改，在主题配置文件中的 layout.on_page.body 中设置。 显示迷你音乐播放器标题右边显示迷你音乐播放器，支持的字段有：server、type、id。 front-matter---music: server: netease # netease, tencent, kugou, xiami, baidu type: song # song, playlist, album, search, artist id: 16846091 # song id / playlist id / album id / search keyword--- 实际效果见： #contributors 显示 meta 标签文章顶部和底部的日期、分类、更新日期、标签、分享等属于 meta 标签。顶部的为 header，底部的为 footer，取值见主题配置文件中的 meta 库。 front-matter---# 默认的meta信息，文章中没有配置则按照这里的配置来显示，设置为false则不显示# 其中，title只在header中有效，music和thumbnail无需在这里设置，文章中有则显示# 如果tags放置在meta.header中，那么在post列表中不显示（因为卡片下方已经有了）meta: header: [title, author, date, category, counter, top] footer: [updated, tags, share]--- 像404、关于页面就可以完全隐藏： front-matter---meta: header: [] footer: []--- 居中标题模式如果标题居中且下方不想显示任何 meta 信息，可以这样设置： front-matter---meta: header: [centertitle]--- 标题右边显示缩略图front-matter---thumbnail: https://img.vim-cn.com/17/0c7b02722686d1527a1df807dae0794d995860.png--- 缩略图仅在文章列表和文章页面显示，不会在归档页面显示。 标题右边显示图标front-matter---icons: [fas fa-fire red, fas fa-star green]--- 图标仅在归档页面中显示，可以用来标注热门文章。 可以通过 red / blue / green / yellow / orange / theme / accent 来设置图标的颜色 meta 区域显示外链按钮例如当前文档页面的设置： front-matter---meta: footer: [btns]btns: repo: https://github.com/volantis-x/hexo-theme-volantis bug: https://github.com/volantis-x/hexo-theme-volantis/issues/ doubt: https://github.com/volantis-x/hexo-theme-volantis/issues/ idea: https://github.com/volantis-x/hexo-theme-volantis/issues/--- 按钮的颜色、图标、标题在主题配置文件中设置。 是否要显示封面如果某个页面需要封面，可以这样写： front-matter---cover: true--- 显示侧边栏通过自由设置边栏卡片来删减对应页面的冗余信息，提高有价值的信息在页面中的权重。 如果某个页面不需要侧边栏，可以这样写： front-matter---sidebar: []--- 某个页面想指定显示某几个侧边栏，就这样写: front-matter---sidebar: [grid, toc, tags] # 放置任何你想要显示的侧边栏部件--- 关闭评论默认是 body: [article, comments]，如果某个页面不要评论，只需要去掉 comments 即可。 front-matter---body: [article]--- 只显示留言板如果你想创建一个只有留言板的页面 front-matter---body: [comments]---"},{"title":"front-matter","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/page-settings/front-matter/index.html","permalink":"https://volantis.js.org/v3/page-settings/front-matter/","excerpt":"","text":"front-matterfront-matter 是文件最上方以 --- 分隔的区域，用于指定个别文件的变量。更多请见 Hexo 官方文档：#front-matter 字段 含义 值类型 默认值 layout 布局模版 String - title 页面标题 String - seo_title 网页标题 String page.title short_title 页面标题（在group列表中显示） String page.title date 创建时间 Date 文件创建时间 updated 更新日期 Date 文件修改时间 link 外部文章网址 String - music 内部音乐控件 [Object] - robots robots String - keywords 页面关键词 String - description 页面描述、摘要 String - cover 是否显示封面 Bool true meta 文章或页面的meta信息 Bool, Array theme.layout.*.meta sidebar 页面侧边栏 Bool, Array theme.layout.*.sidebar body 页面主体元素 Array theme.layout.on_page.body mathjax 是否渲染公式 Bool, String false thumbnail 缩略图 String false icons 图标 Array [] pin 是否置顶 Bool false layout:post 时特有的字段： 字段 含义 值类型 默认值 author 文章作者 [Object] config.author categories 分类 String, Array - tags 标签 String, Array - toc 是否生成目录 Bool true author 字段 含义 值类型 默认值 name 作者名 String config.author avatar 头像 String config.avatar url 链接 String config.url music 字段 是否必须 值类型 server 是 netease, tencent, kugou, xiami, baidu type 是 song, playlist, album, search, artist id 是 song id / playlist id / album id / search keyword 文章置顶在 front-matter 中设置以下值： front-matterpin: true 文章分类多个分类有两种关系，一种是层级（等同于文件夹），一种是并列（等同于标签）。 多级分类： front-matter---categories: [分类A, 分类B]--- 或者 front-matter---categories: - 分类A - 分类B--- 并列分类 front-mattercategories: - [分类A] - [分类B] 多级+并列分类 front-mattercategories: - [分类A, 分类B] - [分类C, 分类D] 文章摘要在文章中插入 <!-- more -->，前面的部分即为摘要。 某篇文章源码---title: xxxdate: 2020-02-21---这是摘要<!-- more -->这是正文 注意： <!-- more --> 前后一定要有空行，不然可能导致显示错位。 设置文章作者由于支持多个作者在一个站点发布文章，所以可以设置单独一篇文章的作者： front-matter---author: name: 作者 avatar: https://img.vim-cn.com/a1/d53c11fb5d4fd69529bc805d385fe818feb3f6.png url: https://baidu.com--- 引入外部文章利用 link，搭配自定义的文章作者信息，你可以在文章列表中显示外部文章或者网址，例如： front-matter---layout: postdate: 2017-07-05title: [转]如何搭建基于Hexo的独立博客categories: [Dev, Hexo]tags: - Hexoauthor: name: xaoxuu avatar: https://cdn.jsdelivr.net/gh/xaoxuu/assets@master/avatar/avatar.png url: https://xaoxuu.comlink: https://xaoxuu.com/blog/2017-07-05-hexo-blog/---![](https://img.vim-cn.com/d9/a9af7dc49fc0af8ca3e6dd2450a2f7095a87db.png) 置顶对于任何文章或者页面，设置 pin: true 即可置顶在首页。 front-matter---pin: true--- 这会导致一个小问题：首页 post 卡片数量多于设定值，如果有强迫症希望每一个分页数量一致，可以安装插件来实现，详见：#421 不归档存放在 _posts 文件夹下的文章一般都会出现在归档页，如果某篇文章不希望出现在归档页面： front-matter---archive: false---"},{"title":"页面布局模板","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/page-settings/layout/index.html","permalink":"https://volantis.js.org/v3/page-settings/layout/","excerpt":"","text":"布局模板 取值 含义 page 独立页面 post 文章页面 category 分类页面 tag 标签页面 links 友链页面 list 列表页面 page & postpost 页面布局几乎与 page 页面相同，但是有以下细微区别： post 文章有 title 时，向下滚动网页，导航栏会向上移出屏幕显出文章标题，而 page 不会。 主题配置中的 article_footer 只作用于 post，如果 page 也要显示，可以在 front-matter 中设置meta: article_footer: [xxx] 除了归档页面是自动生成的，其它独立页面都需要手动创建 md 文件。 归档页面归档页面是自动生成的，并且初始化的时候已经生成，路径如下： blog/_config.yml# Directoryarchive_dir: archives 关于页面Create file if not exists: source/about/index.md---layout: pagetitle: 关于meta: header: [] footer: []sidebar: []valine: placeholder: 有什么想对我说的呢？---下面写关于自己的内容 分类页面Create file if not exists: source/categories/index.md---layout: categoryindex: truetitle: 所有分类--- 标签页面Create file if not exists: source/tags/index.md---layout: tagindex: truetitle: 所有标签--- 列表页面Create file if not exists: source/mylist/index.md---layout: listgroup: mylistindex: true--- 结果就是筛选出所有文章中 front-matter 部分含有 group: mylist 的文章。 友链页面Create file if not exists: source/friends/index.md---layout: links # 必须title: 我的朋友们 # 可选，这是友链页的标题links: - group: 分组1 icon: fas fa-user-tie desc: 这个分组的描述 items: - name: # 博客名 avatar: # 头像链接 url: # 博客链接 backgroundColor: '#3E74C9' # 卡片背景颜色 textColor: '#fff' # 卡片文字颜色 tags: [标签1, 标签2] # 标签 desc: 描述文字 - group: 分组2 icon: fas fa-user-tie desc: 这个分组的描述 items: - name: # 博客名 avatar: # 头像链接 url: # 博客链接 backgroundColor: '#3E74C9' # 卡片背景颜色 textColor: '#fff' # 卡片文字颜色 tags: [标签1, 标签2] # 标签 desc: 描述文字---这里写友链上方的内容。<!-- more -->这里可以写友链页面下方的文字备注，例如自己的友链规范、示例等。 姓名、头像、链接是必填项，其它选填。 404页面Create file if not exists: source/404.md---layout: pagetitle: 404 Not Foundbody: [article, comments]meta: header: [] footer: []sidebar: []valine: path: /404.html placeholder: 请留言告诉我您要访问哪个页面找不到了---{% p center huge, 404 %}{% p center bold, 很抱歉，您访问的页面不存在 %}{% p center small, 可能是输入地址有误或该地址已被删除 %}"},{"title":"渲染公式","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/page-settings/math/index.html","permalink":"https://volantis.js.org/v3/page-settings/math/","excerpt":"","text":"MathJax默认是不渲染的，如果文章内有公式，需要在 front-matter 中设置开启。 example.md:---title: 渲染公式（MathJax）date: 2020-02-23mathjax: true # false: 不渲染, true: 渲染, internal: 只在文章内部渲染，文章列表中不渲染---$$t+1=2$$$$\\mbox{积累因子}=\\begin{cases}1+ni & \\mbox{单利}\\\\\\\\(1+i)^n & \\mbox{复利}\\end{cases}$$$$\\begin{equation}\\sum_{i=0}^n F_i \\cdot \\phi (H, p_i) - \\sum_{i=1}^n a_i \\cdot ( \\tilde{x_i}, \\tilde{y_i}) + b_i \\cdot ( \\tilde{x_i}^2 , \\tilde{y_i}^2 )\\end{equation}$$$$\\begin{equation}\\beta^*(D) = \\mathop{argmin} \\limits_{\\beta} \\lambda {||\\beta||}^2 + \\sum_{i=1}^n max(0, 1 - y_i f_{\\beta}(x_i))\\end{equation}$$ 示例效果 $$t+1=2$$$$\\mbox{积累因子}=\\begin{cases}1+ni & \\mbox{单利}\\\\(1+i)^n & \\mbox{复利}\\end{cases}$$$$\\begin{equation}\\sum_{i=0}^n F_i \\cdot \\phi (H, p_i) - \\sum_{i=1}^n a_i \\cdot ( \\tilde{x_i}, \\tilde{y_i}) + b_i \\cdot ( \\tilde{x_i}^2 , \\tilde{y_i}^2 )\\end{equation}$$$$\\begin{equation}\\beta^*(D) = \\mathop{argmin} \\limits_{\\beta} \\lambda {||\\beta||}^2 + \\sum_{i=1}^n max(0, 1 - y_i f_{\\beta}(x_i))\\end{equation}$$ 如果公式仍无法正确渲染可以阅读 @MicDZ 的这篇文章：在Material-X上使用KaTeXhttps://www.micdz.cn/article/katex-on-volantis/"},{"title":"站点配置文件","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/site-settings/configuration/index.html","permalink":"https://volantis.js.org/v3/site-settings/configuration/","excerpt":"","text":"网站标题blog/_config.yml# 网站标题title: my blog 网站图标简单方式完全自定义blog/_config.yml# 网站图标，更多尺寸等图标请使用import方式批量导入favicon: https://cdn.jsdelivr.net/gh/xaoxuu/assets@master/favicon/favicon.icoblog/_config.ymlimport: meta: - <meta name="msapplication-TileColor" content="#ffffff"> - <meta name="msapplication-config" content="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/browserconfig.xml"> - <meta name="theme-color" content="#ffffff"> link: - <link rel="apple-touch-icon" sizes="180x180" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/apple-touch-icon.png"> - <link rel="icon" type="image/png" sizes="32x32" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-32x32.png"> - <link rel="icon" type="image/png" sizes="16x16" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-16x16.png"> - <link rel="manifest" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/site.webmanifest"> - <link rel="mask-icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/safari-pinned-tab.svg" color="#5bbad5"> - <link rel="shortcut icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon.ico"> 多语言设置blog/_config.ymllanguage:- zh-CN- en- zh-HK- zh-TW 对应的翻译文件路径： themes/volantis/languages/ Import 导入外部文件可以在无需修改主题文件的情况下在 head 和 body 中添加各种标签。meta 和 link 对应 head 中的 <meta> 和 <link> 标签。script 可以在 body 末尾导入 js 文件。 blog/_config.ymlimport: meta: - <meta name="msapplication-TileColor" content="#ffffff"> - <meta name="msapplication-config" content="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/browserconfig.xml"> - <meta name="theme-color" content="#ffffff"> link: - <link rel="apple-touch-icon" sizes="180x180" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/apple-touch-icon.png"> - <link rel="icon" type="image/png" sizes="32x32" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-32x32.png"> - <link rel="icon" type="image/png" sizes="16x16" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon-16x16.png"> - <link rel="manifest" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/site.webmanifest"> - <link rel="mask-icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/safari-pinned-tab.svg" color="#5bbad5"> - <link rel="shortcut icon" href="https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/favicon/favicon.ico"> script: 网站 参数 描述 title 网站标题 subtitle 网站副标题 description 网站描述 keywords 网站的关键词。支援多个关键词。 author 您的名字 language 网站使用的语言。对于简体中文用户来说，使用不同的主题可能需要设置成不同的值，请参考你的主题的文档自行设置，常见的有 zh-Hans和 zh-CN。 timezone 网站时区。Hexo 默认使用您电脑的时区。请参考 时区列表 进行设置，如 America/New_York, Japan, 和 UTC 。一般的，对于中国大陆地区可以使用 Asia/Shanghai。 其中，description主要用于SEO，告诉搜索引擎一个关于您站点的简单描述，通常建议在其中包含您网站的关键词。author参数用于主题显示文章的作者。 网址 参数 描述 默认值 url 网址 root 网站根目录 permalink 文章的 永久链接 格式 :year/:month/:day/:title/ permalink_defaults 永久链接中各部分的默认值 pretty_urls 改写 permalink 的值来美化 URL pretty_urls.trailing_index 是否在永久链接中保留尾部的 index.html，设置为 false 时去除 true pretty_urls.trailing_html 是否在永久链接中保留尾部的 .html, 设置为 false 时去除 (对尾部的 index.html无效) true 网站存放在子目录如果您的网站存放在子目录中，例如 http://yoursite.com/blog，则请将您的 url 设为 http://yoursite.com/blog 并把 root 设为 /blog/。 例如： # 比如，一个页面的永久链接是 http://example.com/foo/bar/index.htmlpretty_urls: trailing_index: false# 此时页面的永久链接会变为 http://example.com/foo/bar/ 目录 参数 描述 默认值 source_dir 资源文件夹，这个文件夹用来存放内容。 source public_dir 公共文件夹，这个文件夹用于存放生成的站点文件。 public tag_dir 标签文件夹 tags archive_dir 归档文件夹 archives category_dir 分类文件夹 categories code_dir Include code 文件夹，source_dir 下的子目录 downloads/code i18n_dir 国际化（i18n）文件夹 :lang skip_render 跳过指定文件的渲染。匹配到的文件将会被不做改动地复制到 public 目录中。您可使用 glob 表达式 来匹配路径。 例如： skip_render: "mypage/**/*"# 将会直接将 `source/mypage/index.html` 和 `source/mypage/code.js` 不做改动地输出到 'public' 目录# 你也可以用这种方法来跳过对指定文章文件的渲染skip_render: "_posts/test-post.md"# 这将会忽略对 'test-post.md' 的渲染 提示如果您刚刚开始接触 Hexo，通常没有必要修改这一部分的值。 文章 参数 描述 默认值 new_post_name 新文章的文件名称 :title.md default_layout 预设布局 post auto_spacing 在中文和英文之间加入空格 false titlecase 把标题转换为 title case false external_link 在新标签中打开链接 true external_link.enable 在新标签中打开链接 true external_link.field 对整个网站（site）生效或仅对文章（post）生效 site external_link.exclude 需要排除的域名。主域名和子域名如 www 需分别配置 [] filename_case 把文件名称转换为 (1) 小写或 (2) 大写 0 render_drafts 显示草稿 false post_asset_folder 启动 Asset 文件夹 false relative_link 把链接改为与根目录的相对位址 false future 显示未来的文章 true highlight 代码块的设置, see Highlight.js section for usage guide prismjs 代码块的设置, see PrismJS section for usage guide 相对地址默认情况下，Hexo 生成的超链接都是绝对地址。例如，如果您的网站域名为 example.com,您有一篇文章名为 hello，那么绝对链接可能像这样：http://example.com/hello.html，它是绝对于域名的。相对链接像这样：/hello.html，也就是说，无论用什么域名访问该站点，都没有关系，这在进行反向代理时可能用到。通常情况下，建议使用绝对地址。 分类 & 标签 参数 描述 默认值 default_category 默认分类 uncategorized category_map 分类别名 tag_map 标签别名 日期 / 时间格式Hexo 使用 Moment.js 来解析和显示时间。 参数 描述 默认值 date_format 日期格式 YYYY-MM-DD time_format 时间格式 HH:mm:ss updated_option 当 Front Matter 中没有指定 updated 时 updated 的取值 mtime updated_optionupdated_option 控制了当 Front Matter 中没有指定 updated 时，updated 如何取值：mtime: 使用文件的最后修改时间。这是从 Hexo 3.0.0 开始的默认行为。date: 使用 date 作为 updated 的值。可被用于 Git 工作流之中，因为使用 Git 管理站点时，文件的最后修改日期常常会发生改变empty: 直接删除 updated。使用这一选项可能会导致大部分主题和插件无法正常工作。use_date_for_updated 选项已经被废弃，将会在下个重大版本发布时去除。请改为使用 updated_option: 'date'。 use_date_for_updated | 启用以后，如果 Front Matter 中没有指定 updated， post.updated 将会使用 date 的值而不是文件的创建时间。在 Git 工作流中这个选项会很有用 | true 分页 参数 描述 默认值 per_page 每页显示的文章量 (0 = 关闭分页功能) 10 pagination_dir 分页目录 page 扩展 参数 描述 theme 当前主题名称。值为false时禁用主题 theme_config 主题的配置文件。在这里放置的配置会覆盖主题目录下的 _config.yml 中的配置 deploy 部署部分的设置 meta_generator Meta generator 标签。 值为 false 时 Hexo 不会在头部插入该标签 包括或不包括目录和文件在 Hexo 配置文件中，通过设置 include/exclude 可以让 Hexo 进行处理或忽略某些目录和文件夹。你可以使用 glob 表达式 对目录和文件进行匹配。 include and exclude options only apply to the source/ folder, whereas ignore option applies to all folders. 参数 描述 include Hexo 默认会忽略隐藏文件和文件夹（包括名称以下划线和 . 开头的文件和文件夹，Hexo 的 _posts 和 _data 等目录除外）。通过设置此字段将使 Hexo 处理他们并将它们复制到 source 目录下。 exclude Hexo 会忽略这些文件和目录 ignore Ignore files/folders 举例： # Include/Exclude Files/Foldersinclude: - ".nojekyll" # 包括 'source/css/_typing.css' - "css/_typing.css" # 包括 'source/_css/' 中的任何文件，但不包括子目录及其其中的文件。 - "_css/*" # 包含 'source/_css/' 中的任何文件和子目录下的任何文件 - "_css/**/*"exclude: # 不包括 'source/js/test.js' - "js/test.js" # 不包括 'source/js/' 中的文件、但包括子目录下的所有目录和文件 - "js/*" # 不包括 'source/js/' 中的文件和子目录下的任何文件 - "js/**/*" # 不包括 'source/js/' 目录下的所有文件名以 'test' 开头的文件，但包括其它文件和子目录下的单文件 - "js/test*" # 不包括 'source/js/' 及其子目录中任何以 'test' 开头的文件 - "js/**/test*" # 不要用 exclude 来忽略 'source/_posts/' 中的文件。你应该使用 'skip_render'，或者在要忽略的文件的文件名之前加一个下划线 '_' # 在这里配置一个 - "_posts/hello-world.md" 是没有用的。ignore: # Ignore any folder named 'foo'. - "**/foo" # Ignore 'foo' folder in 'themes/' only. - "**/themes/*/foo" # Same as above, but applies to every subfolders of 'themes/'. - "**/themes/**/foo" 列表中的每一项都必须用单引号或双引号包裹起来。 include 和 exclude 并不适用于 themes/ 目录下的文件。如果需要忽略 themes/ 目录下的部分文件或文件夹，可以使用 ignore 或在文件名之前添加下划线 _。 使用代替配置文件可以在 hexo-cli 中使用 --config 参数来指定自定义配置文件的路径。你可以使用一个 YAML 或 JSON 文件的路径，也可以使用逗号分隔（无空格）的多个 YAML 或 JSON 文件的路径。例如： # use 'custom.yml' in place of '_config.yml'$ hexo server --config custom.yml# use 'custom.yml' & 'custom2.json', prioritizing 'custom3.yml', then 'custom2.json'$ hexo generate --config custom.yml,custom2.json,custom3.yml 当你指定了多个配置文件以后，Hexo 会按顺序将这部分配置文件合并成一个 _multiconfig.yml。如果遇到重复的配置，排在后面的文件的配置会覆盖排在前面的文件的配置。这个原则适用于任意数量、任意深度的 YAML 和 JSON 文件。 例如，使用 --options 指定了两个自定义配置文件： $ hexo generate --config custom.yml,custom2.json 如果 custom.yml 中指定了 foo: bar，在 custom2.json 中指定了 "foo": "dinosaur"，那么在 _multiconfig.yml 中你会得到 foo: dinosaur。 使用代替主题配置文件通常情况下，Hexo 主题是一个独立的项目，并拥有一个独立的 _config.yml 配置文件。 除了自行维护独立的主题配置文件，你也可以在其它地方对主题进行配置。 配置文件中的 theme_config 该特性自 Hexo 2.8.2 起提供 # _config.ymltheme: "my-theme"theme_config: bio: "My awesome bio" foo: bar: 'a' # themes/my-theme/_config.ymlbio: "Some generic bio"logo: "a-cool-image.png" foo: baz: 'b' 最终主题配置的输出是： { bio: "My awesome bio", logo: "a-cool-image.png", foo: { bar: "a", baz: "b" }} 独立的 _config.[theme].yml 文件 该特性自 Hexo 5.0.0 起提供 独立的主题配置文件应放置于站点根目录下，支持 yml 或 json 格式。需要配置站点 _config.yml 文件中的 theme 以供 Hexo 寻找 _config.[theme].yml 文件。 # _config.ymltheme: "my-theme" # _config.my-theme.ymlbio: "My awesome bio"foo: bar: 'a' # themes/my-theme/_config.ymlbio: "Some generic bio"logo: "a-cool-image.png" foo: baz: 'b' 最终主题配置的输出是： { bio: "My awesome bio", logo: "a-cool-image.png", foo: { bar: "a", baz: "b" }} 我们强烈建议你将所有的主题配置集中在一处。如果你不得不在多处配置你的主题，那么这些信息对你将会非常有用：Hexo 在合并主题配置时，Hexo 配置文件中的 theme_config 的优先级最高，其次是 _config.[theme].yml 文件，最后是位于主题目录下的 _config.yml 文件。"},{"title":"容器类标签","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/tag-plugins/container/index.html","permalink":"https://volantis.js.org/v3/tag-plugins/container/","excerpt":"","text":"Tab此插件移植自 NexT #tabs 。请将您的 Volantis 升级至 2.1 版本以上使用。 语法格式参数列表{% tabs tab-id %}<!-- tab tab-name -->![](https://i.loli.net/2020/03/18/f5PQlWisvm9zbgK.jpg)<!-- endtab --><!-- tab tab-name -->这里面写内容，支持的语法格式有限，请尽量<u>不要</u>写太过复杂的东西。<!-- endtab -->{% endtabs %}tab-id 必填，如果一个页面有多个 tabs 时，tab-id 不能重复。 tab-name 标签文本。 Folding请将您的 Volantis 升级至 2.3 版本以上使用。 语法格式参数列表示例写法示例效果{% folding 参数（可选）, 标题 %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endfolding %}参数位置可以填写颜色和状态，多个参数用空格隔开。 颜色 blue, cyan, green, yellow, red 状态 状态填写 open 代表默认打开。{% folding 查看图片测试 %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endfolding %}{% folding cyan open, 查看默认打开的折叠框 %}这是一个默认打开的折叠框。{% endfolding %}{% folding green, 查看代码测试 %}{% endfolding %}{% folding yellow, 查看列表测试 %}- haha- hehe{% endfolding %}{% folding red, 查看嵌套测试 %}{% folding blue, 查看嵌套测试2 %}{% folding 查看嵌套测试3 %}hahaha <span><img src='https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/tieba/%E6%BB%91%E7%A8%BD.png' style='height:24px'></span>{% endfolding %}{% endfolding %}{% endfolding %} 查看图片测试 查看默认打开的折叠框 这是一个默认打开的折叠框。 查看代码测试 {% folding green, 查看代码测试 %}查看代码测试{% endfolding %} 查看列表测试 hahahehe 查看嵌套测试 查看嵌套测试2 查看嵌套测试3 hahaha"},{"title":"Hexo 内置标签","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/tag-plugins/hexo/index.html","permalink":"https://volantis.js.org/v3/tag-plugins/hexo/","excerpt":"","text":"文章摘要和截断在文章中使用 <!-- more -->，那么 <!-- more --> 之前的文字将会被视为摘要。首页中将只出现这部分文字，同时这部分文字也会出现在正文之中。详见 Hexo 官方文档： 标签插件https://hexo.io/zh-cn/docs/tag-plugins 引用块引用书上的句子 Do not just seek happiness for yourself. Seek happiness for all. Through kindness. Through mercy. David LevithanWide Awake 代码块{% codeblock [title] [lang:language] [url] [link text] [additional options] %}code snippet{% endcodeblock %} 指定语言[rectangle setX: 10 y: 10 width: 20 height: 20]; example.md:{% codeblock lang:objc %}[rectangle setX: 10 y: 10 width: 20 height: 20];{% endcodeblock %} 附加说明Array.maparray.map(callback[, thisArg]) example.md:{% codeblock Array.map %}array.map(callback[, thisArg]){% endcodeblock %} 行标、高亮12345678n=eval(input())if n==0: print("Hello World")elif n>0: print("He\\nll\\no \\nWo\\nrl\\nd")else: for c in "Hello World": print(c) example.md:{% codeblock lang:python line_number:true mark:3,5,8 %}n=eval(input())if n==0: print("Hello World")elif n>0: print("He\\nll\\no \\nWo\\nrl\\nd")else: for c in "Hello World": print(c){% endcodeblock %} Pull Quote在文章中插入 Pull quote example.md:{% pullquote [class] %}content{% endpullquote %} jsFiddle在文章中嵌入 jsFiddle example.md:{% jsfiddle shorttag [tabs] [skin] [width] [height] %} Gist在文章中嵌入 Gist，注意：在国内无法加载。 example.md:{% gist gist_id [filename] %} iframe在文章中插入 iframe example.md:{% iframe url [width] [height] %} Image在文章中插入指定大小的图片。 example.md:{% img [class names] /path/to/image [width] [height] '"title text" "alt text"' %} Link在文章中插入链接，并自动给外部链接添加 target="_blank" 属性。 example.md:{% link text url [external] [title] %} Include Code插入 source/downloads/code 文件夹内的代码文件。source/downloads/code 不是固定的，取决于你在配置文件中 code_dir 的配置。 example.md:{% include_code [title] [lang:language] [from:line] [to:line] path/to/file %} 示例 嵌入 test.js 文件全文{% include_code lang:javascript test.js %}只嵌入第 3 行{% include_code lang:javascript from:3 to:3 test.js %}嵌入第 5 行至第 8 行{% include_code lang:javascript from:5 to:8 test.js %}嵌入第 5 行至文件结束{% include_code lang:javascript from:5 test.js %}嵌入第 1 行至第 8 行{% include_code lang:javascript to:8 test.js %} 引用文章引用其他文章的链接。 {% post_path filename %}{% post_link filename [title] [escape] %} 示例 引用这篇文章：主题更名为「Volantis」example.md:引用这篇文章：{% post_link news/2020-02-22 %}"},{"title":"链接、按钮和菜单标签","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/tag-plugins/link/index.html","permalink":"https://volantis.js.org/v3/tag-plugins/link/","excerpt":"","text":"外链卡片请将您的 Volantis 升级至 3.0 版本以上使用。 语法格式示例写法示例效果{% link 标题, 链接, 图片 %}example.md:{% link 如何参与项目, http://localhost:4000/contributors/, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets@master/logo/256/safari.png %}如何参与项目http://localhost:4000/contributors/ 基础按钮请将您的 Volantis 升级至 2.4 版本以上使用。 语法格式参数列表示例写法示例效果{% btn 样式参数（可选）, 标题, 链接, 图标（可选） %} 可选的参数可以省略，但是前后顺序不能乱。样式参数 regular, large, center 图标 第1个或者第2个参数包含 fa- 的那个被识别为图标。example.md:不设置任何参数的 {% btn 按钮, / %} 适合融入段落中。regular 按钮适合独立于段落之外：{% btn regular, 示例博客, https://xaoxuu.com, fas fa-play-circle %}large 按钮更具有强调作用，建议搭配 center 使用：{% btn center large, 开始使用, https://volantis.js.org/v3/getting-started/, fas fa-download %}行内按钮 不设置任何参数的 按钮 适合融入段落中。 空心按钮 示例博客 示例博客 示例博客 示例博客 居中： 开始使用 实心按钮 示例博客 示例博客 示例博客 示例博客 居中： 开始使用 富文本按钮请将您的 Volantis 升级至 2.3 版本以上使用。 语法格式参数列表示例写法示例效果{% btns 样式参数 %}{% cell 标题, 链接, 图片或者图标 %}{% cell 标题, 链接, 图片或者图标 %}{% endbtns %}样式参数位置可以写图片样式、布局方式，多个样式参数用空格隔开。 圆角样式 默认为方形 rounded, circle 布局方式 默认为自动宽度，适合视野内只有一两个的情况。 参数 含义 wide 宽一点的按钮 fill 填充布局，自动铺满至少一行，多了会换行。 center 居中，按钮之间是固定间距。 around 居中分散 grid2 等宽最多2列，屏幕变窄会适当减少列数。 grid3 等宽最多3列，屏幕变窄会适当减少列数。 grid4 等宽最多4列，屏幕变窄会适当减少列数。 grid5 等宽最多5列，屏幕变窄会适当减少列数。 增加文字样式 可以在容器内增加 <b>标题</b> 和 <p>描述文字</p>如果需要显示类似「团队成员」之类的一组含有头像的链接： example.md:{% btns circle grid5 %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% endbtns %} 或者含有图标的按钮： example.md:{% btns rounded grid5 %}{% cell 下载源码, /, fas fa-download %}{% cell 查看文档, /, fas fa-book-open %}{% endbtns %} 圆形图标 + 标题 + 描述 + 图片 + 网格5列 + 居中 example.md:{% btns circle center grid5 %}<a href='https://apps.apple.com/cn/app/heart-mate-pro-hrm-utility/id1463348922?ls=1'> <i class='fab fa-apple'></i> <b>心率管家</b> {% p red, 专业版 %} <img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/qrcode/heartmate_pro.png'></a><a href='https://apps.apple.com/cn/app/heart-mate-lite-hrm-utility/id1475747930?ls=1'> <i class='fab fa-apple'></i> <b>心率管家</b> {% p green, 免费版 %} <img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/qrcode/heartmate_lite.png'></a>{% endbtns %}如果需要显示类似「团队成员」之类的一组含有头像的链接： xaoxuu xaoxuu xaoxuu xaoxuu xaoxuu 或者含有图标的按钮： 下载源码 查看文档 圆形图标 + 标题 + 描述 + 图片 + 网格5列 + 居中 心率管家 专业版 心率管家 免费版 下拉菜单请将您的 Volantis 升级至 3.0 版本以上使用。 语法格式示例写法示例效果容器 {% menu 前缀（可省略）, 标题, 后缀（可省略） %}菜单内容{% endmenu %} 菜单内容 菜单项 {% menuitem 文本, 链接, 图标 %} 分割线 {% menuitem hr %} 子菜单 {% submenu 嵌套菜单, 图标 %}菜单内容{% endsubmenu %}示例1 {% menu 下拉菜单 %}{% menuitem 主题源码, https://github.com/volantis-x/hexo-theme-volantis/, fas fa-file-code %}{% menuitem 更新日志, https://github.com/volantis-x/hexo-theme-volantis/releases/, fas fa-clipboard-list %}{% menuitem hr %}{% submenu 有疑问？, fas fa-question-circle %}{% menuitem 看 FAQ, /faqs/ %}{% menuitem 看 本站源码, https://github.com/volantis-x/volantis-docs/ %}{% menuitem 提 Issue, https://github.com/volantis-x/hexo-theme-volantis/issues/ %}{% endsubmenu %}{% endmenu %} 示例2 {% menu 这个是, 下拉菜单 %}（同上）{% endmenu %} 示例3 {% menu 这个是, 下拉菜单, 的示例效果。 %}（同上）{% endmenu %}示例1 下拉菜单 主题源码 更新日志 有疑问？ 看 FAQ 看 本站源码 提 Issue 示例2 这个是 下拉菜单 主题源码 更新日志 有疑问？ 看 FAQ 看 本站源码 提 Issue 示例3 这个是 下拉菜单 主题源码 更新日志 有疑问？ 看 FAQ 看 本站源码 提 Issue 的示例效果。"},{"title":"多媒体标签","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/tag-plugins/media/index.html","permalink":"https://volantis.js.org/v3/tag-plugins/media/","excerpt":"","text":"InlineimageInlineimage 标签是一种行内图片标签，可以用来在一段话中间插入表情。请将您的 Volantis 升级至 3.0.0 版本以上使用。 语法格式参数列表示例写法示例效果这是一段话 {% inlineimage 链接, height=高度（可选） %} 这是一段话。图片高度 阿拉伯数字 + px example:height=20pxexample.md:这是 {% inlineimage https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/aru-l/0000.gif %} 一段话。这又是 {% inlineimage https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/aru-l/5150.gif, height=40px %} 一段话。这是 一段话。 这又是 一段话。 ImageImage 标签是一种针对单个图片应用场景的标签，支持图片描述文字和指定宽度。请将您的 Volantis 升级至 2.6 版本以上使用。 语法格式参数列表示例写法示例效果{% image 链接, 宽度（可选）, 描述（可选） %}图片宽度 阿拉伯数字 + px example:300px 图片描述 纯文本，不能包含引号。example.md:添加描述：{% image https://i.loli.net/2020/04/06/zdeQiOY9rBCjhDR.jpg, alt=每天下课回宿舍的路，承载了太多记忆。 %}指定宽度：{% image https://i.loli.net/2020/04/06/zdeQiOY9rBCjhDR.jpg, width=300px %}指定宽度并添加描述：{% image https://i.loli.net/2020/04/06/zdeQiOY9rBCjhDR.jpg, width=300px, alt=每天下课回宿舍的路，承载了太多记忆。 %}添加描述： 每天下课回宿舍的路，承载了太多记忆。 指定宽度： 指定宽度并添加描述： 每天下课回宿舍的路，承载了太多记忆。 GalleryGallery 标签是一种针对一组图片应用场景的标签。请将您的 Volantis 升级至 3.0 版本以上使用。 语法格式参数列表示例写法示例效果{% gallery 参数, 列数 %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B18FCBB3-67FD-48CC-B4F3-457BA145F17A.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/67239FBB-E15D-4F4F-8EE8-0F1C9F3C4E7C.jpeg){% endgallery %}对齐方向 left, center, right 缩放 stretch 列数 逗号后面直接写列数，支持 2 ～ 8 列。设定列列数之后就是「多行多图」布局，此时图片默认左对齐。为了避免图片大小不一，建议搭配 stretch 来时图片放大填充。一行一个图片 example.md:{% gallery %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endgallery %} 一行多个图片（不换行） example.md:{% gallery %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B18FCBB3-67FD-48CC-B4F3-457BA145F17A.jpeg)![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/67239FBB-E15D-4F4F-8EE8-0F1C9F3C4E7C.jpeg)![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/00E0F0ED-9F1C-407A-9AA6-545649D919F4.jpeg){% endgallery %} 多行多个图片（每行2～8个图片） example.md:{% gallery stretch, 4 %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B951AE18-D431-417F-B3FE-A382403FF21B.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/AEB33F9D-7294-4CF1-B8C5-3020748A9D45.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/250662D4-5A21-4AAA-BB63-CD25CF97CFF1.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/10A0FCE5-36A1-4AD0-8CF0-019259A89E03.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B951AE18-D431-417F-B3FE-A382403FF21B.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/AEB33F9D-7294-4CF1-B8C5-3020748A9D45.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/250662D4-5A21-4AAA-BB63-CD25CF97CFF1.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/10A0FCE5-36A1-4AD0-8CF0-019259A89E03.jpeg){% endgallery %}一行一个图片 图片描述 一行多个图片（不换行） 图片描述 图片描述 图片描述 多行多个图片（每行2～8个图片） Audio请将您的 Volantis 升级至 2.4 版本以上使用。 语法格式示例写法示例效果example.md:{% audio 音频链接 %}example.md:{% audio https://github.com/volantis-x/volantis-docs/releases/download/assets/Lumia1020.mp3 %}Your browser does not support the audio tag. Video请将您的 Volantis 升级至 2.3 版本以上使用。 语法格式参数列表示例写法示例效果单个视频 example.md:{% video 视频链接 %} 多个视频 example.md:{% videos 对齐方向, 列数 %}{% video 视频链接 %}{% video 视频链接 %}{% video 视频链接 %}{% endvideos %}对齐方向 left, center, right 列数 逗号后面直接写列数，支持 1 ～ 4 列。100%宽度 example.md:{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %} 50%宽度 example.md:{% videos, 2 %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% endvideos %} 25%宽度 example.md:{% videos, 4 %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% endvideos %}100%宽度 Your browser does not support the video tag. 50%宽度 Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. 25%宽度 Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. APlayer主题对 APlayer 插件的样式进行了兼容。安装插件： npm i -S hexo-tag-aplayer hexo-tag-aplayerhttps://github.com/MoePlayer/hexo-tag-aplayer"},{"title":"文本和段落标签","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/tag-plugins/text/index.html","permalink":"https://volantis.js.org/v3/tag-plugins/text/","excerpt":"","text":"行内小标签请将您的 Volantis 升级至 3.0 版本以上使用。 语法格式示例写法示例效果带下划线的文本 {% u 带下划线的文本 %} 带着重号的文本 {% emp 带着重号的文本 %} 带波浪线的文本 {% wavy 波浪线 %} 带删除线的文本 {% del 带删除线的文本 %} 键盘样式的文本 {% kbd 键盘样式的文本 %} 密码样式的文本 {% psw 密码样式的文本 %}带下划线的文本 example.md:带 {% u 下划线 %} 的文本 带着重号的文本 example.md:带 {% emp 着重号 %} 的文本 带波浪线的文本 example.md:带 {% wavy 波浪线 %} 的文本 带删除线的文本 example.md:带 {% del 删除线 %} 的文本 键盘样式的文本 example.md:收藏页面：{% kbd command %} + {% kbd D %} 密码样式的文本 example.md:验证码：{% psw 这里没有验证码 %}带下划线的文本 带 下划线 的文本 带着重号的文本 带 着重号 的文本 带波浪线的文本 带 波浪线 的文本 带删除线的文本 带 删除线 的文本 键盘样式的文本 收藏页面：command + D 密码样式的文本 验证码：这里没有验证码 Span & P请将您的 Volantis 升级至 2.5 版本以上使用。 语法格式参数列表示例写法示例效果行内文本 {% span 样式参数, 文本内容 %} 独立段落 {% p 样式参数, 文本内容 %}样式参数位置可以写颜色、大小和对齐方向，多个样式参数用空格隔开。 字体 logo, code 颜色 red, yellow, green, cyan, blue, gray 大小 small, h4, h3, h2, h1, large, huge, ultra 对齐方向 left, center, right彩色文字 example.md:在一段话中方便插入各种颜色的标签，包括：{% span red, 红色 %}、{% span yellow, 黄色 %}、{% span green, 绿色 %}、{% span cyan, 青色 %}、{% span blue, 蓝色 %}、{% span gray, 灰色 %}。 超大文字 example.md:文档「开始」页面中的标题部分就是超大文字。{% p center logo large, Volantis %}{% p center small, A Wonderful Theme for Hexo %}彩色文字 在一段话中方便插入各种颜色的标签，包括：红色、黄色、绿色、青色、蓝色、灰色。 超大文字 文档「开始」页面中的标题部分就是超大文字。 Volantis A Wonderful Theme for Hexo Note & NoteBlockNoteBlock 是 Blockquote 的增强版，在左边显示图标，并且可以自定颜色。而 Note 是 NoteBlock 的简便写法。请将您的 Volantis 升级至 2.3 版本以上使用。 语法格式参数列表示例写法示例效果Note {% note 样式参数, 文本内容 %} NoteBlock {% noteblock 样式参数 %}文本段落{% endnoteblock %}样式参数位置可以写图标和颜色，多个样式参数用空格隔开。 图标 彩色的quote, info, warning, done/success, error/danger 灰色的，也可以指定颜色radiation, bug, idea, link, paperclip, todo, msg, guide, download, up, undo 颜色 指定颜色clear, light, gray, red, yellow, green, cyan, blueNote example.md:{% note, 为简单的一句话提供的简便写法。 %}{% note success, 支持同样丰富的参数。 %} NoteBlock example.md:可以在区块中放置一些复杂的结构，支持嵌套。{% noteblock quote %}{% p subtitle, 小标题 %}Windows 10不是為所有人設計,而是為每個人設計{% p subtitle, 嵌套测试 %}{% noteblock %}请坐和放宽，我正在帮你搞定一切...{% endnoteblock %}{% p subtitle, Folding 测试 %}{% folding 点击查看更多 %}{% note warning, 不要说我们没有警告过你 %}{% noteblock bug red %}我们都有不顺利的时候{% endnoteblock %}{% endfolding %}{% endnoteblock %}Note 为简单的一句话提供的简便写法。 支持同样丰富的参数。 NoteBlock 可以在区块中放置一些复杂的结构，支持嵌套。 小标题Windows 10不是為所有人設計,而是為每個人設計嵌套测试请坐和放宽，我正在帮你搞定一切...Folding 测试 点击查看更多 不要说我们没有警告过你我们都有不顺利的时候 Checkbox & Radio请将您的 Volantis 升级至 2.6 版本以上使用。 语法格式参数列表示例写法示例效果{% checkbox 样式参数（可选）, 文本（支持简单md） %}颜色 red, yellow, green, cyan, blue 样式 plus, minus, times 选中状态 checkedCheckbox example.md:{% checkbox 纯文本测试 %}{% checkbox checked, 支持简单的 [markdown](https://guides.github.com/features/mastering-markdown/) 语法 %}{% checkbox red, 支持自定义颜色 %}{% checkbox green checked, 绿色 + 默认选中 %}{% checkbox yellow checked, 黄色 + 默认选中 %}{% checkbox cyan checked, 青色 + 默认选中 %}{% checkbox blue checked, 蓝色 + 默认选中 %}{% checkbox plus green checked, 增加 %}{% checkbox minus yellow checked, 减少 %}{% checkbox times red checked, 叉 %} Radio example.md:{% radio 纯文本测试 %}{% radio checked, 支持简单的 [markdown](https://guides.github.com/features/mastering-markdown/) 语法 %}{% radio red, 支持自定义颜色 %}{% radio green, 绿色 %}{% radio yellow, 黄色 %}{% radio cyan, 青色 %}{% radio blue, 蓝色 %}Checkbox 纯文本测试 支持简单的 markdown 语法 支持自定义颜色 绿色 + 默认选中 黄色 + 默认选中 青色 + 默认选中 蓝色 + 默认选中 增加 减少 叉 Radio 纯文本测试 支持简单的 markdown 语法 支持自定义颜色 绿色 黄色 青色 蓝色 Timeline请将您的 Volantis 升级至 3.0 版本以上使用。 语法格式示例写法示例效果{% timeline 时间线标题 %}{% timenode 时间节点（标题） %}正文内容{% endtimenode %}{% timenode 时间节点（标题） %}正文内容{% endtimenode %}{% endtimeline %}example.md:{% timeline 升级小助手 %}{% timenode 2020-07-24 [2.6.6 -> 3.0](https://github.com/volantis-x/hexo-theme-volantis/releases) %}1. 如果有 `hexo-lazyload-image` 插件，需要删除并重新安装最新版本，设置 `lazyload.isSPA: true`。2. 2.x 版本的 css 和 js 不适用于 3.x 版本，如果使用了 `use_cdn: true` 则需要删除。3. 2.x 版本的 fancybox 标签在 3.x 版本中被重命名为 gallery 。4. 2.x 版本的置顶 `top: true` 改为了 `pin: true`，并且同样适用于 `layout: page` 的页面。5. 如果使用了 `hexo-offline` 插件，建议卸载，3.0 版本默认开启了 pjax 服务。{% endtimenode %}{% timenode 2020-05-15 [2.6.3 -> 2.6.6](https://github.com/volantis-x/hexo-theme-volantis/releases/tag/2.6.6) %}不需要额外处理。{% endtimenode %}{% timenode 2020-04-20 [2.6.2 -> 2.6.3](https://github.com/volantis-x/hexo-theme-volantis/releases/tag/2.6.3) %}1. 全局搜索 `seotitle` 并替换为 `seo_title`。2. group 组件的索引规则有变，使用 group 组件的文章内，`group: group_name` 对应的组件名必须是 `group_name`。2. group 组件的列表名优先显示文章的 `short_title` 其次是 `title`。{% endtimenode %}{% endtimeline %}升级小助手 2020-07-24 2.6.6 -> 3.0.0 如果有 hexo-lazyload-image 插件，需要删除并重新安装最新版本，设置 lazyload.isSPA: true。2.x 版本的 css 和 js 不适用于 3.x 版本，如果使用了 use_cdn: true 则需要删除。2.x 版本的 fancybox 标签在 3.x 版本中被重命名为 gallery 。2.x 版本的置顶 top: true 改为了 pin: true，并且同样适用于 layout: page 的页面。如果使用了 hexo-offline 插件，建议卸载，3.0 版本默认开启了 pjax 服务。 2020-07-24 2.6.3 -> 2.6.6 不需要额外处理。 2020-07-24 2.6.2 -> 2.6.3 全局搜索 seotitle 并替换为 seo_title。group 组件的索引规则有变，使用 group 组件的文章内，group: group_name 对应的组件名必须是 group_name。group 组件的列表名优先显示文章的 short_title 其次是 title。"},{"title":"选择评论系统","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/theme-settings/comments/index.html","permalink":"https://volantis.js.org/v3/theme-settings/comments/","excerpt":"","text":"目前支持的评论系统有： Valine, MiniValine, Disqus, Gitalk, Vssue, Livere, Isso, Hashover blog/_config.volantis.ymlcomments: title: <i class='fas fa-comments'></i> 评论 subtitle: service: valine # valine, minivaline, disqus, gitalk, vssue, livere, isso, hashover ValineMiniValineVssueGitalkDisqusLivereIssoHashover... 一款快速、简洁且高效的无后端评论系统 https://valine.js.org blog/_config.volantis.ymlcomments: ... service: valine ... valine: appId: # your appId appKey: # your appKey js: https://cdn.jsdelivr.net/npm/valine@1.4/dist/Valine.min.js ... 可选配置项详见源码 其中，placeholder 支持在 front-matter 中设置。 front-matter---valine: placeholder: 你觉得xxx怎么样呢？--- 也可以通过设置 valine.path 实现多个页面共用一个评论框。 front-matter---valine: path: /--- 一款快速、简洁且高效的无后端评论系统 https://github.com/MiniValine/MiniValine/ blog/_config.volantis.ymlcomments: ... service: minivaline ... minivaline: appId: # Your leancloud application appid appKey: # Your leancloud application appkey ... 可选配置项详见源码 Vue 驱动的、基于 Issue 的评论插件 https://vssue.js.org/zh/ blog/_config.volantis.ymlcomments: ... service: vssue ... vssue: owner: repo: clientId: clientSecret: A modern comment component based on Github Issue and Preact. https://gitalk.github.io/ blog/_config.volantis.ymlcomments: ... service: gitalk ... gitalk: clientID: clientSecret: repo: owner: admin: # [] clientID 和 clientSecret 的获取方法可自行搜索教程，这里仅简单描述一下步骤： 点击 GitHub -> Settings https://github.com/settings/profile 点击 Developer settings https://github.com/settings/developers 点击 New OAuth App https://github.com/settings/applications/new 填写信息： Application name 随便填，我的是：xaoxuu.comHomepage URL 和 Authorization callback URL 都写你的网址，我的是：https://xaoxuu.com 可以通过设置 gitalk.id 实现多个页面共用一个评论框。 front-matter---gitalk: id: /wiki/volantis/--- Disqus - The #1 way to build an audience on your website. https://disqus.com/ blog/_config.volantis.ymlcomments: ... service: disqus ... disqus: shortname: Communication makes better world. https://www.livere.com/ blog/_config.volantis.ymlcomments: ... service: livere ... livere: uid: #你的livere的uid 在这里查看你的 uid：https://livere.com/insight/myCode，在【代码管理 -> 一般网站】中找到如下这段代码，其中 data-uid 中的内容就是你的 livere_uid。 <!-- 来必力City版安装代码 --><div id="lv-container" data-id="city" data-uid="你的livere的uid">... A commenting server similar to Disqus. https://posativ.org/isso/ blog/_config.volantis.ymlcomments: ... service: isso ... isso: url: https://example.com/(path/) src: https://example.com/(path/)js/embed.min.js A free and open source PHP comment system designed to allow completely anonymous comments and easy theming. https://www.barkdull.org/software/hashover blog/_config.volantis.ymlcomments: ... service: hashover ... hashover: src: https://example.com/(path/)comments.phpblog/themes/volantis/layout/_third-party/comments/评论系统名称/layout.ejs这里写布局代码 blog/themes/volantis/layout/_third-party/comments/评论系统名称/script.ejs这里要写加载 js 的代码 收录更多评论系统"},{"title":"主题配置文件","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/theme-settings/configuration/index.html","permalink":"https://volantis.js.org/v3/theme-settings/configuration/","excerpt":"","text":"使用代替主题配置文件 第 1/2 步：找到原主题配置文件 使用 npm i hexo-theme-volantis 方式安装的主题，配置文件在 blog/node_modules/hexo-theme-volantis/_config.yml使用传统方式安装的主题，配置文件在 blog/themes/volantis/_config.yml 第 2/2 步：复制主题配置文件 将主题配置文件复制并重命名到以下路径：blog/_config.volantis.yml"},{"title":"网站与文章封面","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/theme-settings/cover/index.html","permalink":"https://volantis.js.org/v3/theme-settings/cover/","excerpt":"","text":"封面方案blog/_config.volantis.ymlcover: scheme: docs # docs, blog ... 目前主题提供两种封面方案，全屏封面适用于项目文档，半屏封面适用于个人博客。您可以修改参数决定在任何页面是否显示。 封面布局blog/_config.volantis.ymlcover: ... layout: dock # search (搜索), dock (坞), featured (精选), focus (焦点) ... 默认显示设置blog/_config.volantis.ymlcover: ... display: home: true archive: false others: false # can be written in front-matter 'cover: true' 由于主页、归档是hexo自动生成的，您需要在主题配置文件中设置是否显示封面，而其它页面则可以在 front-matter 中通过设置 cover: true/false 来决定显示封面或者不显示封面。"},{"title":"设置网站页脚","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/theme-settings/footer/index.html","permalink":"https://volantis.js.org/v3/theme-settings/footer/","excerpt":"","text":"您通过 layout 可以自由布局网站页脚内容 aplayer, social, license, info, copyright。 blog/_config.volantis.ymlfooter: # layout of footer: [aplayer, social, license, info, copyright] layout: [aplayer, social, license, info, copyright] social: - icon: fas fa-rss url: atom.xml - icon: fas fa-envelope url: mailto:me@xaoxuu.com - icon: fab fa-github url: https://github.com/xaoxuu - icon: fas fa-headphones-alt url: https://music.163.com/#/user/home?id=63035382 copyright: '[Copyright © 2017-2021 XXX](/)' # You can add your own property here. (Support markdown, for example: br: '<br>') br: '<br>' 其中，aplayer 需要在插件部分设置中启用。您可以新增文字属性，用于展示其它文字信息，例如： blog/_config.volantis.ymlfooter: layout: [..., br, hello, ...] ... # You can add your own property here. (Support markdown, for example: br: '<br>') br: '<br>' hello: '[Hello World](/)'"},{"title":"设置默认布局","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/theme-settings/layout/index.html","permalink":"https://volantis.js.org/v3/theme-settings/layout/","excerpt":"","text":"您可以自由决定每个页面是否显示侧边栏，侧边栏显示什么小部件，正文区域显示什么卡片，文章卡片显示什么 meta 信息。 layout: # The following can be written in `blog/source/_data/layout.yml` # 文章列表（主页、自定义的列表）布局 on_list: # 列表中每一篇文章的meta信息 meta: [title, author, date, category, top] # 列表类页面的侧边栏 sidebar: [blogger, category, tagcloud, qrcode] # 页面布局 on_page: # 文章页面主体元素，你也可以在页面的Front-matter中设置 body: [article, comments] # 默认的meta信息，文章中没有配置则按照这里的配置来显示，设置为false则不显示 # 其中，title只在header中有效，music和thumbnail无需在这里设置，文章中有则显示 # 如果tags放置在meta.header中，那么在post列表中不显示（因为卡片下方已经有了） meta: header: [title, author, category, date, top] footer: [updated, tags, btns, share] # 文章页面的侧边栏 sidebar: [qrcode, toc] # 文章布局，参数继承自 on_page on_post: # 文章页脚，自动在每一篇文章末尾添加 article_footer: [copyright, donate] # 其他的页面布局暂时等于 on_list 其中 meta 部分的取值自 meta 库， 其余部分取值自 widget 库， （ body 除了可以从 widget 库中取值外，还可以选择 article 和 comments ）。 请别着急，具体的库配置将在下文详细讲解。"},{"title":"元数据组件","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/theme-settings/meta/index.html","permalink":"https://volantis.js.org/v3/theme-settings/meta/","excerpt":"","text":"meta 即文章的元数据，描述文章的作者、发布时间、更新时间等等信息，Volantis 不替您决定，显示什么图标、如何描述都可以自定义。 blog/_config.volantis.ymlmeta: # 文章标题 title: # 暂无配置 # 默认文章作者（可在front-matter中覆盖） author: avatar: https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png name: Mr. X url: https://xaoxuu.com # 文章创建日期 date: icon: fas fa-edit title: '发布于：' format: 'll' # 日期格式 http://momentjs.com/docs/ # 文章更新日期 updated: icon: fas fa-save title: '更新于：' format: 'll' # 日期格式 http://momentjs.com/docs/ # 文章分类 category: icon: fas fa-folder-open # 文章置顶 top: icon: fas fa-angle-double-up # 文章浏览计数 counter: icon: fas fa-eye # 文章字数和阅读时长 wordcount: icon_wordcount: fas fa-keyboard icon_duration: fas fa-hourglass-half # 文章标签 tags: icon: fas fa-hashtag # 分享 share: - id: qq img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/qq.png - id: qzone img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/qzone.png - id: weibo img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/weibo.png # - id: qrcode # 当id为qrcode时需要安装插件 npm i -S hexo-helper-qrcode # img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/wechat.png # 链接 btns: edit: icon: fas fa-edit title: 在GitHub上编辑此页 color: '#888' repo: # 源码链接 icon: fas fa-file-code title: 源码 color: '#508EF2' bug: # BUG反馈链接 icon: fas fa-bug title: BUG color: '#FE5F58' doubt: # 疑问链接 icon: fas fa-question-circle title: 疑问 color: '#FFBD2B' idea: # 建议链接 icon: fas fa-lightbulb title: 建议 color: '#3DC550' faq: # FAQ链接 icon: fas fa-comments title: FAQ color: '#29B1C9' feedback: # 反馈链接 icon: fas fa-comment-dots title: 反馈 color: '#1BCDFC'"},{"title":"设置网站导航栏","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/theme-settings/navbar/index.html","permalink":"https://volantis.js.org/v3/theme-settings/navbar/","excerpt":"","text":"导航栏配置导航栏分为 logo、menu、search 三个区域设置，其中 logo 区域如果设置了图片，则不能显示图标和标题， menu 区域的设置可以写在一个单独的文件中。 blog/_config.volantis.ymlnavbar: logo: # choose [img] or [icon + title] img: icon: title: menu: # The following can be written in `blog/source/_data/menu.yml` - name: 博客 icon: fas fa-rss url: / - name: 分类 icon: fas fa-folder-open url: categories/ - name: 标签 icon: fas fa-tags url: tags/ - name: 归档 icon: fas fa-archive url: archives/ - name: 友链 icon: fas fa-link url: friends/ - name: 关于 icon: fas fa-info-circle url: about/ search: 搜索 # Search bar placeholder 使用数据文件 建议新建一个文件，专门存放导航栏菜单配置，文件的路径为： blog/source/_data/menu.yml 文件的内容为： blog/source/_data/menu.yml- name: 博客 icon: fas fa-rss url: /... 菜单嵌套导航栏菜单支持嵌套，嵌套的属性名为 rows ，写法示例： blog/source/_data/menu.yml...- name: 更多 icon: fas fa-ellipsis-v rows: - name: 主题源码 url: https://github.com/volantis-x/hexo-theme-volantis/ - name: 更新日志 url: https://github.com/volantis-x/hexo-theme-volantis/releases/ - name: hr - name: 有疑问？ rows: - name: 看 FAQ url: faqs/ - name: 看 本站源码 url: https://github.com/volantis-x/volantis-docs/ - name: 提 Issue url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: hr - name: 公告和测试博文 url: archives/ - name: 示例博客 url: examples/ - name: 特别感谢 url: contributors/ 分割线在子菜单中，新增一个只有 name: hr 的“菜单”就会被渲染成一个分割线。 - name: hr 小标题在子菜单中，新增一个只有 name: 小标题内容（也可以有 icon: 小标题的图标）的“菜单”就会被渲染成一个小标题。 ...- name: 近期 icon: fas fa-clock url: / rows: - name: 热门文章 icon: fas fa-fire - name: ProHUD 开源库的设计思路 url: blog/2019-08-27-prohud/ - name: ValueX：实用的安全对象类型转换库 url: blog/2019-08-29-valuex/ - name: 心率管家 App 的设计与开发 url: blog/2019-07-23-heartmate/"},{"title":"第三方插件","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/theme-settings/plugins/index.html","permalink":"https://volantis.js.org/v3/theme-settings/plugins/","excerpt":"","text":"插件库Volantis 为丰富的插件提供了兼容性优化。大部分插件您只需开启和关闭，无需进行设置。 blog/_config.volantis.ymlplugins: ################ required plugins ################ # jquery jquery: https://cdn.jsdelivr.net/npm/jquery@3.5/dist/jquery.min.js ################ optional plugins ################ # fontawesome fontawesome: https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.13/css/all.min.css # fontawesome animation fontawesome_animation: https://cdn.jsdelivr.net/gh/l-lin/font-awesome-animation/dist/font-awesome-animation.min.css # fancybox fancybox: https://cdn.jsdelivr.net/npm/@fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css ######## Plugins to improve loading speed: # Preload (The menu's url must end with ‘/’) instant_page: https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@2/js/instant_page.js ######## Plugins to optimize the experience: # highlight.js highlightjs: js: https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@9.18.1/build/highlight.min.js css: https://cdn.jsdelivr.net/npm/highlight.js@9.18.1/styles/solarized-light.css # more: https://www.jsdelivr.com/package/npm/highlight.js?path=styles # https://scrollrevealjs.org/api/reveal.html scrollreveal: js: https://cdn.jsdelivr.net/npm/scrollreveal@4.0.6/dist/scrollreveal.min.js distance: 32px duration: 800 # ms interval: 20 # ms scale: 1 # 0.1~1 # Codeblock Copy Button clipboard: https://cdn.jsdelivr.net/npm/clipboard@2/dist/clipboard.min.js ######## Plugins for SEO: # Traffic statistics (very slow loading) busuanzi: https://cdn.jsdelivr.net/gh/volantis-x/cdn-busuanzi@2.3/js/busuanzi.pure.mini.js # npm i --save hexo-wordcount wordcount: #true ######## Plugins for ... # Button Ripple Effect nodewaves: css: https://cdn.jsdelivr.net/npm/node-waves@0.7.6/dist/waves.min.css js: https://cdn.jsdelivr.net/npm/node-waves@0.7.6/dist/waves.min.js # Typing Effects comment_typing: #https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@2/js/comment_typing.js # Slide Background backstretch: enable: true js: https://cdn.jsdelivr.net/npm/jquery-backstretch@2.1.18/jquery.backstretch.min.js position: cover # cover: sticky on the cover. fixed: Fixed as background for the site. shuffle: true # shuffle playlist duration: 20000 # Duration (ms) fade: 1500 # fade duration (ms) (Not more than 1500) images: # For personal use only. At your own risk if used for commercial purposes !!! - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/001.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/002.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/003.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/004.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/005.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/006.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/012.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/016.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/019.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/033.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/034.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/035.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/038.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/039.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/042.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/046.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/051.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/052.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/054.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/056.jpg # APlayer is only available in mainland China. # APlayer config: https://github.com/metowolf/MetingJS aplayer: enable: true js: - https://cdn.jsdelivr.net/npm/aplayer@1.10/dist/APlayer.min.js - https://cdn.jsdelivr.net/npm/meting@2.0/dist/Meting.min.js - js/aplayer.js # Required server: netease # netease, tencent, kugou, xiami, baidu type: playlist # song, playlist, album, search, artist id: 3175833810 # song id / playlist id / album id / search keyword # Optional fixed: false # enable fixed mode theme: '#1BCDFC' # main color autoplay: false # audio autoplay order: list # player play order, values: 'list', 'random' loop: all # player loop play, values: 'all', 'one', 'none' volume: 0.7 # default volume, notice that player will remember user setting, default volume will not work after user set volume themselves list_max_height: 320px # list max height list_folded: true pjax: enable: true timeout: 5000 # The timeout in milliseconds for the XHR requests. Set to 0 to disable the timeout. cacheBust: false # When set to true, Pjax appends a timestamp to skip the browser cache. animation: nprogress # nprogress, circle banUrl: # 被屏蔽的 url 地址将不启用 pjax 跳转，可以在控制台下使用 window.location.pathname 获取 # - '/about/index.html' # Artitalk https://artitalk.js.org # 配置过程请参考：https://artitalk.js.org/doc.html # 除appID和appKEY外均为选填项 Artitalk: enable: false # true为开启，false为关闭 appID: ogP8qj3veMh0LFpFWMPOyF0X-MdYXbMMI # your appID appKEY: nHXLd3N3Jgh460t2iRQKWAtr # your appKEY # severurl: #leancloud绑定的安全域名，使用国际版的话不需要填写 # slanguage: # 语言设置，zh为汉语，en为英语，es为西班牙语。默认为汉语 # per: #每页说说的显示数量 # placeholder1: #在编辑说说的输入框中的占位符 # placeholder2: #自定义头像url的输入框的占位符 # lazy: #加载动画的开关，1为开，0为关，默认为开 # bgimg: #说说输入框背景图片url # color1: #说说背景颜色1&按钮颜色1 # color2: #说说背景颜色2&按钮颜色2 # color3: #说说字体颜色 ################################## # 暗黑模式 darkmodejs # https://darkmodejs.learn.uno # 暗黑模式样式：https://github.com/volantis-x/hexo-theme-volantis/blob/master/source/css/_third-party/darkmode.styl darkmodejs: enable: false js: https://cdn.jsdelivr.net/npm/darkmode-js@1.5/lib/darkmode-js.min.js bottom: 32px right: unset left: 16px time: 0s mixColor: '#f4f4f4' backgroundColor: '#f4f4f4' buttonColorDark: '#100f2c' buttonColorLight: '#f4f4f4' saveInCookies: true label: 🌓 autoMatchOsTheme: true 幻灯片背景blog/_config.volantis.ymlplugins: ... backstretch: enable: true js: https://cdn.jsdelivr.net/npm/jquery-backstretch@2.1.18/jquery.backstretch.min.js position: cover # cover: sticky on the cover. fixed: Fixed as background for the site. duration: 20000 # Duration (ms) fade: 1500 # fade duration (ms) (Not more than 1500) images: # For personal use only. At your own risk if used for commercial purposes !!! - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg ... 幻灯片背景图片显示的位置可以选择粘贴在封面上，跟随封面一起滑动，也可以选择固定作为网页背景图片。 highlight.jsblog/_config.volantis.ymlplugins: ... highlightjs: js: https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@9.18.1/build/highlight.min.js css: https://cdn.jsdelivr.net/npm/highlight.js@9.18.1/styles/solarized-light.css 如果需要使用 highlight.js 进行语法高亮，请将站点配置文件中的 highlight.enable 设置为 false 否则不会加载插件。您可以在 94 种 语法高亮主题 中挑选喜爱的主题，然后替换上面的 css 链接。 如果您使用 highlight.js 请确保没有使用 hexo 官方的 codeblock 标签，否则会报错。 经测试，使用 highlight.js 的情况下，部分容器内的代码可能仍然会被渲染甚至报错。 APlayer 音乐播放器blog/_config.volantis.ymlplugins: ... aplayer: enable: true js: - https://cdn.jsdelivr.net/npm/aplayer@1.10/dist/APlayer.min.js - https://cdn.jsdelivr.net/npm/meting@2.0/dist/Meting.min.js # Required server: netease # netease, tencent, kugou, xiami, baidu type: playlist # song, playlist, album, search, artist id: 3175833810 # song id / playlist id / album id / search keyword # Optional fixed: false # enable fixed mode theme: '#1BCDFC' # main color autoplay: false # audio autoplay order: list # player play order, values: 'list', 'random' loop: all # player loop play, values: 'all', 'one', 'none' volume: 0.7 # default volume, notice that player will remember user setting, default volume will not work after user set volume themselves list_max_height: 340px # list max height list_folded: true APlayer播放器只可以在中国大陆地区使用。相关文档： APlayer | MetingJS Artitalkblog/_config.volantis.ymlplugins: ... # Artitalk https://artitalk.js.org # 配置过程请参考：https://artitalk.js.org/doc.html # 除appID和appKEY外均为选填项 Artitalk: enable: false # true为开启，false为关闭 appID: ogP8qj3veMh0LFpFWMPOyF0X-MdYXbMMI # your appID appKEY: nHXLd3N3Jgh460t2iRQKWAtr # your appKEY # severurl: #leancloud绑定的安全域名，使用国际版的话不需要填写 # slanguage: # 语言设置，zh为汉语，en为英语，es为西班牙语。默认为汉语 # per: #每页说说的显示数量 # placeholder1: #在编辑说说的输入框中的占位符 # placeholder2: #自定义头像url的输入框的占位符 # lazy: #加载动画的开关，1为开，0为关，默认为开 # bgimg: #说说输入框背景图片url # color1: #说说背景颜色1&按钮颜色1 # color2: #说说背景颜色2&按钮颜色2 # color3: #说说字体颜色"},{"title":"站内搜索","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/theme-settings/search/index.html","permalink":"https://volantis.js.org/v3/theme-settings/search/","excerpt":"","text":"blog/_config.volantis.ymlsearch: enable: true service: hexo # hexo, google, algolia, azure, baidu js: https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@2.6.4/js/search.js google: apiKey: engineId: algolia: applicationID: apiKey: indexName: azure: serviceName: indexName: queryKey: baidu: apiId: 默认配置为 Hexo 搜索，但是需要安装插件才能使用： npm i -S hexo-generator-search hexo-generator-json-content"},{"title":"自定义主题外观","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/theme-settings/style/index.html","permalink":"https://volantis.js.org/v3/theme-settings/style/","excerpt":"","text":"最大布局宽度blog/_config.volantis.ymlstyle: ... max_width: 1080px # Sum of body width and sidebar width 网页所呈现的内容的最大宽度，即 body 和 sidebar 的宽度之和。 抗锯齿blog/_config.volantis.ymlstyle: ... font_smoothing: true # font-smoothing for webkit 自定义光标样式blog/_config.volantis.ymlstyle: ... cursor: enable: true text: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/text.png pointer: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/pointer.png default: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/left_ptr.png not-allowed: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/circle.png zoom-out: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/zoom-out.png zoom-in: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/zoom-in.png grab: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/openhand.png 导航栏样式您可以设置导航栏的高度以及视觉特效，视觉特效目前可选的有： shadow：卡片阴影。 floatable：当鼠标移动到容器内时，呈现出浮起来的效果。 blur：背景模糊效果（毛玻璃），当浏览器不支持时显示为不透明。 blog/_config.volantis.ymlstyle: ... navbar: height: 64px effect: [shadow, blur] # [shadow, floatable, blur] 滚动条样式blog/_config.volantis.ymlstyle: ... scrollbar: size: 4px border: 2px color: '#2196f3' hover: '#ff5722' 侧边栏样式视觉特效参数同上，值得注意的是：卡片的 floatable 效果和 blur 效果相冲突。 blog/_config.volantis.ymlstyle: ... sidebar: effect: [shadow] # [shadow, floatable, blur] 正文区域样式视觉特效参数同上，值得注意的是：卡片的 floatable 效果和 blur 效果相冲突。您可以在 language: true 这里设置代码块显示语言名称。text_align 可以设置 h1/h2/h3/h4/p 的文字对齐方向。 blog/_config.volantis.ymlstyle: ... body: effect: [shadow] # [shadow, floatable, blur] highlight: language: true # show language of codeblock copy_btn: true text_align: # left, right, justify, center h1: left h2: left h3: left h4: left p: justify note: # style for default note: {% note text %} icon: '\\f054' color: '' 布局间距您可以设置几种标题的布局间距 h2/h3/h4、段落间距 line、区块内部的段落间距 inline。 blog/_config.volantis.ymlstyle: ... gap: h2: 48px # Spacing above H2 (only px unit) h3: 32px # Spacing above H3 (only px unit) h4: 16px # Spacing above H4 (only px unit) paragraph: 1rem # Paragraph spacing between paragraphs row: .5rem # Paragraph spacing between other elements 自定义字体您可以自定义正文和代码字体。 blog/_config.volantis.ymlstyle: ... fontfamily: logofont: fontfamily: '"Varela Round", "PingFang SC", "Microsoft YaHei", Helvetica, Arial' name: 'Varela Round' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/VarelaRound/VarelaRound-Regular.ttf weight: normal style: normal bodyfont: fontfamily: 'UbuntuMono, "PingFang SC", "Microsoft YaHei", Helvetica, Arial' name: 'UbuntuMono' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/UbuntuMono/UbuntuMono-Regular.ttf weight: normal style: normal codefont: fontfamily: 'Menlo, Monaco' name: 'Monaco' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/Monaco/Monaco.ttf weight: normal style: normal 自定义颜色blog/_config.volantis.ymlstyle: ... color: site: '#21232F' # Website background color card: '#444' # Card background color text: '#fff' # The color of the text on the card. theme: '#ff9800' # Main color link: '#1BCDFC' # Link color hover: '#ff5722' # Link highlight color inner: '#333' # Text color inside the button block: '#555' # Block color inlinecode: yellow # Inline code color codeblock: '#555' # Codeblock color p: '#ccc' # Paragraph color 自定义右键菜单blog/_config.volantis.ymlrightmenu: enable: true # hr: 分割线, music: 音乐控制器 layout: [home, help, examples, contributors, hr, source_docs, source_theme, hr, print, hr, music] # 可选功能项 print: name: 打印页面 icon: fa fa-print onclick: document.execCommand('print') # 自定义菜单的格式如下 help: name: 常见问题 icon: fa fa-question url: https://volantis.js.org/faqs/ examples: name: 示例博客 icon: fa fa-rss url: https://volantis.js.org/examples/ contributors: name: 加入社区 icon: fa fa-fan fa-spin url: https://volantis.js.org/contributors/ source_docs: name: 本站源码 icon: fa fa-code-branch url: https://github.com/volantis-x/volantis-docs/ source_theme: name: 主题源码 icon: fa fa-code-branch url: https://github.com/volantis-x/hexo-theme-volantis/"},{"title":"卡片式组件","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v3/theme-settings/widget/index.html","permalink":"https://volantis.js.org/v3/theme-settings/widget/","excerpt":"","text":"widget 即小部件，大部分小部件都可以放置在侧边栏，一部分已经为正文区域显示做了优化，还有一部分只可以放置在文章页脚部分。与 meta 库不同的是：除了现有的 widget ，您可以很轻易地创建自己的 widget ，然后放在需要的地方。此外，您还可以将 widget 写在单独的文件中。 查看所有相关配置 blog/_config.volantis.ymlwidget: # The following can be written in `blog/source/_data/widget.yml` # --------------------------------------- # blogger info widget blogger: class: blogger display: [desktop] # [desktop, mobile] avatar: https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png title: subtitle: jinrishici: true # Poetry Today. You can set a string, and it will be displayed when loading fails. social: true # --------------------------------------- # toc widget (valid only in articles) toc: class: toc display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-list title: 本文目录 list_number: false min_depth: 2 max_depth: 5 # --------------------------------------- # category widget category: class: category display: [desktop] # [desktop, mobile] header: icon: fas fa-folder-open title: 文章分类 url: /blog/categories/ # --------------------------------------- # tagcloud widget tagcloud: class: tagcloud display: [desktop] # [desktop, mobile] header: icon: fas fa-tags title: 热门标签 url: /blog/tags/ min_font: 14 max_font: 24 color: true start_color: '#999' end_color: '#555' # --------------------------------------- # related posts widget related_posts: class: related_posts # npm i -S hexo-related-popular-posts display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-bookmark title: 相关文章 max_count: 5 # --------------------------------------- # copyright widget (valid only in articles) copyright: class: copyright display: [desktop, mobile] # [desktop, mobile] blockquote: true permalink: '本文永久链接是：' content: - '博客内容遵循 署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 协议' - permalink # --------------------------------------- # qrcode widget donate: class: qrcode display: [desktop, mobile] # [desktop, mobile] height: 64px # Automatic height if not set fancybox: true images: - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png # You can add your own widget here or 'blog/source/_data/widget.yml' # class: text, list, grid, qrcode, page, ... see more at https://volantis.js.org/ 每一个小部件都有 class 和 display，前者代表这个小部件是什么，后者代表这个小部件在什么桌面和移动平台中是否显示，如果在移动平台显示，由于屏幕宽度有限，侧边栏的小部件则会被移动到正文区域下方，因此部分侧边栏小部件便失去意义，建议设置为仅桌面端显示。 小部件名: class: 小部件类别 display: [小部件在桌面端显示, 小部件在移动设备显示] 博主信息部件blog/_config.volantis.ymlblogger: class: blogger display: [desktop] # [desktop, mobile] avatar: https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png title: subtitle: jinrishici: true # Poetry Today. You can set a string, and it will be displayed when loading fails. social: true 其中，今日诗词 jinrishici 如果设置为一个字符串，这个字符串会变成占位文字，加载失败时显示。如果不需要，就请设置为 jinrishici: false。social 的具体内容请在网站页脚部分设置。 文章目录部件blog/_config.volantis.ymltoc: class: toc display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-list title: 本文目录 list_number: false min_depth: 2 max_depth: 5 这个部件只能放置在侧边栏，并且在文章中有效。在移动设备中预览时，手指向上滑动时，导航栏右边会出现 TOC 按钮，点击即可展开 TOC 部件。如果您需要显示章节序号，请设置 list_number。 min_depth 和 max_depth 代表 TOC 支持的标题层级，最大范围是2～6。 文章分类部件blog/_config.volantis.ymlcategory: class: category display: [desktop] # [desktop, mobile] header: icon: fas fa-folder-open title: 文章分类 url: /blog/categories/ 这个部件可以直接显示所有文章分类，如果您希望有一个独立的页面来展示，需要自己创建一个文件，具体操作在「页面」部分文档中。 标签云部件blog/_config.volantis.ymltagcloud: class: tagcloud display: [desktop] # [desktop, mobile] header: icon: fas fa-tags title: 热门标签 url: /blog/tags/ min_font: 14 max_font: 24 color: true start_color: '#999' end_color: '#555' 这个部件可以直接显示所有文章的标签，如果您希望有一个独立的页面来展示，需要自己创建一个文件，具体操作在「页面」部分文档中。 相关文章部件blog/_config.volantis.ymlrelated_posts: class: related_posts # npm i -S hexo-related-popular-posts display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-bookmark title: 相关文章 max_count: 5 这个小部件建议放置在文章页脚，要使用这个部件，您需要安装插件： npm i -S hexo-related-popular-posts 值得注意的是，开启了这个功能之后，每次修改文章内容包括 front-matter 之后，都需要重新 hexo s。 文章版权部件blog/_config.volantis.ymlcopyright: class: copyright display: [desktop, mobile] # [desktop, mobile] blockquote: true permalink: '本文永久链接是：' content: - '博客内容遵循 署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 协议' - permalink 这个部件只可以放置在文章页脚。 二维码部件blog/_config.volantis.ymldonate: class: qrcode display: [desktop, mobile] # [desktop, mobile] height: 64px # Automatic height if not set fancybox: true images: - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png 您可以放置在文章页脚用于展示打赏图片，也可以放置在侧边栏。 通用文本部件blog/_config.volantis.ymlrepos: class: text display: [desktop] # [desktop, mobile] header: icon: fab fa-github title: 点个赞吧 url: https://github.com/xaoxuu/ content: - '您的赞对我来说很重要，如果您喜欢本主题，希望能够给下面的项目点个赞来支持一下。' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/prohud/logo.png" height="50px">](https://github.com/xaoxuu/ProHUD)' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/valuex/logo.png" height="50px">](https://github.com/xaoxuu/ValueX)' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/inspire/logo.png" height="50px">](https://github.com/xaoxuu/Inspire)' 您可以创建用于展示任何文本内容的文本部件。 通用列表部件blog/_config.volantis.ymlwiki-hexo-theme: class: list display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-chevron-left title: Hexo Themes url: /wiki/ rows: - name: Volantis for Hexo url: /wiki/volantis/ - name: Resume for Hexo url: /wiki/resume/ 您可以创建用于展示任何链接列表的列表部件。列表的 rows 中的每一项支持的属性有： name、url、icon、img、avatar，其中 img 是方形图片的链接，avatar 是圆形图片的链接。 参考资料这个部件的布局继承自 list 部件，用于展示文章的参考资料。请将您的 Volantis 升级至 2.5 版本以上使用。 blog/_config.volantis.ymlreferences: class: references # is subclass of list display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-quote-left title: 参考资料 在文章的 front-matter 中设置： front-matterreferences: - name: Apple Developer Documentation url: https://developer.apple.com/documentation/ 组索引这个部件的布局继承自 list 部件，用于展示文章所属的分组的文章列表。请将您的 Volantis 升级至 2.5 版本以上使用。 blog/_config.volantis.ymlgroup-1: class: group display: [desktop, mobile] # [desktop, mobile] header: icon: fab fa-apple title: Developer url: /wiki/ios/ 在文章的 front-matter 中设置： front-mattergroup: group-1order: 16sidebar: [group-1, toc] 「group-1」卡片将会以列表的形式显示所有设置了 group: group-1 的文章，顺序按照 order 从小到大排列。 通用网格部件blog/_config.volantis.ymlfeedback: class: grid display: [desktop, mobile] header: icon: fas fa-headset title: 联系开发者 url: https://github.com/volantis-x/hexo-theme-volantis fixed: true # 固定宽度 rows: - name: 反馈BUG icon: fas fa-bug url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: 疑问求助 icon: fas fa-question-circle url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: 提个建议 icon: fas fa-lightbulb url: https://github.com/volantis-x/hexo-theme-volantis/issues/ 您可以创建用于展示任何链接列表的网格部件。网格默认根据文字长度自动确定每一个格子的宽度，如果文字长短不一，建议通过设置 fixed: true 来固定宽度，此时文字过长的格子中的文字会换行显示。 通用页面部件blog/_config.volantis.ymltest: class: page display: [desktop, mobile] pid: haha content: excerpt # excerpt, more, content 您可以把整个页面的md内容作为一个小部件渲染显示出来。只需要设置小部件里的 pid 属性和文章的 front-matter 中设置一样的 pid 即可。 content 代表这个部件显示的内容，可选 excerpt，more，content 分别对应文章的摘要、摘要后面的内容、全文。 部件库文件部件库中的所有部件都可以写在部件库文件中，您需要创建一个文件在以下路径： blog/source/_data/widget.yml 文件内容示例：widget.yml"},{"title":"标签插件","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v2/tag-plugins/index.html","permalink":"https://volantis.js.org/v2/tag-plugins/","excerpt":"","text":"主题原生支持丰富多彩的标签。 文本和段落Span & P请将您的 Volantis 升级至 2.5 版本以上使用。 语法格式参数列表示例写法示例效果行内文本 {% span 样式参数, 文本内容 %} 独立段落 {% p 样式参数, 文本内容 %}样式参数位置可以写颜色、大小和对齐方向，多个样式参数用空格隔开。 字体 logo, code 颜色 red, yellow, green, cyan, blue, gray 大小 small, h4, h3, h2, h1, large, huge, ultra 对齐方向 left, center, right彩色文字 example.md:在一段话中方便插入各种颜色的标签，包括：{% span red, 红色 %}、{% span yellow, 黄色 %}、{% span green, 绿色 %}、{% span cyan, 青色 %}、{% span blue, 蓝色 %}、{% span gray, 灰色 %}。 超大文字 example.md:文档「开始」页面中的标题部分就是超大文字。{% p center logo large, Volantis %}{% p center small, A Wonderful Theme for Hexo %}彩色文字 在一段话中方便插入各种颜色的标签，包括：红色、黄色、绿色、青色、蓝色、灰色。 超大文字 文档「开始」页面中的标题部分就是超大文字。 Volantis A Wonderful Theme for Hexo Note & NoteBlockNoteBlock 是 Blockquote 的增强版，在左边显示图标，并且可以自定颜色。而 Note 是 NoteBlock 的简便写法。请将您的 Volantis 升级至 2.3 版本以上使用。 语法格式参数列表示例写法示例效果Note {% note 样式参数, 文本内容 %} NoteBlock {% noteblock 样式参数 %}文本段落{% endnoteblock %}样式参数位置可以写图标和颜色，多个样式参数用空格隔开。 图标 彩色的quote, info, warning, done/success, error/danger 灰色的，也可以指定颜色radiation, bug, idea, link, paperclip, todo, msg, guide, download, up, undo 颜色 指定颜色clear, light, gray, red, yellow, green, cyan, blueNote example.md:{% note, 为简单的一句话提供的简便写法。 %}{% note success, 支持同样丰富的参数。 %} NoteBlock example.md:可以在区块中放置一些复杂的结构，支持嵌套。{% noteblock quote %}{% p subtitle, 小标题 %}Windows 10不是為所有人設計,而是為每個人設計{% p subtitle, 嵌套测试 %}{% noteblock %}请坐和放宽，我正在帮你搞定一切...{% endnoteblock %}{% p subtitle, Folding 测试 %}{% folding 点击查看更多 %}{% note warning, 不要说我们没有警告过你 %}{% noteblock bug red %}我们都有不顺利的时候{% endnoteblock %}{% endfolding %}{% endnoteblock %}Note 为简单的一句话提供的简便写法。 支持同样丰富的参数。 NoteBlock 可以在区块中放置一些复杂的结构，支持嵌套。 小标题Windows 10不是為所有人設計,而是為每個人設計嵌套测试请坐和放宽，我正在帮你搞定一切...Folding 测试 点击查看更多 不要说我们没有警告过你我们都有不顺利的时候 Checkbox & Radio请将您的 Volantis 升级至 2.6 版本以上使用。 语法格式参数列表示例写法示例效果{% checkbox 样式参数（可选）, 文本（支持简单md） %}颜色 red, yellow, green, cyan, blue 样式 plus, minus, times 选中状态 checkedCheckbox example.md:{% checkbox 纯文本测试 %}{% checkbox checked, 支持简单的 [markdown](https://guides.github.com/features/mastering-markdown/) 语法 %}{% checkbox red, 支持自定义颜色 %}{% checkbox green checked, 绿色 + 默认选中 %}{% checkbox yellow checked, 黄色 + 默认选中 %}{% checkbox cyan checked, 青色 + 默认选中 %}{% checkbox blue checked, 蓝色 + 默认选中 %}{% checkbox plus green checked, 增加 %}{% checkbox minus yellow checked, 减少 %}{% checkbox times red checked, 叉 %} Radio example.md:{% radio 纯文本测试 %}{% radio checked, 支持简单的 [markdown](https://guides.github.com/features/mastering-markdown/) 语法 %}{% radio red, 支持自定义颜色 %}{% radio green, 绿色 %}{% radio yellow, 黄色 %}{% radio cyan, 青色 %}{% radio blue, 蓝色 %}Checkbox 纯文本测试 支持简单的 markdown 语法 支持自定义颜色 绿色 + 默认选中 黄色 + 默认选中 青色 + 默认选中 蓝色 + 默认选中 增加 减少 叉 Radio 纯文本测试 支持简单的 markdown 语法 支持自定义颜色 绿色 黄色 青色 蓝色 按钮和菜单基础按钮请将您的 Volantis 升级至 2.4 版本以上使用。 语法格式参数列表示例写法示例效果{% btn 样式参数（可选）, 标题, 链接, 图标（可选） %} 可选的参数可以省略，但是前后顺序不能乱。样式参数 regular, large, center 图标 第1个或者第2个参数包含 fa- 的那个被识别为图标。example.md:不设置任何参数的 {% btn 按钮, / %} 适合融入段落中。regular 按钮适合独立于段落之外：{% btn regular, 示例博客, https://xaoxuu.com, fas fa-play-circle %}large 按钮更具有强调作用，建议搭配 center 使用：{% btn center large, 开始使用, https://volantis.js.org/v3/getting-started/, fas fa-download %}不设置任何参数的 按钮 适合融入段落中。 regular 按钮适合独立于段落之外： 示例博客 large 按钮更具有强调作用，建议搭配 center 使用： 开始使用 富文本按钮请将您的 Volantis 升级至 2.3 版本以上使用。 语法格式参数列表示例写法示例效果{% btns 样式参数 %}{% cell 标题, 链接, 图片或者图标 %}{% cell 标题, 链接, 图片或者图标 %}{% endbtns %}样式参数位置可以写图片样式、布局方式，多个样式参数用空格隔开。 圆角样式 默认为方形 rounded, circle 布局方式 默认为自动宽度，适合视野内只有一两个的情况。 参数 含义 wide 宽一点的按钮 fill 填充布局，自动铺满至少一行，多了会换行。 center 居中，按钮之间是固定间距。 around 居中分散 grid2 等宽最多2列，屏幕变窄会适当减少列数。 grid3 等宽最多3列，屏幕变窄会适当减少列数。 grid4 等宽最多4列，屏幕变窄会适当减少列数。 grid5 等宽最多5列，屏幕变窄会适当减少列数。 增加文字样式 可以在容器内增加 <b>标题</b> 和 <p>描述文字</p>如果需要显示类似「团队成员」之类的一组含有头像的链接： example.md:{% btns circle grid5 %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% endbtns %} 或者含有图标的按钮： example.md:{% btns rounded grid5 %}{% cell 下载源码, /, fas fa-download %}{% cell 查看文档, /, fas fa-book-open %}{% endbtns %} 圆形图标 + 标题 + 描述 + 图片 + 网格5列 + 居中 example.md:{% btns circle center grid5 %}<a href='https://apps.apple.com/cn/app/heart-mate-pro-hrm-utility/id1463348922?ls=1'> <i class='fab fa-apple'></i> <b>心率管家</b> {% p red, 专业版 %} <img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/qrcode/heartmate_pro.png'></a><a href='https://apps.apple.com/cn/app/heart-mate-lite-hrm-utility/id1475747930?ls=1'> <i class='fab fa-apple'></i> <b>心率管家</b> {% p green, 免费版 %} <img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/qrcode/heartmate_lite.png'></a>{% endbtns %}如果需要显示类似「团队成员」之类的一组含有头像的链接： xaoxuu xaoxuu xaoxuu xaoxuu xaoxuu 或者含有图标的按钮： 下载源码 查看文档 圆形图标 + 标题 + 描述 + 图片 + 网格5列 + 居中 心率管家 专业版 心率管家 免费版 Menu请将您的 Volantis 升级至 2.4 版本以上使用。 语法格式示例写法示例效果容器 {% menu 下拉菜单, 图标 %}菜单内容{% endmenu %} 菜单内容 菜单项 {% menuitem 文本, 链接, 图标 %} 分割线 {% menuitem hr %} 子菜单 {% submenu 嵌套菜单, 图标 %}菜单内容{% endsubmenu %}{% menu 下拉菜单 %}{% menuitem 主题源码, https://github.com/volantis-x/hexo-theme-volantis/, fas fa-file-code %}{% menuitem 更新日志, https://github.com/volantis-x/hexo-theme-volantis/releases/, fas fa-clipboard-list %}{% menuitem hr %}{% submenu 有疑问？, fas fa-question-circle %}{% menuitem 看 FAQ, /faqs/ %}{% menuitem 看 本站源码, https://github.com/volantis-x/volantis-docs/ %}{% menuitem 提 Issue, https://github.com/volantis-x/hexo-theme-volantis/issues/ %}{% endsubmenu %}{% endmenu %} 下拉菜单 主题源码 更新日志 有疑问？ 看 FAQ 看 本站源码 提 Issue 容器Tab此插件移植自 NexT #tabs 。请将您的 Volantis 升级至 2.1 版本以上使用。 语法格式参数列表{% tabs tab-id %}<!-- tab tab-name -->![](https://i.loli.net/2020/03/18/f5PQlWisvm9zbgK.jpg)<!-- endtab --><!-- tab tab-name -->这里面写内容，支持的语法格式有限，请尽量<u>不要</u>写太过复杂的东西。<!-- endtab -->{% endtabs %}tab-id 必填，如果一个页面有多个 tabs 时，tab-id 不能重复。 tab-name 标签文本。 Folding请将您的 Volantis 升级至 2.3 版本以上使用。 语法格式参数列表示例写法示例效果{% folding 参数（可选）, 标题 %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endfolding %}参数位置可以填写颜色和状态，多个参数用空格隔开。 颜色 blue, cyan, green, yellow, red 状态 状态填写 open 代表默认打开。{% folding 查看图片测试 %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endfolding %}{% folding cyan open, 查看默认打开的折叠框 %}这是一个默认打开的折叠框。{% endfolding %}{% folding green, 查看代码测试 %}{% endfolding %}{% folding yellow, 查看列表测试 %}- haha- hehe{% endfolding %}{% folding red, 查看嵌套测试 %}{% folding blue, 查看嵌套测试2 %}{% folding 查看嵌套测试3 %}hahaha <span><img src='https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/tieba/%E6%BB%91%E7%A8%BD.png' style='height:24px'></span>{% endfolding %}{% endfolding %}{% endfolding %} 查看图片测试 查看默认打开的折叠框 这是一个默认打开的折叠框。 查看代码测试 {% folding green, 查看代码测试 %}查看代码测试{% endfolding %} 查看列表测试 hahahehe 查看嵌套测试 查看嵌套测试2 查看嵌套测试3 hahaha 多媒体包括图片、音频、视频。 ImageImage 标签是一种针对单个图片应用场景的标签，支持图片描述文字和指定宽度。请将您的 Volantis 升级至 2.6 版本以上使用。 语法格式参数列表示例写法示例效果{% image 链接, width=宽度（可选）, alt=描述（可选） %}图片宽度 阿拉伯数字 + px example:width=300px 图片描述 纯文本，不能包含引号。example.md:添加描述：{% image https://i.loli.net/2020/04/06/zdeQiOY9rBCjhDR.jpg, alt=每天下课回宿舍的路，承载了太多记忆。 %}指定宽度：{% image https://i.loli.net/2020/04/06/zdeQiOY9rBCjhDR.jpg, width=300px %}指定宽度并添加描述：{% image https://i.loli.net/2020/04/06/zdeQiOY9rBCjhDR.jpg, width=300px, alt=每天下课回宿舍的路，承载了太多记忆。 %}添加描述： 每天下课回宿舍的路，承载了太多记忆。 指定宽度： 指定宽度并添加描述： 每天下课回宿舍的路，承载了太多记忆。 FancyboxFancybox 标签是一种针对一组图片应用场景的标签。请将您的 Volantis 升级至 2.2 版本以上使用。 语法格式参数列表示例写法示例效果{% fancybox 参数, 列数 %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B18FCBB3-67FD-48CC-B4F3-457BA145F17A.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/67239FBB-E15D-4F4F-8EE8-0F1C9F3C4E7C.jpeg){% endfancybox %}对齐方向 left, center, right 缩放 stretch 列数 逗号后面直接写列数，支持 2 ～ 8 列。设定列列数之后就是「多行多图」布局，此时图片默认左对齐。为了避免图片大小不一，建议搭配 stretch 来时图片放大填充。一行一个图片 example.md:{% fancybox %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endfancybox %} 一行多个图片（不换行） example.md:{% fancybox %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B18FCBB3-67FD-48CC-B4F3-457BA145F17A.jpeg)![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/67239FBB-E15D-4F4F-8EE8-0F1C9F3C4E7C.jpeg)![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/00E0F0ED-9F1C-407A-9AA6-545649D919F4.jpeg){% endfancybox %} 多行多个图片（每行2～8个图片） example.md:{% fancybox stretch, 4 %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B951AE18-D431-417F-B3FE-A382403FF21B.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/AEB33F9D-7294-4CF1-B8C5-3020748A9D45.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/250662D4-5A21-4AAA-BB63-CD25CF97CFF1.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/10A0FCE5-36A1-4AD0-8CF0-019259A89E03.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B951AE18-D431-417F-B3FE-A382403FF21B.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/AEB33F9D-7294-4CF1-B8C5-3020748A9D45.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/250662D4-5A21-4AAA-BB63-CD25CF97CFF1.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/10A0FCE5-36A1-4AD0-8CF0-019259A89E03.jpeg){% endfancybox %}一行一个图片 图片描述 一行多个图片（不换行） 图片描述 图片描述 图片描述 多行多个图片（每行2～8个图片） Audio请将您的 Volantis 升级至 2.4 版本以上使用。 语法格式示例写法示例效果example.md:{% audio 音频链接 %}example.md:{% audio https://github.com/volantis-x/volantis-docs/releases/download/assets/Lumia1020.mp3 %}Your browser does not support the audio tag. Video请将您的 Volantis 升级至 2.3 版本以上使用。 语法格式参数列表示例写法示例效果单个视频 example.md:{% video 视频链接 %} 多个视频 example.md:{% videos 对齐方向, 列数 %}{% video 视频链接 %}{% video 视频链接 %}{% video 视频链接 %}{% endvideos %}对齐方向 left, center, right 列数 逗号后面直接写列数，支持 1 ～ 4 列。100%宽度 example.md:{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %} 50%宽度 example.md:{% videos, 2 %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% endvideos %} 25%宽度 example.md:{% videos, 4 %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% endvideos %}100%宽度 Your browser does not support the video tag. 50%宽度 Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. 25%宽度 Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. APlayer主题对 APlayer 插件的样式进行了兼容。安装插件： npm i -S hexo-tag-aplayer 官方文档： hexo-tag-aplayer 公式MathJax公式默认是不渲染的，如果文章内有公式，需要在 front-matter 中设置开启。 example.md:---title: 渲染公式（MathJax）date: 2020-02-23mathjax: true # false: 不渲染, true: 渲染, internal: 只在文章内部渲染，文章列表中不渲染---$$t+1=2$$$$\\mbox{积累因子}=\\begin{cases}1+ni & \\mbox{单利}\\\\\\\\(1+i)^n & \\mbox{复利}\\end{cases}$$$$\\begin{equation}\\sum_{i=0}^n F_i \\cdot \\phi (H, p_i) - \\sum_{i=1}^n a_i \\cdot ( \\tilde{x_i}, \\tilde{y_i}) + b_i \\cdot ( \\tilde{x_i}^2 , \\tilde{y_i}^2 )\\end{equation}$$$$\\begin{equation}\\beta^*(D) = \\mathop{argmin} \\limits_{\\beta} \\lambda {||\\beta||}^2 + \\sum_{i=1}^n max(0, 1 - y_i f_{\\beta}(x_i))\\end{equation}$$ 示例效果 $$t+1=2$$$$\\mbox{积累因子}=\\begin{cases}1+ni & \\mbox{单利}\\\\(1+i)^n & \\mbox{复利}\\end{cases}$$$$\\begin{equation}\\sum_{i=0}^n F_i \\cdot \\phi (H, p_i) - \\sum_{i=1}^n a_i \\cdot ( \\tilde{x_i}, \\tilde{y_i}) + b_i \\cdot ( \\tilde{x_i}^2 , \\tilde{y_i}^2 )\\end{equation}$$$$\\begin{equation}\\beta^*(D) = \\mathop{argmin} \\limits_{\\beta} \\lambda {||\\beta||}^2 + \\sum_{i=1}^n max(0, 1 - y_i f_{\\beta}(x_i))\\end{equation}$$ 如果公式仍无法正确渲染可以阅读 @MicDZ 的这篇文章：《在material-x上使用KaTeX》。 Hexo 标签引用块引用书上的句子 Do not just seek happiness for yourself. Seek happiness for all. Through kindness. Through mercy. David LevithanWide Awake 代码块{% codeblock [title] [lang:language] [url] [link text] [additional options] %}code snippet{% endcodeblock %} 指定语言[rectangle setX: 10 y: 10 width: 20 height: 20]; example.md:{% codeblock lang:objc %}[rectangle setX: 10 y: 10 width: 20 height: 20];{% endcodeblock %} 附加说明Array.maparray.map(callback[, thisArg]) example.md:{% codeblock Array.map %}array.map(callback[, thisArg]){% endcodeblock %} 行标、高亮12345678n=eval(input())if n==0: print("Hello World")elif n>0: print("He\\nll\\no \\nWo\\nrl\\nd")else: for c in "Hello World": print(c) example.md:{% codeblock lang:python line_number:true mark:3,5,8 %}n=eval(input())if n==0: print("Hello World")elif n>0: print("He\\nll\\no \\nWo\\nrl\\nd")else: for c in "Hello World": print(c){% endcodeblock %} Pull Quote在文章中插入 Pull quote example.md:{% pullquote [class] %}content{% endpullquote %} jsFiddle在文章中嵌入 jsFiddle example.md:{% jsfiddle shorttag [tabs] [skin] [width] [height] %} Gist在文章中嵌入 Gist，注意：在国内无法加载。 example.md:{% gist gist_id [filename] %} iframe在文章中插入 iframe example.md:{% iframe url [width] [height] %} Image在文章中插入指定大小的图片。 example.md:{% img [class names] /path/to/image [width] [height] '"title text" "alt text"' %} Link在文章中插入链接，并自动给外部链接添加 target="_blank" 属性。 example.md:{% link text url [external] [title] %} Include Code插入 source/downloads/code 文件夹内的代码文件。source/downloads/code 不是固定的，取决于你在配置文件中 code_dir 的配置。 example.md:{% include_code [title] [lang:language] [from:line] [to:line] path/to/file %} 示例 嵌入 test.js 文件全文{% include_code lang:javascript test.js %}只嵌入第 3 行{% include_code lang:javascript from:3 to:3 test.js %}嵌入第 5 行至第 8 行{% include_code lang:javascript from:5 to:8 test.js %}嵌入第 5 行至文件结束{% include_code lang:javascript from:5 test.js %}嵌入第 1 行至第 8 行{% include_code lang:javascript to:8 test.js %} 引用文章引用其他文章的链接。 {% post_path filename %}{% post_link filename [title] [escape] %} 示例 引用这篇文章：主题更名为「Volantis」example.md:引用这篇文章：{% post_link news/2020-02-22 %} 文章摘要和截断在文章中使用 <!-- more -->，那么 <!-- more --> 之前的文字将会被视为摘要。首页中将只出现这部分文字，同时这部分文字也会出现在正文之中。 更多请见Hexo官方文档：#标签插件"},{"title":"主题配置","date":"2021-05-17T08:08:37.079Z","updated":"2021-05-17T08:08:37.079Z","comments":true,"path":"v2/theme-settings/index.html","permalink":"https://volantis.js.org/v2/theme-settings/","excerpt":"","text":"如无特殊说明，本页面的配置信息写在 主题 的 config.yml 文件中。 实用小技巧所有需要写在主题配置文件中的配置都可以写在站点配置文件的 theme_config: 中详见 Hexo 官方文档 #覆盖主题配置也可以直接查看本站源码中站点配置文件的写法：_config.yml 主题样式您可以在主题配置文件中设定一些简单的样式，在开始前，确保没有使用 CDN 服务，否则修改不会生效。 最大布局宽度blog/themes/volantis/_config.ymlstyle: ... max_width: 1080px # Sum of body width and sidebar width 网页所呈现的内容的最大宽度，即 body 和 sidebar 的宽度之和。 导航栏样式您可以设置导航栏的高度以及视觉特效，视觉特效目前可选的有： shadow：卡片阴影。 floatable：当鼠标移动到容器内时，呈现出浮起来的效果。 blur：背景模糊效果（毛玻璃），当浏览器不支持时显示为不透明。 blog/themes/volantis/_config.ymlstyle: ... navbar: height: 64px effect: [shadow, blur] # [shadow, floatable, blur] 滚动条样式blog/themes/volantis/_config.ymlstyle: ... scrollbar: size: 4px border: 2px color: '#2196f3' hover: '#ff5722' 侧边栏样式视觉特效参数同上，值得注意的是：卡片的 floatable 效果和 blur 效果相冲突。 blog/themes/volantis/_config.ymlstyle: ... sidebar: effect: [shadow] # [shadow, floatable, blur] 正文区域样式视觉特效参数同上，值得注意的是：卡片的 floatable 效果和 blur 效果相冲突。您可以在 language: true 这里设置代码块显示语言名称。text_align 可以设置 h1/h2/h3/h4/p 的文字对齐方向。 blog/themes/volantis/_config.ymlstyle: ... body: effect: [shadow] # [shadow, floatable, blur] highlight: language: true # show language of codeblock copy_btn: true text_align: # left, right, justify, center h1: left h2: left h3: left h4: left p: justify note: # style for default note: {% note text %} icon: '\\f054' color: '' 布局间距您可以设置几种标题的布局间距 h2/h3/h4、段落间距 line、区块内部的段落间距 inline。 blog/themes/volantis/_config.ymlstyle: ... gap: h2: 48px # Spacing above H2 (only px unit) h3: 32px # Spacing above H3 (only px unit) h4: 16px # Spacing above H4 (only px unit) paragraph: 1rem # Paragraph spacing between paragraphs row: .5rem # Paragraph spacing between other elements 自定义字体您可以自定义正文和代码字体。 blog/themes/volantis/_config.ymlstyle: ... fontfamily: logofont: fontfamily: '"Varela Round", "PingFang SC", "Microsoft YaHei", Helvetica, Arial' name: 'Varela Round' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/VarelaRound/VarelaRound-Regular.ttf weight: normal style: normal bodyfont: fontfamily: 'UbuntuMono, "PingFang SC", "Microsoft YaHei", Helvetica, Arial' name: 'UbuntuMono' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/UbuntuMono/UbuntuMono-Regular.ttf weight: normal style: normal codefont: fontfamily: 'Menlo, Monaco' name: 'Monaco' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/Monaco/Monaco.ttf weight: normal style: normal 颜色样式blog/themes/volantis/_config.ymlstyle: ... color: site: '#21232F' # Website background color card: '#444' # Card background color text: '#fff' # The color of the text on the card. theme: '#ff9800' # Main color link: '#1BCDFC' # Link color hover: '#ff5722' # Link highlight color inner: '#333' # Text color inside the button block: '#555' # Block color inlinecode: yellow # Inline code color codeblock: '#555' # Codeblock color p: '#ccc' # Paragraph color 设置封面目前主题提供两种封面方案，全屏封面适用于项目文档，半屏封面适用于个人博客。您可以修改参数决定在任何页面是否显示。 默认显示设置blog/themes/volantis/_config.ymlcover: ... display: home: true archive: false others: false # can be written in front-matter 'cover: true' 由于主页、归档是hexo自动生成的，您需要在主题配置文件中设置是否显示封面，而其它页面则可以在 front-matter 中通过设置 cover: true/false 来决定显示封面或者不显示封面。 设置导航栏导航栏分为 logo、menu、search 三个区域设置，其中 logo 区域如果设置了图片，则不能显示图标和标题， menu 区域的设置可以写在一个单独的文件中。 blog/themes/volantis/_config.ymlnavbar: logo: # choose [img] or [icon + title] img: icon: title: menu: # The following can be written in `blog/source/_data/menu.yml` - name: 博客 icon: fas fa-rss url: / - name: 分类 icon: fas fa-folder-open url: categories/ - name: 标签 icon: fas fa-tags url: tags/ - name: 归档 icon: fas fa-archive url: archives/ - name: 友链 icon: fas fa-link url: friends/ - name: 关于 icon: fas fa-info-circle url: about/ search: 搜索 # Search bar placeholder 使用数据文件建议新建一个文件，专门存放导航栏菜单配置，文件的路径为： blog/source/_data/menu.yml 文件的内容为： blog/source/_data/menu.yml- name: 博客 icon: fas fa-rss url: /... 菜单嵌套导航栏菜单支持嵌套，嵌套的属性名为 rows ，写法示例： blog/source/_data/menu.yml...- name: 更多 icon: fas fa-ellipsis-v rows: - name: 主题源码 url: https://github.com/volantis-x/hexo-theme-volantis/ - name: 更新日志 url: https://github.com/volantis-x/hexo-theme-volantis/releases/ - name: hr - name: 有疑问？ rows: - name: 看 FAQ url: faqs/ - name: 看 本站源码 url: https://github.com/volantis-x/volantis-docs/ - name: 提 Issue url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: hr - name: 公告和测试博文 url: archives/ - name: 示例博客 url: examples/ - name: 特别感谢 url: contributors/ 分割线在子菜单中，新增一个只有 name: hr 的“菜单”就会被渲染成一个分割线。 - name: hr 小标题在子菜单中，新增一个只有 name: 小标题内容（也可以有 icon: 小标题的图标）的“菜单”就会被渲染成一个小标题。 ...- name: 近期 icon: fas fa-clock url: / rows: - name: 热门文章 icon: fas fa-fire - name: ProHUD 开源库的设计思路 url: blog/2019-08-27-prohud/ - name: ValueX：实用的安全对象类型转换库 url: blog/2019-08-29-valuex/ - name: 心率管家 App 的设计与开发 url: blog/2019-07-23-heartmate/ 这个示例的实际效果： https://xaoxuu.com 播放器在子菜单中，新增一个 icon: fas fa-compact-disc 的“菜单”就会被渲染成一个 APlayer 播放器。 - name: 背景音乐 icon: fas fa-compact-disc 模块化布局您可以自由决定每个页面是否显示侧边栏，侧边栏显示什么小部件，正文区域显示什么卡片，文章卡片显示什么 meta 信息。 layout: # The following can be written in `blog/source/_data/layout.yml` # 文章列表（主页、自定义的列表）布局 on_list: # 列表中每一篇文章的meta信息 meta: [title, author, date, category, top] # 列表类页面的侧边栏 sidebar: [blogger, category, tagcloud, qrcode] # 页面布局 on_page: # 文章页面主体元素，你也可以在页面的Front-matter中设置 body: [article, comments] # 默认的meta信息，文章中没有配置则按照这里的配置来显示，设置为false则不显示 # 其中，title只在header中有效，music和thumbnail无需在这里设置，文章中有则显示 # 如果tags放置在meta.header中，那么在post列表中不显示（因为卡片下方已经有了） meta: header: [title, author, category, date, top] footer: [updated, tags, btns, share] # 文章页面的侧边栏 sidebar: [qrcode, toc] # 文章布局，参数继承自 on_page on_post: # 文章页脚，自动在每一篇文章末尾添加 article_footer: [copyright, donate] # 其他的页面布局暂时等于 on_list 其中 meta 部分的取值自 meta 库， 其余部分取值自 widget 库， （ body 除了可以从 widget 库中取值外，还可以选择 article 和 comments ）。 请别着急，具体的库配置将在下文详细讲解。 meta 库meta 即文章的元数据，描述文章的作者、发布时间、更新时间等等信息，Volantis 不替您决定，显示什么图标、如何描述都可以自定义。 查看所有相关配置 blog/themes/volantis/_config.ymlmeta: # 文章标题 title: # 暂无配置 # 默认文章作者（可在front-matter中覆盖） author: avatar: https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png name: Mr. X url: https://xaoxuu.com # 文章创建日期 date: icon: fas fa-edit title: '发布于：' format: 'll' # 日期格式 http://momentjs.com/docs/ # 文章更新日期 updated: icon: fas fa-save title: '更新于：' format: 'll' # 日期格式 http://momentjs.com/docs/ # 文章分类 category: icon: fas fa-folder-open # 文章置顶 top: icon: fas fa-angle-double-up # 文章浏览计数 counter: icon: fas fa-eye # 文章字数和阅读时长 wordcount: icon_wordcount: fas fa-keyboard icon_duration: fas fa-hourglass-half # 文章标签 tags: icon: fas fa-hashtag # 分享 share: - id: qq img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/qq.png - id: qzone img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/qzone.png - id: weibo img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/weibo.png # - id: qrcode # 当id为qrcode时需要安装插件 npm i -S hexo-helper-qrcode # img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/wechat.png # 链接 btns: edit: icon: fas fa-edit title: 在GitHub上编辑此页 color: '#888' repo: # 源码链接 icon: fas fa-file-code title: 源码 color: '#508EF2' bug: # BUG反馈链接 icon: fas fa-bug title: BUG color: '#FE5F58' doubt: # 疑问链接 icon: fas fa-question-circle title: 疑问 color: '#FFBD2B' idea: # 建议链接 icon: fas fa-lightbulb title: 建议 color: '#3DC550' faq: # FAQ链接 icon: fas fa-comments title: FAQ color: '#29B1C9' feedback: # 反馈链接 icon: fas fa-comment-dots title: 反馈 color: '#1BCDFC' widget 库widget 即小部件，大部分小部件都可以放置在侧边栏，一部分已经为正文区域显示做了优化，还有一部分只可以放置在文章页脚部分。与 meta 库不同的是：除了现有的 widget ，您可以很轻易地创建自己的 widget ，然后放在需要的地方。此外，您还可以将 widget 写在单独的文件中。 查看所有相关配置 blog/themes/volantis/_config.ymlwidget: # The following can be written in `blog/source/_data/widget.yml` # --------------------------------------- # blogger info widget blogger: class: blogger display: [desktop] # [desktop, mobile] avatar: https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png title: subtitle: jinrishici: true # Poetry Today. You can set a string, and it will be displayed when loading fails. social: true # --------------------------------------- # toc widget (valid only in articles) toc: class: toc display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-list title: 本文目录 list_number: false min_depth: 2 max_depth: 5 # --------------------------------------- # category widget category: class: category display: [desktop] # [desktop, mobile] header: icon: fas fa-folder-open title: 文章分类 url: /blog/categories/ # --------------------------------------- # tagcloud widget tagcloud: class: tagcloud display: [desktop] # [desktop, mobile] header: icon: fas fa-tags title: 热门标签 url: /blog/tags/ min_font: 14 max_font: 24 color: true start_color: '#999' end_color: '#555' # --------------------------------------- # related posts widget related_posts: class: related_posts # npm i -S hexo-related-popular-posts display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-bookmark title: 相关文章 max_count: 5 # --------------------------------------- # copyright widget (valid only in articles) copyright: class: copyright display: [desktop, mobile] # [desktop, mobile] blockquote: true permalink: '本文永久链接是：' content: - '博客内容遵循 署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 协议' - permalink # --------------------------------------- # qrcode widget donate: class: qrcode display: [desktop, mobile] # [desktop, mobile] height: 64px # Automatic height if not set fancybox: true images: - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png # You can add your own widget here or 'blog/source/_data/widget.yml' # class: text, list, grid, qrcode, page, ... see more at https://volantis.js.org/ 每一个小部件都有 class 和 display，前者代表这个小部件是什么，后者代表这个小部件在什么桌面和移动平台中是否显示，如果在移动平台显示，由于屏幕宽度有限，侧边栏的小部件则会被移动到正文区域下方，因此部分侧边栏小部件便失去意义，建议设置为仅桌面端显示。 小部件名: class: 小部件类别 display: [小部件在桌面端显示, 小部件在移动设备显示] 博主信息部件blog/themes/volantis/_config.ymlblogger: class: blogger display: [desktop] # [desktop, mobile] avatar: https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png title: subtitle: jinrishici: true # Poetry Today. You can set a string, and it will be displayed when loading fails. social: true 其中，今日诗词 jinrishici 如果设置为一个字符串，这个字符串会变成占位文字，加载失败时显示。如果不需要，就请设置为 jinrishici: false。social 的具体内容请在网站页脚部分设置。 文章目录部件blog/themes/volantis/_config.ymltoc: class: toc display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-list title: 本文目录 list_number: false min_depth: 2 max_depth: 5 这个部件只能放置在侧边栏，并且在文章中有效。在移动设备中预览时，手指向上滑动时，导航栏右边会出现 TOC 按钮，点击即可展开 TOC 部件。如果您需要显示章节序号，请设置 list_number。 min_depth 和 max_depth 代表 TOC 支持的标题层级，最大范围是2～6。 文章分类部件blog/themes/volantis/_config.ymlcategory: class: category display: [desktop] # [desktop, mobile] header: icon: fas fa-folder-open title: 文章分类 url: /blog/categories/ 这个部件可以直接显示所有文章分类，如果您希望有一个独立的页面来展示，需要自己创建一个文件，具体操作在「页面」部分文档中。 标签云部件blog/themes/volantis/_config.ymltagcloud: class: tagcloud display: [desktop] # [desktop, mobile] header: icon: fas fa-tags title: 热门标签 url: /blog/tags/ min_font: 14 max_font: 24 color: true start_color: '#999' end_color: '#555' 这个部件可以直接显示所有文章的标签，如果您希望有一个独立的页面来展示，需要自己创建一个文件，具体操作在「页面」部分文档中。 相关文章部件blog/themes/volantis/_config.ymlrelated_posts: class: related_posts # npm i -S hexo-related-popular-posts display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-bookmark title: 相关文章 max_count: 5 这个小部件建议放置在文章页脚，要使用这个部件，您需要安装插件： npm i -S hexo-related-popular-posts 值得注意的是，开启了这个功能之后，每次修改文章内容包括 front-matter 之后，都需要重新 hexo s。 文章版权部件blog/themes/volantis/_config.ymlcopyright: class: copyright display: [desktop, mobile] # [desktop, mobile] blockquote: true permalink: '本文永久链接是：' content: - '博客内容遵循 署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 协议' - permalink 这个部件只可以放置在文章页脚。 二维码部件blog/themes/volantis/_config.ymldonate: class: qrcode display: [desktop, mobile] # [desktop, mobile] height: 64px # Automatic height if not set fancybox: true images: - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png 您可以放置在文章页脚用于展示打赏图片，也可以放置在侧边栏。 通用文本部件blog/themes/volantis/_config.ymlrepos: class: text display: [desktop] # [desktop, mobile] header: icon: fab fa-github title: 点个赞吧 url: https://github.com/xaoxuu/ content: - '您的赞对我来说很重要，如果您喜欢本主题，希望能够给下面的项目点个赞来支持一下。' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/prohud/logo.png" height="50px">](https://github.com/xaoxuu/ProHUD)' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/valuex/logo.png" height="50px">](https://github.com/xaoxuu/ValueX)' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/inspire/logo.png" height="50px">](https://github.com/xaoxuu/Inspire)' 您可以创建用于展示任何文本内容的文本部件。 通用列表部件blog/themes/volantis/_config.ymlwiki-hexo-theme: class: list display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-chevron-left title: Hexo Themes url: /wiki/ rows: - name: Volantis for Hexo url: /wiki/volantis/ - name: Resume for Hexo url: /wiki/resume/ 您可以创建用于展示任何链接列表的列表部件。列表的 rows 中的每一项支持的属性有： name、url、icon、img、avatar，其中 img 是方形图片的链接，avatar 是圆形图片的链接。 参考资料这个部件的布局继承自 list 部件，用于展示文章的参考资料。请将您的 Volantis 升级至 2.5 版本以上使用。 blog/themes/volantis/_config.ymlreferences: class: references # is subclass of list display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-quote-left title: 参考资料 在文章的 front-matter 中设置： front-matterreferences: - name: Apple Developer Documentation url: https://developer.apple.com/documentation/ 组索引这个部件的布局继承自 list 部件，用于展示文章所属的分组的文章列表。请将您的 Volantis 升级至 2.5 版本以上使用。 blog/themes/volantis/_config.ymlgroup-1: class: group display: [desktop, mobile] # [desktop, mobile] header: icon: fab fa-apple title: Developer url: /wiki/ios/ 在文章的 front-matter 中设置： front-mattergroup: group-1order: 16sidebar: [group-1, toc] 「group-1」卡片将会以列表的形式显示所有设置了 group: group-1 的文章，顺序按照 order 从小到大排列。 效果见： https://xaoxuu.com/wiki/git/ 通用网格部件blog/themes/volantis/_config.ymlfeedback: class: grid display: [desktop, mobile] header: icon: fas fa-headset title: 联系开发者 url: https://github.com/volantis-x/hexo-theme-volantis fixed: true # 固定宽度 rows: - name: 反馈BUG icon: fas fa-bug url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: 疑问求助 icon: fas fa-question-circle url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: 提个建议 icon: fas fa-lightbulb url: https://github.com/volantis-x/hexo-theme-volantis/issues/ 您可以创建用于展示任何链接列表的网格部件。网格默认根据文字长度自动确定每一个格子的宽度，如果文字长短不一，建议通过设置 fixed: true 来固定宽度，此时文字过长的格子中的文字会换行显示。 通用页面部件blog/themes/volantis/_config.ymltest: class: page display: [desktop, mobile] pid: haha content: excerpt # excerpt, more, content 您可以把整个页面的md内容作为一个小部件渲染显示出来。只需要设置小部件里的 pid 属性和文章的 front-matter 中设置一样的 pid 即可。 content 代表这个部件显示的内容，可选 excerpt，more，content 分别对应文章的摘要、摘要后面的内容、全文。 部件库文件部件库中的所有部件都可以写在部件库文件中，您需要创建一个文件在以下路径： blog/source/_data/widget.yml 文件内容示例：widget.yml 设置网站页脚您通过 layout 可以自由布局网站页脚内容 aplayer, social, license, info, copyright。 blog/themes/volantis/_config.ymlfooter: # layout of footer: [aplayer, social, license, info, copyright] layout: [aplayer, social, license, info, copyright] social: - icon: fas fa-rss url: atom.xml - icon: fas fa-envelope url: mailto:me@xaoxuu.com - icon: fab fa-github url: https://github.com/xaoxuu - icon: fas fa-headphones-alt url: https://music.163.com/#/user/home?id=63035382 copyright: '[Copyright © 2017-2021 XXX](/)' # You can add your own property here. (Support markdown, for example: br: '<br>') br: '<br>' 其中，aplayer 需要在插件部分设置中启用。您可以新增文字属性，用于展示其它文字信息，例如： blog/themes/volantis/_config.ymlfooter: layout: [..., br, hello, ...] ... # You can add your own property here. (Support markdown, for example: br: '<br>') br: '<br>' hello: '[Hello World](/)' SEOblog/themes/volantis/_config.ymlseo: # When there are no keywords in the article's front-matter, use tags as keywords. use_tags_as_keywords: true # When there is no description in the article's front-matter, use excerpt as the description. use_excerpt_as_description: true robots: home_first_page: index,follow home_other_pages: noindex,follow archive: noindex,follow category: noindex,follow tag: noindex,follow # robots can be written in front-matter 这部分一般不需要修改。 插件库Volantis 为丰富的插件提供了兼容性优化。大部分插件您只需开启和关闭，无需进行设置。 幻灯片背景blog/themes/volantis/_config.ymlplugins: ... backstretch: enable: true js: https://cdn.jsdelivr.net/npm/jquery-backstretch@2.1.18/jquery.backstretch.min.js position: cover # cover: sticky on the cover. fixed: Fixed as background for the site. duration: 20000 # Duration (ms) fade: 1500 # fade duration (ms) (Not more than 1500) images: # For personal use only. At your own risk if used for commercial purposes !!! - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg ... 幻灯片背景图片显示的位置可以选择粘贴在封面上，跟随封面一起滑动，也可以选择固定作为网页背景图片。 highlight.jsblog/themes/volantis/_config.ymlplugins: ... highlightjs: js: https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@9.18.1/build/highlight.min.js css: https://cdn.jsdelivr.net/npm/highlight.js@9.18.1/styles/solarized-light.css 如果需要使用 highlight.js 进行语法高亮，请将站点配置文件中的 highlight.enable 设置为 false 否则不会加载插件。您可以在 94 种 语法高亮主题 中挑选喜爱的主题，然后替换上面的 css 链接。 如果您使用 highlight.js 请确保没有使用 hexo 官方的 codeblock 标签，否则会报错。 经测试，使用 highlight.js 的情况下，部分容器内的代码可能仍然会被渲染甚至报错。 APlayer 音乐播放器blog/themes/volantis/_config.ymlplugins: ... aplayer: enable: true js: - https://cdn.jsdelivr.net/npm/aplayer@1.10/dist/APlayer.min.js - https://cdn.jsdelivr.net/npm/meting@2.0/dist/Meting.min.js # Required server: netease # netease, tencent, kugou, xiami, baidu type: playlist # song, playlist, album, search, artist id: 3175833810 # song id / playlist id / album id / search keyword # Optional fixed: false # enable fixed mode theme: '#1BCDFC' # main color autoplay: false # audio autoplay order: list # player play order, values: 'list', 'random' loop: all # player loop play, values: 'all', 'one', 'none' volume: 0.7 # default volume, notice that player will remember user setting, default volume will not work after user set volume themselves list_max_height: 340px # list max height list_folded: true APlayer播放器只可以在中国大陆地区使用。相关文档： APlayer | MetingJS 评论系统blog/themes/volantis/_config.ymlcomments: title: <i class='fas fa-comments'></i> 评论 subtitle: service: valine # valine, disqus, gitalk, livere valine: appId: # your appId appKey: # your appKey js: https://cdn.jsdelivr.net/npm/valine@1.4/dist/Valine.min.js path: # All pages use the same path (share the same comments data) meta: nick,mail,link # valine comment header info requiredFields: ['nick','mail'] enableQQ: true # Unstable avatar link placeholder: 快来评论吧~ # valine comment input placeholder(like: Please leave your footprints ) avatar: robohash # gravatar style https://valine.js.org/avatar pageSize: 10 # comment list page size lang: zh-cn highlight: true visitor: true mathJax: false disqus: shortname: gitalk: clientID: clientSecret: repo: owner: admin: # [] livere: uid: Disqus官网： https://disqus.com/ blog/themes/volantis/_config.ymlcomments: ... disqus: shortname: Gitalk官网： https://github.com/gitalk/gitalk blog/themes/volantis/_config.ymlcomments: ... gitalk: clientID: clientSecret: repo: owner: admin: # [] clientID 和 clientSecret 的获取方法可自行搜索教程，这里仅简单描述一下步骤： 点击 GitHub -> Settings https://github.com/settings/profile 点击 Developer settings https://github.com/settings/developers 点击 New OAuth App https://github.com/settings/applications/new 填写信息： Application name 随便填，我的是：xaoxuu.comHomepage URL 和 Authorization callback URL 都写你的网址，我的是：https://xaoxuu.com 可以通过设置 gitalk.id 实现多个页面共用一个评论框。 front-matter---gitalk: id: /wiki/volantis/--- Valine官网： https://valine.js.org blog/themes/volantis/_config.ymlcomments: ... valine: appId: # your appId appKey: # your appKey js: https://cdn.jsdelivr.net/npm/valine@1.4/dist/Valine.min.js path: # All pages use the same path (share the same comments data) meta: nick,mail,link # valine comment header info requiredFields: ['nick','mail'] enableQQ: true # Unstable avatar link placeholder: 快来评论吧~ # valine comment input placeholder(like: Please leave your footprints ) avatar: robohash # gravatar style https://valine.js.org/avatar pageSize: 10 # comment list page size lang: zh-cn highlight: true visitor: true mathJax: false 其中，placeholder 支持在 front-matter 中设置。 front-matter---valine: placeholder: 你觉得xxx怎么样呢？--- 也可以通过设置 valine.path 实现多个页面共用一个评论框。 front-matter---valine: path: /--- MiniValine官网： https://github.com/MiniValine/MiniValine/ blog/themes/volantis/_config.ymlcomments: ... minivaline: appId: # Your leancloud application appid appKey: # Your leancloud application appkey placeholder: Write a Comment # Comment box placeholder adminEmailMd5: # The MD5 of Admin Email to show Admin Flag. math: true # Support MathJax. md: true # Support Markdown. # MiniValine's display language depends on user's browser or system environment # If you want everyone visiting your site to see a uniform language, you can set a force language value # Available values: en | zh-CN | (and many more) # More i18n info: https://github.com/MiniValine/minivaline-i18n lang: Livere官网： https://www.livere.com/ blog/themes/volantis/_config.ymlcomments: ... livere: uid: #你的livere的uid 在这里查看你的 uid：https://livere.com/insight/myCode，在【代码管理 -> 一般网站】中找到如下这段代码，其中 data-uid 中的内容就是你的 livere_uid。 <!-- 来必力City版安装代码 --><div id="lv-container" data-id="city" data-uid="你的livere的uid">... 开启搜索功能blog/themes/volantis/_config.ymlsearch: enable: true service: hexo # hexo, google, algolia, azure, baidu js: https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@2.6.4/js/search.js google: apiKey: engineId: algolia: applicationID: apiKey: indexName: azure: serviceName: indexName: queryKey: baidu: apiId: 默认配置为 Hexo 搜索，但是需要安装插件才能使用： npm i -S hexo-generator-search hexo-generator-json-content"},{"title":"标签插件","date":"2021-05-17T08:08:37.083Z","updated":"2021-05-17T08:08:37.083Z","comments":true,"path":"v4/tag-plugins/index.html","permalink":"https://volantis.js.org/v4/tag-plugins/","excerpt":"","text":"为了兼容老用户，旧的标签插件在重构之前依然沿用旧的格式，即「英文逗号+空格」作为参数分隔符，而部分新增标签插件是「空格+英文竖线+空格」，请注意区分。 我们也在探索哪种分隔符既简单又不容易引起冲突，所以可能存在多种格式，具体以对应文档描述为准。 text这是一些文本样式标签： 带 下划线 的文本 example.md:带 {% u 下划线 %} 的文本 带 着重号 的文本 example.md:带 {% emp 着重号 %} 的文本 带 波浪线 的文本 example.md:带 {% wavy 波浪线 %} 的文本 带 删除线 的文本 example.md:带 {% del 删除线 %} 的文本 键盘样式的文本 command + D example.md:键盘样式的文本 {% kbd command %} + {% kbd D %} 密码样式的文本：这里没有验证码 example.md:密码样式的文本：{% psw 这里没有验证码 %} span本插件最后更新于 2.5 版本{% span 样式参数, 文本内容 %} 彩色文字在一段话中方便插入各种颜色的标签，包括：红色、黄色、绿色、青色、蓝色、灰色。 超大号文字文档「开始」页面中的标题部分就是超大号文字。 Volantis A Wonderful Theme for Hexo 上述示例的源码example:#### 彩色文字在一段话中方便插入各种颜色的标签，包括：{% span red, 红色 %}、{% span yellow, 黄色 %}、{% span green, 绿色 %}、{% span cyan, 青色 %}、{% span blue, 蓝色 %}、{% span gray, 灰色 %}。#### 超大号文字文档「开始」页面中的标题部分就是超大号文字。{% span center logo large, Volantis %}{% span center small, A Wonderful Theme for Hexo %} 可以支持的参数样式参数位置可以写颜色、大小和对齐方向，多个样式参数用空格隔开。 字体logo, code 颜色red, yellow, green, cyan, blue, gray 大小small, h4, h3, h2, h1, large, huge, ultra 对齐方向left, center, right p本插件最后更新于 2.5 版本{% p 样式参数, 文本内容 %} 演示效果彩色文字在一段话中方便插入各种颜色的标签，包括：红色、黄色、绿色、青色、蓝色、灰色。 超大号文字文档「开始」页面中的标题部分就是超大号文字。 Volantis A Wonderful Theme for Hexo 上述示例的源码example:#### 彩色文字在一段话中方便插入各种颜色的标签，包括：{% p red, 红色 %}、{% p yellow, 黄色 %}、{% p green, 绿色 %}、{% p cyan, 青色 %}、{% p blue, 蓝色 %}、{% p gray, 灰色 %}。#### 超大号文字文档「开始」页面中的标题部分就是超大号文字。{% p center logo large, Volantis %}{% p center small, A Wonderful Theme for Hexo %} 可以支持的参数样式参数位置可以写颜色、大小和对齐方向，多个样式参数用空格隔开。 字体logo, code 颜色red, yellow, green, cyan, blue, gray 大小small, h4, h3, h2, h1, large, huge, ultra 对齐方向left, center, right noteNoteBlock 是 Blockquote 的增强版，在左边显示图标，并且可以自定颜色。而 Note 是 NoteBlock 的简便写法。 最后更新于 2.3 版本{% note 样式参数, 文本内容 %} 演示效果经典用法可以在配置文件中设置默认样式，为简单的一句话提供最的简便写法。 note quote 适合引用一段话 note info 默认主题色，适合中性的信息 note warning 默认黄色，适合警告性的信息 note error/danger 默认红色，适合危险性的信息 note done/success 默认绿色，适合正确操作的信息 更多图标这些都是默认样式，可以手动加上颜色： note radiation 默认样式 note radiation yellow 可以加上颜色 note bug red 说明还存在的一些故障 note link green 可以放置一些链接 note paperclip blue 放置一些附件链接 note todo 待办事项 note guide clear 可以加上一段向导 note download 可以放置下载链接 note message gray 一段消息 note up 可以说明如何进行更新 note undo light 可以说明如何撤销或者回退 上述示例的源码example:#### 经典用法{% note, 可以在配置文件中设置默认样式，为简单的一句话提供最的简便写法。 %}{% note quote, note quote 适合引用一段话 %}{% note info, note info 默认主题色，适合中性的信息 %}{% note warning, note warning 默认黄色，适合警告性的信息 %}{% note danger, note error/danger 默认红色，适合危险性的信息 %}{% note success, note done/success 默认绿色，适合正确操作的信息 %}#### 更多图标这些都是默认样式，可以手动加上颜色：{% note radiation, note radiation 默认样式 %}{% note radiation yellow, note radiation yellow 可以加上颜色 %}{% note bug red, note bug red 说明还存在的一些故障 %}{% note link green, note link green 可以放置一些链接 %}{% note paperclip blue, note paperclip blue 放置一些附件链接 %}{% note todo, note todo 待办事项 %}{% note guide clear, note guide clear 可以加上一段向导 %}{% note download, note download 可以放置下载链接 %}{% note message gray, note message gray 一段消息 %}{% note up, note up 可以说明如何进行更新 %}{% note undo light, note undo light 可以说明如何撤销或者回退 %} 可以支持的参数样式参数位置可以写图标和颜色，多个样式参数用空格隔开。 图标彩色的quote, info, warning, done/success, error/danger 灰色的，也可以指定颜色radiation, bug, idea, link, paperclip, todo, message, guide, download, up, undo 颜色指定颜色clear, light, gray, red, yellow, green, cyan, blue noteblockNoteBlock 是 Blockquote 的增强版，在左边显示图标，并且可以自定颜色。而 Note 是 NoteBlock 的简便写法。 最后更新于 4.0 版本{% noteblock 样式参数（可选）, 标题（可选） %}文本段落{% endnoteblock %} 演示效果可以在区块中放置一些复杂的结构，支持嵌套。 标题（可选）Windows 10不是為所有人設計,而是為每個人設計嵌套测试： 请坐和放宽，我正在帮你搞定一切... Folding 测试： 点击查看更多 不要说我们没有警告过你我们都有不顺利的时候 上述示例的源码example:{% noteblock, 标题（可选） %}Windows 10不是為所有人設計,而是為每個人設計{% noteblock done %}嵌套测试： 请坐和放宽，我正在帮你搞定一切...{% endnoteblock %}{% folding yellow, Folding 测试： 点击查看更多 %}{% note warning, 不要说我们没有警告过你 %}{% noteblock bug red %}我们都有不顺利的时候{% endnoteblock %}{% endfolding %}{% endnoteblock %} 可以支持的参数样式参数位置可以写图标和颜色，多个样式参数用空格隔开。 图标彩色的quote, info, warning, done/success, error/danger 灰色的，也可以指定颜色radiation, bug, idea, link, paperclip, todo, message, guide, download, up, undo 颜色指定颜色clear, light, gray, red, yellow, green, cyan, blue checkbox最后更新于 2.6 版本{% checkbox 样式参数（可选）, 文本（支持简单md） %} 演示效果 纯文本测试 支持简单的 markdown 语法 支持自定义颜色 绿色 + 默认选中 黄色 + 默认选中 青色 + 默认选中 蓝色 + 默认选中 增加 减少 叉 上述示例的源码example:{% checkbox 纯文本测试 %}{% checkbox checked, 支持简单的 [markdown](https://guides.github.com/features/mastering-markdown/) 语法 %}{% checkbox red, 支持自定义颜色 %}{% checkbox green checked, 绿色 + 默认选中 %}{% checkbox yellow checked, 黄色 + 默认选中 %}{% checkbox cyan checked, 青色 + 默认选中 %}{% checkbox blue checked, 蓝色 + 默认选中 %}{% checkbox plus green checked, 增加 %}{% checkbox minus yellow checked, 减少 %}{% checkbox times red checked, 叉 %} 可以支持的参数颜色red, yellow, green, cyan, blue 样式plus, minus, times 选中状态checked radio最后更新于 2.6 版本{% checkbox 样式参数（可选）, 文本（支持简单md） %} 演示效果 纯文本测试 支持简单的 markdown 语法 支持自定义颜色 绿色 黄色 青色 蓝色 上述示例的源码example:{% radio 纯文本测试 %}{% radio checked, 支持简单的 [markdown](https://guides.github.com/features/mastering-markdown/) 语法 %}{% radio red, 支持自定义颜色 %}{% radio green, 绿色 %}{% radio yellow, 黄色 %}{% radio cyan, 青色 %}{% radio blue, 蓝色 %} 可以支持的参数颜色red, yellow, green, cyan, blue 选中状态checked timeline最后更新于 3.0 版本{% timeline 时间线标题（可选） %}{% timenode 时间节点（标题） %}正文内容{% endtimenode %}{% timenode 时间节点（标题） %}正文内容{% endtimenode %}{% endtimeline %} 演示效果 2020-07-24 2.6.6 -> 3.0 如果有 hexo-lazyload-image 插件，需要删除并重新安装最新版本，设置 lazyload.isSPA: true。2.x 版本的 css 和 js 不适用于 3.x 版本，如果使用了 use_cdn: true 则需要删除。2.x 版本的 fancybox 标签在 3.x 版本中被重命名为 gallery 。2.x 版本的置顶 top: true 改为了 pin: true，并且同样适用于 layout: page 的页面。如果使用了 hexo-offline 插件，建议卸载，3.0 版本默认开启了 pjax 服务。 2020-05-15 2.6.3 -> 2.6.6 不需要额外处理。 2020-04-20 2.6.2 -> 2.6.3 全局搜索 seotitle 并替换为 seo_title。group 组件的索引规则有变，使用 group 组件的文章内，group: group_name 对应的组件名必须是 group_name。group 组件的列表名优先显示文章的 short_title 其次是 title。 上述示例的源码example:{% timeline %}{% timenode 2020-07-24 [2.6.6 -> 3.0](https://github.com/volantis-x/hexo-theme-volantis/releases) %}1. 如果有 `hexo-lazyload-image` 插件，需要删除并重新安装最新版本，设置 `lazyload.isSPA: true`。2. 2.x 版本的 css 和 js 不适用于 3.x 版本，如果使用了 `use_cdn: true` 则需要删除。3. 2.x 版本的 fancybox 标签在 3.x 版本中被重命名为 gallery 。4. 2.x 版本的置顶 `top: true` 改为了 `pin: true`，并且同样适用于 `layout: page` 的页面。5. 如果使用了 `hexo-offline` 插件，建议卸载，3.0 版本默认开启了 pjax 服务。{% endtimenode %}{% timenode 2020-05-15 [2.6.3 -> 2.6.6](https://github.com/volantis-x/hexo-theme-volantis/releases/tag/2.6.6) %}不需要额外处理。{% endtimenode %}{% timenode 2020-04-20 [2.6.2 -> 2.6.3](https://github.com/volantis-x/hexo-theme-volantis/releases/tag/2.6.3) %}1. 全局搜索 `seotitle` 并替换为 `seo_title`。2. group 组件的索引规则有变，使用 group 组件的文章内，`group: group_name` 对应的组件名必须是 `group_name`。2. group 组件的列表名优先显示文章的 `short_title` 其次是 `title`。{% endtimenode %}{% endtimeline %} link最后更新于 3.0 版本{% link 标题, 链接, 图片链接（可选） %} 演示效果如何参与项目https://volantis.js.org/contributors/ 上述示例的源码example:{% link 如何参与项目, https://volantis.js.org/contributors/, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets@master/logo/256/safari.png %} button这个页面的标签将会在不久后重构 基础按钮请将您的 Volantis 升级至 2.4 版本以上使用。 语法格式参数列表示例写法示例效果{% btn 样式参数（可选）, 标题, 链接, 图标（可选） %} 可选的参数可以省略，但是前后顺序不能乱。样式参数 regular, large, center 图标 第1个或者第2个参数包含 fa- 的那个被识别为图标。example.md:不设置任何参数的 {% btn 按钮, / %} 适合融入段落中。regular 按钮适合独立于段落之外：{% btn regular, 示例博客, https://xaoxuu.com, fas fa-play-circle %}large 按钮更具有强调作用，建议搭配 center 使用：{% btn center large, 开始使用, https://volantis.js.org/v3/getting-started/, fas fa-download %}行内按钮 不设置任何参数的 按钮 适合融入段落中。 空心按钮 示例博客 示例博客 示例博客 示例博客 居中： 开始使用 实心按钮 示例博客 示例博客 示例博客 示例博客 居中： 开始使用 富文本按钮请将您的 Volantis 升级至 2.3 版本以上使用。 语法格式参数列表示例写法示例效果{% btns 样式参数 %}{% cell 标题, 链接, 图片或者图标 %}{% cell 标题, 链接, 图片或者图标 %}{% endbtns %}样式参数位置可以写图片样式、布局方式，多个样式参数用空格隔开。 圆角样式 默认为方形 rounded, circle 布局方式 默认为自动宽度，适合视野内只有一两个的情况。 参数 含义 wide 宽一点的按钮 fill 填充布局，自动铺满至少一行，多了会换行。 center 居中，按钮之间是固定间距。 around 居中分散 grid2 等宽最多2列，屏幕变窄会适当减少列数。 grid3 等宽最多3列，屏幕变窄会适当减少列数。 grid4 等宽最多4列，屏幕变窄会适当减少列数。 grid5 等宽最多5列，屏幕变窄会适当减少列数。 增加文字样式 可以在容器内增加 <b>标题</b> 和 <p>描述文字</p>如果需要显示类似「团队成员」之类的一组含有头像的链接： example.md:{% btns circle grid5 %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% endbtns %} 或者含有图标的按钮： example.md:{% btns rounded grid5 %}{% cell 下载源码, /, fas fa-download %}{% cell 查看文档, /, fas fa-book-open %}{% endbtns %} 圆形图标 + 标题 + 描述 + 图片 + 网格5列 + 居中 example.md:{% btns circle center grid5 %}<a href='https://apps.apple.com/cn/app/heart-mate-pro-hrm-utility/id1463348922?ls=1'> <i class='fab fa-apple'></i> <b>心率管家</b> {% p red, 专业版 %} <img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/qrcode/heartmate_pro.png'></a><a href='https://apps.apple.com/cn/app/heart-mate-lite-hrm-utility/id1475747930?ls=1'> <i class='fab fa-apple'></i> <b>心率管家</b> {% p green, 免费版 %} <img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/qrcode/heartmate_lite.png'></a>{% endbtns %}如果需要显示类似「团队成员」之类的一组含有头像的链接： xaoxuu xaoxuu xaoxuu xaoxuu xaoxuu 或者含有图标的按钮： 下载源码 查看文档 圆形图标 + 标题 + 描述 + 图片 + 网格5列 + 居中 心率管家 专业版 心率管家 免费版 ghcard最后更新于 4.0 版本{% ghcard 用户名, 其它参数（可选） %}{% ghcard 用户名/仓库, 其它参数（可选） %} 用户信息卡片 上述示例的源码： example:| {% ghcard xaoxuu %} | {% ghcard xaoxuu, theme=vue %} || -- | -- || {% ghcard xaoxuu, theme=buefy %} | {% ghcard xaoxuu, theme=solarized-light %} || {% ghcard xaoxuu, theme=onedark %} | {% ghcard xaoxuu, theme=solarized-dark %} || {% ghcard xaoxuu, theme=algolia %} | {% ghcard xaoxuu, theme=calm %} | 仓库信息卡片 上述示例的源码： example:| {% ghcard volantis-x/hexo-theme-volantis %} | {% ghcard volantis-x/hexo-theme-volantis, theme=vue %} || -- | -- || {% ghcard volantis-x/hexo-theme-volantis, theme=buefy %} | {% ghcard volantis-x/hexo-theme-volantis, theme=solarized-light %} || {% ghcard volantis-x/hexo-theme-volantis, theme=onedark %} | {% ghcard volantis-x/hexo-theme-volantis, theme=solarized-dark %} || {% ghcard volantis-x/hexo-theme-volantis, theme=algolia %} | {% ghcard volantis-x/hexo-theme-volantis, theme=calm %} | 更多参数选择GitHub 卡片 API 参数https://github-readme-stats.vercel.app site网站卡片可以显示网站截图、logo、标题、描述，使用方法和友链标签一模一样，唯一的区别是数据文件名称为 sites.yml，可以和友链数据混用，通过分组过滤实现不一样的效果。 示例写法{% sites only:community_team %} sites only:community_team MHuiG划水Colsrch开发者inkss摸鱼W4J1e打杂 dropmenu这个页面的标签将会在不久后重构 下拉菜单请将您的 Volantis 升级至 3.0 版本以上使用。 语法格式示例写法示例效果容器 {% menu 前缀（可省略）, 标题, 后缀（可省略） %}菜单内容{% endmenu %} 菜单内容 菜单项 {% menuitem 文本, 链接, 图标 %} 分割线 {% menuitem hr %} 子菜单 {% submenu 嵌套菜单, 图标 %}菜单内容{% endsubmenu %}示例1 {% menu 下拉菜单 %}{% menuitem 主题源码, https://github.com/volantis-x/hexo-theme-volantis/, fas fa-file-code %}{% menuitem 更新日志, https://github.com/volantis-x/hexo-theme-volantis/releases/, fas fa-clipboard-list %}{% menuitem hr %}{% submenu 有疑问？, fas fa-question-circle %}{% menuitem 看 FAQ, /faqs/ %}{% menuitem 看 本站源码, https://github.com/volantis-x/volantis-docs/ %}{% menuitem 提 Issue, https://github.com/volantis-x/hexo-theme-volantis/issues/ %}{% endsubmenu %}{% endmenu %} 示例2 {% menu 这个是, 下拉菜单 %}（同上）{% endmenu %} 示例3 {% menu 这个是, 下拉菜单, 的示例效果。 %}（同上）{% endmenu %}示例1 下拉菜单 主题源码 更新日志 有疑问？ 看 FAQ 看 本站源码 提 Issue 示例2 这个是 下拉菜单 主题源码 更新日志 有疑问？ 看 FAQ 看 本站源码 提 Issue 示例3 这个是 下拉菜单 主题源码 更新日志 有疑问？ 看 FAQ 看 本站源码 提 Issue 的示例效果。 tab此插件移植自 NexT #tabs 最后更新于 2.1 版本{% tabs 页面内不重复的ID %}<!-- tab 栏目1 -->内容<!-- endtab --><!-- tab 栏目2 -->内容<!-- endtab -->{% endtabs %} 演示效果栏目1栏目2。。。！！！ 上述示例的源码example:{% tabs tab-id %}<!-- tab 栏目1 -->。。。<!-- endtab --><!-- tab 栏目2 -->！！！<!-- endtab -->{% endtabs %} folding最后更新于 2.3 版本{% folding 参数（可选）, 标题 %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endfolding %} 演示效果 查看图片测试 查看默认打开的折叠框 这是一个默认打开的折叠框。 查看代码测试 {% folding green, 查看代码测试 %}查看代码测试{% endfolding %} 查看列表测试 hahahehe 查看嵌套测试 查看嵌套测试2 查看嵌套测试3 hahaha 上述示例的源码example:{% folding 查看图片测试 %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endfolding %}{% folding cyan open, 查看默认打开的折叠框 %}这是一个默认打开的折叠框。{% endfolding %}{% folding green, 查看代码测试 %}{% endfolding %}{% folding yellow, 查看列表测试 %}- haha- hehe{% endfolding %}{% folding red, 查看嵌套测试 %}{% folding blue, 查看嵌套测试2 %}{% folding 查看嵌套测试3 %}hahaha <span><img src='https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/tieba/%E6%BB%91%E7%A8%BD.png' style='height:24px'></span>{% endfolding %}{% endfolding %}{% endfolding %} 可以支持的参数参数位置可以填写颜色和状态，多个参数用空格隔开。 颜色blue, cyan, green, yellow, red 状态状态填写 open 代表默认打开。 inlineimageInlineimage 标签是一种行内图片标签，可以用来在一段话中间插入表情。 本插件最后更新于 4.0 版本{% inlineimage 图片链接, height=高度（可选） %} 演示效果这是 一段话。 这又是 一段话。 上述示例的源码example:这是 {% inlineimage https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/aru-l/0000.gif %} 一段话。这又是 {% inlineimage https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/aru-l/5150.gif, height=40px %} 一段话。 可以支持的参数高度height=20px imageImage 标签是一种针对单个图片应用场景的标签，支持图片描述文字和指定宽度。 本插件最后更新于 4.0 版本{% image 链接, width=宽度（可选）, height=高度（可选）, alt=描述（可选）, bg=占位颜色（可选） %} 演示效果添加描述： 每天下课回宿舍的路，没有什么故事。 指定宽度： 指定宽度并添加描述： 每天下课回宿舍的路，没有什么故事。 设置占位背景色： 优化不同宽度浏览的观感 上述示例的源码example:添加描述：{% image https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg, alt=每天下课回宿舍的路，没有什么故事。 %}指定宽度：{% image https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg, width=400px %}指定宽度并添加描述：{% image https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg, width=400px, alt=每天下课回宿舍的路，没有什么故事。 %}设置占位背景色：{% image https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg, width=400px, bg=#1D0C04, alt=优化不同宽度浏览的观感 %} 可以支持的参数图片宽高度example:width=300px, height=32px 图片描述example:alt=图片描述 占位背景色example:bg=#f2f2f2 galleryGallery 标签是一种针对一组图片应用场景的标签。 本插件最后更新于 3.0 版本{% gallery 参数, 列数 %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B18FCBB3-67FD-48CC-B4F3-457BA145F17A.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/67239FBB-E15D-4F4F-8EE8-0F1C9F3C4E7C.jpeg){% endgallery %} 演示效果一行一个图片 图片描述 一行多个图片（不换行） 图片描述 图片描述 图片描述 多行多个图片（每行2～8个图片） 上述示例的源码一行一个图片 example.md:{% gallery %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endgallery %} 一行多个图片（不换行） example.md:{% gallery %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B18FCBB3-67FD-48CC-B4F3-457BA145F17A.jpeg)![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/67239FBB-E15D-4F4F-8EE8-0F1C9F3C4E7C.jpeg)![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/00E0F0ED-9F1C-407A-9AA6-545649D919F4.jpeg){% endgallery %} 多行多个图片（每行2～8个图片） example.md:{% gallery stretch, 4 %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B951AE18-D431-417F-B3FE-A382403FF21B.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/AEB33F9D-7294-4CF1-B8C5-3020748A9D45.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/250662D4-5A21-4AAA-BB63-CD25CF97CFF1.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/10A0FCE5-36A1-4AD0-8CF0-019259A89E03.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B951AE18-D431-417F-B3FE-A382403FF21B.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/AEB33F9D-7294-4CF1-B8C5-3020748A9D45.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/250662D4-5A21-4AAA-BB63-CD25CF97CFF1.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/landscape/10A0FCE5-36A1-4AD0-8CF0-019259A89E03.jpeg){% endgallery %} 可以支持的参数对齐方向left, center, right 缩放stretch 列数逗号后面直接写列数，支持 2 ～ 8 列。设定列列数之后就是「多行多图」布局，此时图片默认左对齐。为了避免图片大小不一，建议搭配 stretch 来时图片放大填充。 audio本插件最后更新于 2.4 版本{% audio 音频链接 %} 演示效果Your browser does not support the audio tag. 上述示例的源码example:{% audio https://github.com/volantis-x/volantis-docs/releases/download/assets/Lumia1020.mp3 %} video本插件最后更新于 2.3 版本{% video 视频链接 %} 演示效果100%宽度 Your browser does not support the video tag. 50%宽度 Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. 25%宽度 Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. 上述示例的源码100%宽度 example.md:{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %} 50%宽度 example.md:{% videos, 2 %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% endvideos %} 25%宽度 example.md:{% videos, 4 %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% endvideos %} 可以支持的参数对齐方向left, center, right 列数逗号后面直接写列数，支持 1 ～ 4 列。 frame这是一个能够将图片或者视频套入设备框架中的标签，可以用来更优雅地显示截图、录屏。 本插件最后更新于 4.0 版本{% frame 框架名 | img=图片链接 | alt=图片描述（可选） | part=top/bottom（可选） %}{% frame 框架名 | video=视频链接 | part=top/bottom（可选） %} {% frame iphone11 | img=https://7.dusays.com/2020/09/28/baa33914a34ec.jpg | video=https://7.dusays.com/2020/09/28/39db723f1e200.mp4 | part=top %} 在这个示例中同时出现了 img 和 video 那么它就是一个带有封面的视频，在视频加载完成之前会先显示视频封面。 设备框架目前支持的有： iphone11 如果您有以下其它设备框架图(svg)，欢迎 PR 兼容。 android, ipad, macbook, watch 剪裁通过设置 part=top 或者 part=bottom 来显示上半部分或者下半部分，否则将显示完整的框架及其中的图片/视频。 aplayer主题对 APlayer 插件的样式进行了兼容。安装插件： npm i -S hexo-tag-aplayer 使用方法： hexo-tag-aplayerhttps://github.com/MoePlayer/hexo-tag-aplayer issues最后更新于 4.0 版本{% issues type | api=url | group=key:value1,value2（可选） %} 类型根据需求不同，会将 issues 内容解析成不同的 HTML 标签，目前支持的类型有： timeline: 解析成 timeline 标签，issue 的标题对应 timeline 的时间， issue 的内容对应 timeline 的内容。 sites: 解析成 sites 标签，需要有 JSON 代码块：{ "title": "", "screenshot": "", "url": "", "avatar": "", "description": "", "keywords": ""} API传可以调得通的 URL ，例如： api=https://gitee.com/api/v5/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=activeapi=https://api.github.com/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=active 分组sites 类型的 issues 默认不分组，如果需要分组，可指定分组依据「key」，和分组白名单「value1」「value2」等，例如： group=version:v4,v3,v2 这个参数的作用就是，筛选出 JSON 中包含 "version": "v4" 或者 "version": "v3" 或者 "version": "v2" 的数据，并分组显示。 示例时间线{% issues timeline | api=https://gitee.com/api/v5/repos/xaoxuu/timeline/issues?state=open&creator=xaoxuu&sort=created&direction=desc&page=1&per_page=100 %} 显示效果： 对应的仓库链接： Gitee: xaoxuu/timelinehttps://gitee.com/xaoxuu/timeline/issues 友链{% issues sites | api=https://gitee.com/api/v5/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=active %}{% issues sites | api=https://api.github.com/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=active %} 上例中的 labels=active 参数可以控制默认的 issue 不显示，只有自己审核通过添加了 active 标签之后才会显示。上述示例对应的仓库链接： GitHub: xaoxuu/friendshttps://github.com/xaoxuu/friends/issues 分组这是主题官网的「示例博客」页面的数据： {% issues sites | api=https://api.github.com/repos/volantis-x/examples/issues?sort=updated&state=open&page=1&per_page=100 | group=version:版本：^4.0,版本：^3.0,版本：^2.0 %} 上述示例对应的仓库链接： GitHub: volantis-x/exampleshttps://github.com/volantis-x/examples/issues Hexo 通用标签在文章中使用 <!-- more -->，那么 <!-- more --> 之前的文字将会被视为摘要。首页中将只出现这部分文字，同时这部分文字也会出现在正文之中。详见 Hexo 官方文档： Hexo 官方文档 #标签插件https://hexo.io/zh-cn/docs/tag-plugins"},{"title":"标签插件","date":"2021-05-17T08:08:37.083Z","updated":"2021-05-17T08:08:37.083Z","comments":true,"path":"v5/tag-plugins/index.html","permalink":"https://volantis.js.org/v5/tag-plugins/","excerpt":"","text":"为了兼容老用户，旧的标签插件在重构之前依然沿用旧的格式，即 command + 空格 作为参数分隔符，而部分新增标签插件是 空格 + 英文竖线 + 空格 ，请注意区分。 我们也在探索哪种分隔符既简单又不容易引起冲突，所以可能存在多种格式，具体以对应文档描述为准。 text效果源码带 下划线 的文本；带 着重号 的文本；带 波浪线 的文本；带 删除线 的文本 键盘样式的文本：⌘ + D 密码样式的文本：这里没有验证码带 {% u 下划线 %} 的文本；带 {% emp 着重号 %} 的文本；带 {% wavy 波浪线 %} 的文本；带 {% del 删除线 %} 的文本键盘样式的文本：{% kbd ⌘ %} + {% kbd D %}密码样式的文本：{% psw 这里没有验证码 %} span语法效果源码参数本插件最后更新于 2.5 版本{% span 样式参数, 文本内容 %}各种颜色的标签，包括：红色、黄色、绿色、青色、蓝色、灰色。 超大号文字： Volantis A Wonderful Theme for Hexo各种颜色的标签，包括：{% span red, 红色 %}、{% span yellow, 黄色 %}、{% span green, 绿色 %}、{% span cyan, 青色 %}、{% span blue, 蓝色 %}、{% span gray, 灰色 %}。超大号文字：{% span center logo large, Volantis %} {% span center small, A Wonderful Theme for Hexo %} 属性 可选值 字体 logo, code 颜色 red, yellow, green, cyan, blue, gray 大小 small, h4, h3, h2, h1, large, huge, ultra 对齐方向 left, center, right p参数效果源码参数本插件最后更新于 2.5 版本{% p 样式参数, 文本内容 %}红色 黄色 绿色 青色 蓝色 灰色 Volantis A Wonderful Theme for Hexo{% p red, 红色 %}{% p yellow, 黄色 %}{% p green, 绿色 %}{% p cyan, 青色 %}{% p blue, 蓝色 %}{% p gray, 灰色 %}{% p center logo large, Volantis %}{% p center small, A Wonderful Theme for Hexo %} 属性 可选值 字体 logo, code 颜色 red, yellow, green, cyan, blue, gray 大小 small, h4, h3, h2, h1, large, huge, ultra 对齐方向 left, center, right noteNoteBlock 是 Blockquote 的增强版，在左边显示图标，并且可以自定颜色。而 Note 是 NoteBlock 的简便写法。 最后更新于 2.3 版本{% note 样式参数, 文本内容 %} 演示效果经典用法可以在配置文件中设置默认样式，为简单的一句话提供最的简便写法。 note quote 适合引用一段话 note info 默认主题色，适合中性的信息 note warning 默认黄色，适合警告性的信息 note error/danger 默认红色，适合危险性的信息 note done/success 默认绿色，适合正确操作的信息 更多图标这些都是默认样式，可以手动加上颜色： note radiation 默认样式 note radiation yellow 可以加上颜色 note bug red 说明还存在的一些故障 note link green 可以放置一些链接 note paperclip blue 放置一些附件链接 note todo 待办事项 note guide clear 可以加上一段向导 note download 可以放置下载链接 note message gray 一段消息 note up 可以说明如何进行更新 note undo light 可以说明如何撤销或者回退 上述示例的源码example:#### 经典用法{% note, 可以在配置文件中设置默认样式，为简单的一句话提供最的简便写法。 %}{% note quote, note quote 适合引用一段话 %}{% note info, note info 默认主题色，适合中性的信息 %}{% note warning, note warning 默认黄色，适合警告性的信息 %}{% note danger, note error/danger 默认红色，适合危险性的信息 %}{% note success, note done/success 默认绿色，适合正确操作的信息 %}#### 更多图标这些都是默认样式，可以手动加上颜色：{% note radiation, note radiation 默认样式 %}{% note radiation yellow, note radiation yellow 可以加上颜色 %}{% note bug red, note bug red 说明还存在的一些故障 %}{% note link green, note link green 可以放置一些链接 %}{% note paperclip blue, note paperclip blue 放置一些附件链接 %}{% note todo, note todo 待办事项 %}{% note guide clear, note guide clear 可以加上一段向导 %}{% note download, note download 可以放置下载链接 %}{% note message gray, note message gray 一段消息 %}{% note up, note up 可以说明如何进行更新 %}{% note undo light, note undo light 可以说明如何撤销或者回退 %} 可以支持的参数样式参数位置可以写图标和颜色，多个样式参数用空格隔开。 图标彩色的quote, info, warning, done/success, error/danger 灰色的，也可以指定颜色radiation, bug, idea, link, paperclip, todo, message, guide, download, up, undo 颜色指定颜色clear, light, gray, red, yellow, green, cyan, blue noteblockNoteBlock 是 Blockquote 的增强版，在左边显示图标，并且可以自定颜色。而 Note 是 NoteBlock 的简便写法。 最后更新于 4.0 版本{% noteblock 样式参数（可选）, 标题（可选） %}文本段落{% endnoteblock %} 演示效果可以在区块中放置一些复杂的结构，支持嵌套。 标题（可选）Windows 10不是為所有人設計,而是為每個人設計嵌套测试： 请坐和放宽，我正在帮你搞定一切... Folding 测试： 点击查看更多 不要说我们没有警告过你我们都有不顺利的时候 上述示例的源码example:{% noteblock, 标题（可选） %}Windows 10不是為所有人設計,而是為每個人設計{% noteblock done %}嵌套测试： 请坐和放宽，我正在帮你搞定一切...{% endnoteblock %}{% folding yellow, Folding 测试： 点击查看更多 %}{% note warning, 不要说我们没有警告过你 %}{% noteblock bug red %}我们都有不顺利的时候{% endnoteblock %}{% endfolding %}{% endnoteblock %} 可以支持的参数样式参数位置可以写图标和颜色，多个样式参数用空格隔开。 图标彩色的quote, info, warning, done/success, error/danger 灰色的，也可以指定颜色radiation, bug, idea, link, paperclip, todo, message, guide, download, up, undo 颜色指定颜色clear, light, gray, red, yellow, green, cyan, blue checkbox最后更新于 2.6 版本{% checkbox 样式参数（可选）, 文本（支持简单md） %} 演示效果 纯文本测试 支持简单的 markdown 语法 支持自定义颜色 绿色 + 默认选中 黄色 + 默认选中 青色 + 默认选中 蓝色 + 默认选中 增加 减少 叉 上述示例的源码example:{% checkbox 纯文本测试 %}{% checkbox checked, 支持简单的 [markdown](https://guides.github.com/features/mastering-markdown/) 语法 %}{% checkbox red, 支持自定义颜色 %}{% checkbox green checked, 绿色 + 默认选中 %}{% checkbox yellow checked, 黄色 + 默认选中 %}{% checkbox cyan checked, 青色 + 默认选中 %}{% checkbox blue checked, 蓝色 + 默认选中 %}{% checkbox plus green checked, 增加 %}{% checkbox minus yellow checked, 减少 %}{% checkbox times red checked, 叉 %} 可以支持的参数颜色red, yellow, green, cyan, blue 样式plus, minus, times 选中状态checked radio最后更新于 2.6 版本{% checkbox 样式参数（可选）, 文本（支持简单md） %} 演示效果 纯文本测试 支持简单的 markdown 语法 支持自定义颜色 绿色 黄色 青色 蓝色 上述示例的源码example:{% radio 纯文本测试 %}{% radio checked, 支持简单的 [markdown](https://guides.github.com/features/mastering-markdown/) 语法 %}{% radio red, 支持自定义颜色 %}{% radio green, 绿色 %}{% radio yellow, 黄色 %}{% radio cyan, 青色 %}{% radio blue, 蓝色 %} 可以支持的参数颜色red, yellow, green, cyan, blue 选中状态checked timeline最后更新于 3.0 版本{% timeline 时间线标题（可选） %}{% timenode 时间节点（标题） %}正文内容{% endtimenode %}{% timenode 时间节点（标题） %}正文内容{% endtimenode %}{% endtimeline %} 演示效果 2020-07-24 2.6.6 -> 3.0 如果有 hexo-lazyload-image 插件，需要删除并重新安装最新版本，设置 lazyload.isSPA: true。2.x 版本的 css 和 js 不适用于 3.x 版本，如果使用了 use_cdn: true 则需要删除。2.x 版本的 fancybox 标签在 3.x 版本中被重命名为 gallery 。2.x 版本的置顶 top: true 改为了 pin: true，并且同样适用于 layout: page 的页面。如果使用了 hexo-offline 插件，建议卸载，3.0 版本默认开启了 pjax 服务。 2020-05-15 2.6.3 -> 2.6.6 不需要额外处理。 2020-04-20 2.6.2 -> 2.6.3 全局搜索 seotitle 并替换为 seo_title。group 组件的索引规则有变，使用 group 组件的文章内，group: group_name 对应的组件名必须是 group_name。group 组件的列表名优先显示文章的 short_title 其次是 title。 上述示例的源码example:{% timeline %}{% timenode 2020-07-24 [2.6.6 -> 3.0](https://github.com/volantis-x/hexo-theme-volantis/releases) %}1. 如果有 `hexo-lazyload-image` 插件，需要删除并重新安装最新版本，设置 `lazyload.isSPA: true`。2. 2.x 版本的 css 和 js 不适用于 3.x 版本，如果使用了 `use_cdn: true` 则需要删除。3. 2.x 版本的 fancybox 标签在 3.x 版本中被重命名为 gallery 。4. 2.x 版本的置顶 `top: true` 改为了 `pin: true`，并且同样适用于 `layout: page` 的页面。5. 如果使用了 `hexo-offline` 插件，建议卸载，3.0 版本默认开启了 pjax 服务。{% endtimenode %}{% timenode 2020-05-15 [2.6.3 -> 2.6.6](https://github.com/volantis-x/hexo-theme-volantis/releases/tag/2.6.6) %}不需要额外处理。{% endtimenode %}{% timenode 2020-04-20 [2.6.2 -> 2.6.3](https://github.com/volantis-x/hexo-theme-volantis/releases/tag/2.6.3) %}1. 全局搜索 `seotitle` 并替换为 `seo_title`。2. group 组件的索引规则有变，使用 group 组件的文章内，`group: group_name` 对应的组件名必须是 `group_name`。2. group 组件的列表名优先显示文章的 `short_title` 其次是 `title`。{% endtimenode %}{% endtimeline %} link最后更新于 3.0 版本{% link 标题, 链接, 图片链接（可选） %} 演示效果如何参与项目https://volantis.js.org/contributors/ 上述示例的源码example:{% link 如何参与项目, https://volantis.js.org/contributors/, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets@master/logo/256/safari.png %} button这个页面的标签将会在不久后重构 基础按钮请将您的 Volantis 升级至 2.4 版本以上使用。 语法格式参数列表示例写法示例效果{% btn 样式参数（可选）, 标题, 链接, 图标（可选） %} 可选的参数可以省略，但是前后顺序不能乱。样式参数 regular, large, center 图标 第1个或者第2个参数包含 fa- 的那个被识别为图标。example.md:不设置任何参数的 {% btn 按钮, / %} 适合融入段落中。regular 按钮适合独立于段落之外：{% btn regular, 示例博客, https://xaoxuu.com, fas fa-play-circle %}large 按钮更具有强调作用，建议搭配 center 使用：{% btn center large, 开始使用, https://volantis.js.org/v3/getting-started/, fas fa-download %}行内按钮 不设置任何参数的 按钮 适合融入段落中。 空心按钮 示例博客 示例博客 示例博客 示例博客 居中： 开始使用 实心按钮 示例博客 示例博客 示例博客 示例博客 居中： 开始使用 富文本按钮请将您的 Volantis 升级至 2.3 版本以上使用。 语法格式参数列表示例写法示例效果{% btns 样式参数 %}{% cell 标题, 链接, 图片或者图标 %}{% cell 标题, 链接, 图片或者图标 %}{% endbtns %}样式参数位置可以写图片样式、布局方式，多个样式参数用空格隔开。 圆角样式 默认为方形 rounded, circle 布局方式 默认为自动宽度，适合视野内只有一两个的情况。 参数 含义 wide 宽一点的按钮 fill 填充布局，自动铺满至少一行，多了会换行。 center 居中，按钮之间是固定间距。 around 居中分散 grid2 等宽最多2列，屏幕变窄会适当减少列数。 grid3 等宽最多3列，屏幕变窄会适当减少列数。 grid4 等宽最多4列，屏幕变窄会适当减少列数。 grid5 等宽最多5列，屏幕变窄会适当减少列数。 增加文字样式 可以在容器内增加 <b>标题</b> 和 <p>描述文字</p>如果需要显示类似「团队成员」之类的一组含有头像的链接： example.md:{% btns circle grid5 %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% cell xaoxuu, https://xaoxuu.com, https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png %}{% endbtns %} 或者含有图标的按钮： example.md:{% btns rounded grid5 %}{% cell 下载源码, /, fas fa-download %}{% cell 查看文档, /, fas fa-book-open %}{% endbtns %} 圆形图标 + 标题 + 描述 + 图片 + 网格5列 + 居中 example.md:{% btns circle center grid5 %}<a href='https://apps.apple.com/cn/app/heart-mate-pro-hrm-utility/id1463348922?ls=1'> <i class='fab fa-apple'></i> <b>心率管家</b> {% p red, 专业版 %} <img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/qrcode/heartmate_pro.png'></a><a href='https://apps.apple.com/cn/app/heart-mate-lite-hrm-utility/id1475747930?ls=1'> <i class='fab fa-apple'></i> <b>心率管家</b> {% p green, 免费版 %} <img src='https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/qrcode/heartmate_lite.png'></a>{% endbtns %}如果需要显示类似「团队成员」之类的一组含有头像的链接： xaoxuu xaoxuu xaoxuu xaoxuu xaoxuu 或者含有图标的按钮： 下载源码 查看文档 圆形图标 + 标题 + 描述 + 图片 + 网格5列 + 居中 心率管家 专业版 心率管家 免费版 ghcard最后更新于 4.0 版本{% ghcard 用户名, 其它参数（可选） %}{% ghcard 用户名/仓库, 其它参数（可选） %} 用户信息卡片 上述示例的源码： example:| {% ghcard xaoxuu %} | {% ghcard xaoxuu, theme=vue %} || -- | -- || {% ghcard xaoxuu, theme=buefy %} | {% ghcard xaoxuu, theme=solarized-light %} || {% ghcard xaoxuu, theme=onedark %} | {% ghcard xaoxuu, theme=solarized-dark %} || {% ghcard xaoxuu, theme=algolia %} | {% ghcard xaoxuu, theme=calm %} | 仓库信息卡片 上述示例的源码： example:| {% ghcard volantis-x/hexo-theme-volantis %} | {% ghcard volantis-x/hexo-theme-volantis, theme=vue %} || -- | -- || {% ghcard volantis-x/hexo-theme-volantis, theme=buefy %} | {% ghcard volantis-x/hexo-theme-volantis, theme=solarized-light %} || {% ghcard volantis-x/hexo-theme-volantis, theme=onedark %} | {% ghcard volantis-x/hexo-theme-volantis, theme=solarized-dark %} || {% ghcard volantis-x/hexo-theme-volantis, theme=algolia %} | {% ghcard volantis-x/hexo-theme-volantis, theme=calm %} | 更多参数选择GitHub 卡片 API 参数https://github-readme-stats.vercel.app site网站卡片可以显示网站截图、logo、标题、描述，使用方法和友链标签一模一样，唯一的区别是数据文件名称为 sites.yml，可以和友链数据混用，通过分组过滤实现不一样的效果。 示例写法{% sites only:community_team %} sites only:community_team MHuiG划水Colsrch开发者inkss摸鱼W4J1e打杂 dropmenu这个页面的标签将会在不久后重构 下拉菜单请将您的 Volantis 升级至 3.0 版本以上使用。 语法格式示例写法示例效果容器 {% menu 前缀（可省略）, 标题, 后缀（可省略） %}菜单内容{% endmenu %} 菜单内容 菜单项 {% menuitem 文本, 链接, 图标 %} 分割线 {% menuitem hr %} 子菜单 {% submenu 嵌套菜单, 图标 %}菜单内容{% endsubmenu %}示例1 {% menu 下拉菜单 %}{% menuitem 主题源码, https://github.com/volantis-x/hexo-theme-volantis/, fas fa-file-code %}{% menuitem 更新日志, https://github.com/volantis-x/hexo-theme-volantis/releases/, fas fa-clipboard-list %}{% menuitem hr %}{% submenu 有疑问？, fas fa-question-circle %}{% menuitem 看 FAQ, /faqs/ %}{% menuitem 看 本站源码, https://github.com/volantis-x/volantis-docs/ %}{% menuitem 提 Issue, https://github.com/volantis-x/hexo-theme-volantis/issues/ %}{% endsubmenu %}{% endmenu %} 示例2 {% menu 这个是, 下拉菜单 %}（同上）{% endmenu %} 示例3 {% menu 这个是, 下拉菜单, 的示例效果。 %}（同上）{% endmenu %}示例1 下拉菜单 主题源码 更新日志 有疑问？ 看 FAQ 看 本站源码 提 Issue 示例2 这个是 下拉菜单 主题源码 更新日志 有疑问？ 看 FAQ 看 本站源码 提 Issue 示例3 这个是 下拉菜单 主题源码 更新日志 有疑问？ 看 FAQ 看 本站源码 提 Issue 的示例效果。 tab此插件移植自 NexT #tabs 最后更新于 2.1 版本{% tabs 页面内不重复的ID %}<!-- tab 栏目1 -->内容<!-- endtab --><!-- tab 栏目2 -->内容<!-- endtab -->{% endtabs %} 演示效果栏目1栏目2。。。！！！ 上述示例的源码example:{% tabs tab-id %}<!-- tab 栏目1 -->。。。<!-- endtab --><!-- tab 栏目2 -->！！！<!-- endtab -->{% endtabs %} folding最后更新于 2.3 版本{% folding 参数（可选）, 标题 %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endfolding %} 演示效果 查看图片测试 查看默认打开的折叠框 这是一个默认打开的折叠框。 查看代码测试 {% folding green, 查看代码测试 %}查看代码测试{% endfolding %} 查看列表测试 hahahehe 查看嵌套测试 查看嵌套测试2 查看嵌套测试3 hahaha 上述示例的源码example:{% folding 查看图片测试 %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endfolding %}{% folding cyan open, 查看默认打开的折叠框 %}这是一个默认打开的折叠框。{% endfolding %}{% folding green, 查看代码测试 %}{% endfolding %}{% folding yellow, 查看列表测试 %}- haha- hehe{% endfolding %}{% folding red, 查看嵌套测试 %}{% folding blue, 查看嵌套测试2 %}{% folding 查看嵌套测试3 %}hahaha <span><img src='https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/tieba/%E6%BB%91%E7%A8%BD.png' style='height:24px'></span>{% endfolding %}{% endfolding %}{% endfolding %} 可以支持的参数参数位置可以填写颜色和状态，多个参数用空格隔开。 颜色blue, cyan, green, yellow, red 状态状态填写 open 代表默认打开。 inlineimageInlineimage 标签是一种行内图片标签，可以用来在一段话中间插入表情。 本插件最后更新于 4.0 版本{% inlineimage 图片链接, height=高度（可选） %} 演示效果这是 一段话。 这又是 一段话。 上述示例的源码example:这是 {% inlineimage https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/aru-l/0000.gif %} 一段话。这又是 {% inlineimage https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/aru-l/5150.gif, height=40px %} 一段话。 可以支持的参数高度height=20px imageImage 标签是一种针对单个图片应用场景的标签，支持图片描述文字和指定宽度。 本插件最后更新于 4.0 版本{% image 链接, width=宽度（可选）, height=高度（可选）, alt=描述（可选）, bg=占位颜色（可选） %} 演示效果添加描述： 每天下课回宿舍的路，没有什么故事。 指定宽度： 指定宽度并添加描述： 每天下课回宿舍的路，没有什么故事。 设置占位背景色： 优化不同宽度浏览的观感 上述示例的源码example:添加描述：{% image https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg, alt=每天下课回宿舍的路，没有什么故事。 %}指定宽度：{% image https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg, width=400px %}指定宽度并添加描述：{% image https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg, width=400px, alt=每天下课回宿舍的路，没有什么故事。 %}设置占位背景色：{% image https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg, width=400px, bg=#1D0C04, alt=优化不同宽度浏览的观感 %} 可以支持的参数图片宽高度example:width=300px, height=32px 图片描述example:alt=图片描述 占位背景色example:bg=#f2f2f2 galleryGallery 标签是一种针对一组图片应用场景的标签。 本插件最后更新于 5.0 版本{% gallery 参数, 列数, 分组 %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B18FCBB3-67FD-48CC-B4F3-457BA145F17A.jpeg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/67239FBB-E15D-4F4F-8EE8-0F1C9F3C4E7C.jpeg){% endgallery %} 演示效果一行一个图片 图片描述 一行多个图片（不换行） 图片描述 图片描述 图片描述 多行多个图片（每行2～8个图片） 上述示例的源码一行一个图片 example.md:{% gallery %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg){% endgallery %} 一行多个图片（不换行） example.md:{% gallery , , one %}![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/B18FCBB3-67FD-48CC-B4F3-457BA145F17A.jpeg)![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/67239FBB-E15D-4F4F-8EE8-0F1C9F3C4E7C.jpeg)![图片描述](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/00E0F0ED-9F1C-407A-9AA6-545649D919F4.jpeg){% endgallery %} 多行多个图片（每行2～8个图片） example.md:{% gallery stretch, 6, two %}![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/001.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/002.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/003.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/004.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/005.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/006.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/007.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/008.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/009.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/010.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/011.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/012.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/013.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/014.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/015.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/016.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/017.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/018.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/019.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/020.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/021.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/022.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/023.jpg)![](https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/024.jpg){% endgallery %} 可以支持的参数对齐方向left, center, right 缩放stretch 列数逗号后面直接写列数，支持 2 ～ 8 列。设定列列数之后就是「多行多图」布局，此时图片默认左对齐。为了避免图片大小不一，建议搭配 stretch 来时图片放大填充。 分组相同内容的会被归档在一个分组中。 audio本插件最后更新于 2.4 版本{% audio 音频链接 %} 演示效果Your browser does not support the audio tag. 上述示例的源码example:{% audio https://github.com/volantis-x/volantis-docs/releases/download/assets/Lumia1020.mp3 %} video本插件最后更新于 2.3 版本{% video 视频链接 %} 演示效果100%宽度 Your browser does not support the video tag. 50%宽度 Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. 25%宽度 Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. Your browser does not support the video tag. 上述示例的源码100%宽度 example.md:{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %} 50%宽度 example.md:{% videos, 2 %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% endvideos %} 25%宽度 example.md:{% videos, 4 %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% video https://github.com/volantis-x/volantis-docs/releases/download/assets/IMG_0341.mov %}{% endvideos %} 可以支持的参数对齐方向left, center, right 列数逗号后面直接写列数，支持 1 ～ 4 列。 frame这是一个能够将图片或者视频套入设备框架中的标签，可以用来更优雅地显示截图、录屏。 本插件最后更新于 4.0 版本{% frame 框架名 | img=图片链接 | alt=图片描述（可选） | part=top/bottom（可选） %}{% frame 框架名 | video=视频链接 | part=top/bottom（可选） %} {% frame iphone11 | img=https://7.dusays.com/2020/09/28/baa33914a34ec.jpg | video=https://7.dusays.com/2020/09/28/39db723f1e200.mp4 | part=top %} 在这个示例中同时出现了 img 和 video 那么它就是一个带有封面的视频，在视频加载完成之前会先显示视频封面。 设备框架目前支持的有： iphone11 如果您有以下其它设备框架图(svg)，欢迎 PR 兼容。 android, ipad, macbook, watch 剪裁通过设置 part=top 或者 part=bottom 来显示上半部分或者下半部分，否则将显示完整的框架及其中的图片/视频。 aplayer主题对 APlayer 插件的样式进行了兼容。安装插件： npm i -S hexo-tag-aplayer 使用方法： hexo-tag-aplayerhttps://github.com/MoePlayer/hexo-tag-aplayer issues最后更新于 4.0 版本{% issues type | api=url | group=key:value1,value2（可选） %} 类型根据需求不同，会将 issues 内容解析成不同的 HTML 标签，目前支持的类型有： timeline: 解析成 timeline 标签，issue 的标题对应 timeline 的时间， issue 的内容对应 timeline 的内容。 sites: 解析成 sites 标签，需要有 JSON 代码块：{ "title": "", "screenshot": "", "url": "", "avatar": "", "description": "", "keywords": ""} API传可以调得通的 URL ，例如： api=https://gitee.com/api/v5/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=activeapi=https://api.github.com/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=active 分组sites 类型的 issues 默认不分组，如果需要分组，可指定分组依据「key」，和分组白名单「value1」「value2」等，例如： group=version:v4,v3,v2 这个参数的作用就是，筛选出 JSON 中包含 "version": "v4" 或者 "version": "v3" 或者 "version": "v2" 的数据，并分组显示。 示例时间线{% issues timeline | api=https://gitee.com/api/v5/repos/xaoxuu/timeline/issues?state=open&creator=xaoxuu&sort=created&direction=desc&page=1&per_page=100 %} 显示效果： 对应的仓库链接： Gitee: xaoxuu/timelinehttps://gitee.com/xaoxuu/timeline/issues 友链{% issues sites | api=https://gitee.com/api/v5/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=active %}{% issues sites | api=https://api.github.com/repos/xaoxuu/friends/issues?sort=updated&state=open&page=1&per_page=100&labels=active %} 上例中的 labels=active 参数可以控制默认的 issue 不显示，只有自己审核通过添加了 active 标签之后才会显示。上述示例对应的仓库链接： GitHub: xaoxuu/friendshttps://github.com/xaoxuu/friends/issues 分组这是主题官网的「示例博客」页面的数据： {% issues sites | api=https://api.github.com/repos/volantis-x/examples/issues?sort=updated&state=open&page=1&per_page=100 | group=version:版本：^4.0,版本：^3.0,版本：^2.0 %} 上述示例对应的仓库链接： GitHub: volantis-x/exampleshttps://github.com/volantis-x/examples/issues Hexo 通用标签在文章中使用 <!-- more -->，那么 <!-- more --> 之前的文字将会被视为摘要。首页中将只出现这部分文字，同时这部分文字也会出现在正文之中。详见 Hexo 官方文档： Hexo 官方文档 #标签插件https://hexo.io/zh-cn/docs/tag-plugins"},{"title":"主题配置","date":"2021-05-17T08:08:37.083Z","updated":"2021-05-17T08:08:37.083Z","comments":true,"path":"v4/theme-settings/index.html","permalink":"https://volantis.js.org/v4/theme-settings/","excerpt":"","text":"创建主题配置文件主题目录下的 _config.yml 文件通常负责主题相关配置，我们强烈建议您使用代替的主题配置文件以防止自己的配置丢失。那么如何使用代替主题配置文件呢？ 第 1/2 步：创建配置文件 在博客根目录的 _config.yml 文件旁边新建一个文件： _config.volantis.yml ，这个文件中的配置信息优先级高于主题文件夹中的配置文件。 第 2/2 步：覆盖自定义配置 当您需要修改某项内容时，例如导航栏菜单，那么您需要在主题配置文件中找到相关内容，复制进自己创建的配置文件中：blog/_config.volantis.ymlnavbar: visiable: auto # always, auto logo: # choose [img] or [icon + title] img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/Logo-NavBar@3x.png icon: title: menu: - name: 博客 icon: fas fa-rss url: /小提示使用「npm i hexo-theme-volantis」方式安装的主题，主题配置文件在「blog/node_modules/hexo-theme-volantis/_config.yml」使用传统方式安装的主题，主题配置文件在「blog/themes/volantis/_config.yml」 自定义主题外观最大布局宽度blog/_config.volantis.ymlcustom_css: ... max_width: 1080px # Sum of body width and sidebar width 网页所呈现的内容的最大宽度，即 body 和 sidebar 的宽度之和。 抗锯齿blog/_config.volantis.ymlcustom_css: ... font_smoothing: true # font-smoothing for webkit 自定义光标样式blog/_config.volantis.ymlcustom_css: ... cursor: enable: true text: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/text.png pointer: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/pointer.png default: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/left_ptr.png not-allowed: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/circle.png zoom-out: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/zoom-out.png zoom-in: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/zoom-in.png grab: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/openhand.png 导航栏样式您可以设置导航栏的高度以及视觉特效，视觉特效目前可选的有： shadow：卡片阴影。 floatable：当鼠标移动到容器内时，呈现出浮起来的效果。 blur：背景模糊效果（毛玻璃），当浏览器不支持时显示为不透明。 blog/_config.volantis.ymlcustom_css: ... navbar: height: 64px effect: [shadow, blur] # [shadow, floatable, blur] 滚动条样式blog/_config.volantis.ymlcustom_css: ... scrollbar: size: 4px border: 2px color: '#2196f3' hover: '#ff5722' 侧边栏样式视觉特效参数同上，值得注意的是：卡片的 floatable 效果和 blur 效果相冲突。 blog/_config.volantis.ymlcustom_css: ... sidebar: effect: [shadow] # [shadow, floatable, blur] 正文区域样式视觉特效参数同上，值得注意的是：卡片的 floatable 效果和 blur 效果相冲突。您可以在 language: true 这里设置代码块显示语言名称。text_align 可以设置 h1/h2/h3/h4/p 的文字对齐方向。 blog/_config.volantis.ymlcustom_css: ... body: effect: [shadow] # [shadow, floatable, blur] highlight: language: true # show language of codeblock copy_btn: true text_align: # left, right, justify, center h1: left h2: left h3: left h4: left p: justify note: # style for default note: {% note text %} icon: '\\f054' color: '' 布局间距您可以设置几种标题的布局间距 h2/h3/h4、段落间距 line、区块内部的段落间距 inline。 blog/_config.volantis.ymlcustom_css: ... gap: h2: 48px # Spacing above H2 (only px unit) h3: 32px # Spacing above H3 (only px unit) h4: 16px # Spacing above H4 (only px unit) paragraph: 1rem # Paragraph spacing between paragraphs row: .5rem # Paragraph spacing between other elements 自定义字体您可以自定义正文和代码字体。 blog/_config.volantis.ymlcustom_css: ... fontfamily: logofont: fontfamily: '"Varela Round", "PingFang SC", "Microsoft YaHei", Helvetica, Arial' name: 'Varela Round' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/VarelaRound/VarelaRound-Regular.ttf weight: normal style: normal bodyfont: fontfamily: 'UbuntuMono, "PingFang SC", "Microsoft YaHei", Helvetica, Arial' name: 'UbuntuMono' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/UbuntuMono/UbuntuMono-Regular.ttf weight: normal style: normal codefont: fontfamily: 'Menlo, Monaco' name: 'Monaco' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/Monaco/Monaco.ttf weight: normal style: normal 自定义颜色多彩配色方案 blog/_config.volantis.ymlcolor_scheme: # ------------ # 通用颜色 common: # 主题色 theme: '#44D7B6' # 链接色 link: '#2196f3' # 按钮色 button: '#44D7B6' # 鼠标放到交互元素上时的色 hover: '#ff5722' # 主题色块内部的文字颜色 inner: '#fff' # 选中区域文字的背景颜色 selection: 'alpha(#2196f3, 0.2)' # ------------ # 亮色主题（默认） light: # 网站背景色 site_bg: '#f4f4f4' # 网站背景上的文字 site_inner: '#fff' # 网站页脚文字 site_footer: '#666' # 卡片背景色 card: '#fff' # 卡片上的普通文字 text: '#444' # 区块和代码块背景色 block: '#f6f6f6' # 代码块高亮时的背景色 codeblock: '#FFF7EA' # 行内代码颜色 inlinecode: '#D56D28' # 文章部分 h1: '#444' h2: '#444' h3: '#444' h4: '#444' h5: '#444' h6: '#444' p: '#444' # 列表文字 list: '#666' # 列表 hover 时的文字 list_hl: 'mix($color-theme, #000, 80)' # 辅助性文字 meta: '#888' # ------------ # 暗色主题 dark: # 网站背景色 site_bg: '#222' # 网站背景上的文字 site_inner: '#eee' # 网站页脚文字 site_footer: '#aaa' # 卡片背景色 card: '#444' # 卡片上的普通文字 text: '#eee' # 区块和代码块背景色 block: '#3a3a3a' # 代码块高亮时的背景色 codeblock: '#343a3c' # 行内代码颜色 inlinecode: '#D56D28' # 文章部分 h1: '#eee' h2: '#eee' h3: '#ddd' h4: '#ddd' h5: '#ddd' h6: '#ddd' p: '#bbb' # 列表文字 list: '#aaa' # 列表 hover 时的文字 list_hl: 'mix($color-theme, #fff, 80)' # 辅助性文字 meta: '#888' # 夜间图片亮度 brightness: 70% 自定义右键菜单blog/_config.volantis.yml# 自定义右键菜单rightmenu: enable: true # hr: 分割线, music: 音乐控制器 layout: [home, help, examples, contributors, hr, source_docs, source_theme, hr, print, hr, dark_mode, hr, music] # 可选功能项 print: name: 打印页面 icon: fa fa-print onclick: document.execCommand('print') # 自定义菜单的格式如下 help: name: 常见问题 icon: fa fa-question url: https://volantis.js.org/faqs/ examples: name: 示例博客 icon: fa fa-rss url: https://volantis.js.org/examples/ contributors: name: 加入社区 icon: fa fa-fan fa-spin url: https://volantis.js.org/contributors/ source_docs: name: 本站源码 icon: fa fa-code-branch url: https://github.com/volantis-x/volantis-docs/ source_theme: name: 主题源码 icon: fa fa-code-branch url: https://github.com/volantis-x/hexo-theme-volantis/ dark_mode: name: Dark mode icon: fas fa-moon toggle: darkmode 设置网站导航栏导航栏配置导航栏分为 logo、menu、search 三个区域设置，其中 logo 区域如果设置了图片，则不能显示图标和标题， menu 区域的设置可以写在一个单独的文件中。 blog/_config.volantis.yml# 注意事项：建议规范全站路径 URL 最后带一个 "/" 例如 "about/"navbar: logo: # choose [img] or [icon + title] img: icon: title: menu: # The following can be written in `blog/source/_data/menu.yml` - name: 博客 icon: fas fa-rss url: / - name: 分类 icon: fas fa-folder-open url: categories/ - name: 标签 icon: fas fa-tags url: tags/ - name: 归档 icon: fas fa-archive url: archives/ - name: 友链 icon: fas fa-link url: friends/ - name: 关于 icon: fas fa-info-circle url: about/ search: 搜索 # Search bar placeholder 使用数据文件 建议新建一个文件，专门存放导航栏菜单配置，文件的路径为： blog/source/_data/menu.yml 文件的内容为： blog/source/_data/menu.yml- name: 博客 icon: fas fa-rss url: /... 菜单嵌套导航栏菜单支持嵌套，嵌套的属性名为 rows ，写法示例： blog/source/_data/menu.yml...- name: 更多 icon: fas fa-ellipsis-v rows: - name: 主题源码 url: https://github.com/volantis-x/hexo-theme-volantis/ - name: 更新日志 url: https://github.com/volantis-x/hexo-theme-volantis/releases/ - name: hr - name: 有疑问？ rows: - name: 看 FAQ url: faqs/ - name: 看 本站源码 url: https://github.com/volantis-x/volantis-docs/ - name: 提 Issue url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: hr - name: 公告和测试博文 url: archives/ - name: 示例博客 url: examples/ - name: 特别感谢 url: contributors/ 分割线在子菜单中，新增一个只有 name: hr 的“菜单”就会被渲染成一个分割线。 - name: hr 小标题在子菜单中，新增一个只有 name: 小标题内容（也可以有 icon: 小标题的图标）的“菜单”就会被渲染成一个小标题。 ...- name: 近期 icon: fas fa-clock url: / rows: - name: 热门文章 icon: fas fa-fire - name: ProHUD 开源库的设计思路 url: blog/2019-08-27-prohud/ - name: ValueX：实用的安全对象类型转换库 url: blog/2019-08-29-valuex/ - name: 心率管家 App 的设计与开发 url: blog/2019-07-23-heartmate/ 播放器在子菜单中，新增一个 icon: fas fa-compact-disc 的“菜单”就会被渲染成一个 APlayer 播放器。 - name: 背景音乐 icon: fas fa-compact-disc 设置网站页脚您通过 layout 可以自由布局网站页脚内容 aplayer, social, license, info, copyright。 blog/_config.volantis.ymlsite_footer: # layout of footer: [aplayer, social, license, info, copyright] layout: [aplayer, social, license, info, copyright] social: - icon: fas fa-rss url: atom.xml - icon: fas fa-envelope url: mailto:me@xaoxuu.com - icon: fab fa-github url: https://github.com/xaoxuu - icon: fas fa-headphones-alt url: https://music.163.com/#/user/home?id=63035382 copyright: '[Copyright © 2017-2021 XXX](/)' # You can add your own property here. (Support markdown, for example: br: '<br>') br: '<br>' 其中，aplayer 需要在插件部分设置中启用。您可以新增文字属性，用于展示其它文字信息，例如： blog/_config.volantis.ymlsite_footer: layout: [..., br, hello, ...] ... # You can add your own property here. (Support markdown, for example: br: '<br>') br: '<br>' hello: '[Hello World](/)' 网站与文章封面封面高度blog/_config.volantis.ymlcover: height_scheme: full # full, half ... 目前主题提供两种首页封面高度方案，其它页面均为半屏幕高度。 封面布局方案blog/_config.volantis.ymlcover: ... scheme: dock # search (搜索), dock (坞), featured (精选), focus (焦点) ... 布局方案 适合场景 search 注重搜索 dock 入口选项比较多 featured 选项在4个左右 focus 选项在4个左右 默认显示设置blog/_config.volantis.ymlcover: ... display: home: true archive: false others: false # can be written in front-matter 'cover: true' 由于主页、归档是 hexo 自动生成的，您需要在主题配置文件中设置是否显示封面，而其它页面则可以在 front-matter 中通过设置 cover: true/false 来决定显示封面或者不显示封面。 文章布局配置# 文章布局article: # 文章列表页面的文章卡片布局方案 preview: scheme: landscape # landscape # pin icon for post pin_icon: https://cdn.jsdelivr.net/gh/twitter/twemoji@13.0/assets/svg/1f4cc.svg # auto generate title if not exist auto_title: true # false, true # auto generate excerpt if not exist auto_excerpt: true # false, true # show split line or not line_style: solid # hidden, solid, dashed, dotted # show readmore button readmore: auto # auto, always # 文章详情页面的文章卡片本体布局方案 body: # 文章顶部信息 # 从 meta_library 中取 top_meta: [author, category, date, counter] # ---------------- # 文章页脚组件 footer_widget: # ---------------- # 参考资料、相关资料等 (for layout: post/docs) references: title: 参考资料 icon: fas fa-quote-left # 在 front-matter 中: # references: # - title: 某篇文章 # url: https:// # 即可显示此组件。 # ---------------- # 相关文章，需要安装插件 (for layout: post) # npm i hexo-related-popular-posts related_posts: enable: false title: 相关文章 icon: fas fa-bookmark max_count: 5 # 设为空则不使用文章头图 placeholder_img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/046.jpg # ---------------- # 版权声明组件 (for layout: post/docs) copyright: enable: true permalink: '本文永久链接是：' content: - '博客内容遵循 署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 协议' - permalink # ---------------- # 打赏组件 (for layout: post/docs) donate: enable: false images: - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png # 文章底部信息 # 从 meta_library 中取 bottom_meta: [updated, tags, share] # meta library meta_library: # 默认文章作者（可在 front-matter 中覆盖） author: avatar: name: 请设置文章作者 url: / # 文章创建日期 date: icon: fas fa-calendar-alt title: '发布于：' format: 'll' # 日期格式 http://momentjs.com/docs/ # 文章更新日期 updated: icon: fas fa-edit title: '更新于：' format: 'll' # 日期格式 http://momentjs.com/docs/ # 文章分类 category: icon: fas fa-folder-open # 文章浏览计数 counter: icon: fas fa-eye unit: '次浏览' # 文章评论数量：只支持 valine valinecount: icon: fas fa-comment-dots desc: '' # 条评论 # 文章字数和阅读时长 wordcount: icon_wordcount: fas fa-keyboard icon_duration: fas fa-hourglass-half # 文章标签 tags: icon: fas fa-hashtag # 分享 share: - id: qq img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/qq.png - id: qzone img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/qzone.png - id: weibo img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/weibo.png - id: # qrcode # 当id为qrcode时需要安装插件 npm i hexo-helper-qrcode img: # https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/wechat.png - id: # telegram img: # https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/telegram.png 其中 top_meta 和 bottom_meta 部分的取值自 meta_library 库。 侧边栏配置侧边栏小组件与 meta 库不同的是：除了现有的 widget ，您可以很轻易地创建自己的 widget ，然后放在需要的地方。此外，您还可以将 widget 写在单独的文件中。 查看所有相关配置 blog/_config.volantis.ymlsidebar: # 主页、分类、归档等独立页面 for_page: [blogger, category, tagcloud, qrcode] # layout: docs/post 这类文章页面 for_post: [toc] # 侧边栏组件库 widget_library: # --------------------------------------- # blogger info widget blogger: class: blogger display: [desktop, mobile] # [desktop, mobile] avatar: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/Logo-NavBar@3x.png shape: rectangle # circle, rectangle url: /about/ title: subtitle: jinrishici: true # Poetry Today. You can set a string, and it will be displayed when loading fails. social: true # --------------------------------------- # toc widget (valid only in articles) toc: class: toc display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-list title: 本文目录 list_number: false min_depth: 2 max_depth: 5 # --------------------------------------- # category widget category: class: category display: [desktop] # [desktop, mobile] header: icon: fas fa-folder-open title: 文章分类 url: /blog/categories/ # --------------------------------------- # tagcloud widget tagcloud: class: tagcloud display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-tags title: 热门标签 url: /blog/tags/ min_font: 14 max_font: 24 color: true start_color: '#999' end_color: '#555' # --------------------------------------- # qrcode widget donate: class: qrcode display: [desktop, mobile] # [desktop, mobile] height: 64px # Automatic height if not set images: - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png # --------------------------------------- # webinfo widget webinfo: class: webinfo display: [desktop] header: icon: fas fa-award title: 站点信息 type: article: enable: true text: '文章数目：' unit: '篇' runtime: enable: true data: '2020/01/01' # 填写建站日期 text: '已运行时间：' unit: '天' wordcount: enable: true text: '本站总字数：' # 需要启用 wordcount unit: '字' siteuv: enable: true text: '本站访客数：' # 需要启用 busuanzi unit: '人' sitepv: enable: true text: '本站总访问量：' # 需要启用 busuanzi unit: '次' lastupd: enable: true friendlyShow: true # 更友好的时间显示 text: '最后活动时间：' unit: '日' 每一个小部件都有 class 和 display，前者代表这个小部件是什么，后者代表这个小部件在什么桌面和移动平台中是否显示，如果在移动平台显示，由于屏幕宽度有限，侧边栏的小部件则会被移动到正文区域下方，因此部分侧边栏小部件便失去意义，建议设置为仅桌面端显示。 小部件名: class: 小部件类别 display: [小部件在桌面端是否显示, 小部件在移动设备是否显示] 博主信息部件blog/_config.volantis.ymlblogger: class: blogger display: [desktop] # [desktop, mobile] avatar: https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png title: subtitle: jinrishici: true # Poetry Today. You can set a string, and it will be displayed when loading fails. social: true 其中，今日诗词 jinrishici 如果设置为一个字符串，这个字符串会变成占位文字，加载失败时显示。如果不需要，就请设置为 jinrishici: false。social 的具体内容请在网站页脚部分设置。 文章目录部件blog/_config.volantis.ymltoc: class: toc display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-list title: 本文目录 list_number: false min_depth: 2 max_depth: 5 这个部件只能放置在侧边栏，并且在文章中有效。在移动设备中预览时，手指向上滑动时，导航栏右边会出现 TOC 按钮，点击即可展开 TOC 部件。如果您需要显示章节序号，请设置 list_number。 min_depth 和 max_depth 代表 TOC 支持的标题层级，最大范围是2～6。 文章分类部件blog/_config.volantis.ymlcategory: class: category display: [desktop] # [desktop, mobile] header: icon: fas fa-folder-open title: 文章分类 url: /blog/categories/ 这个部件可以直接显示所有文章分类，如果您希望有一个独立的页面来展示，需要自己创建一个文件，具体操作在「页面」部分文档中。 标签云部件blog/_config.volantis.ymltagcloud: class: tagcloud display: [desktop] # [desktop, mobile] header: icon: fas fa-tags title: 热门标签 url: /blog/tags/ min_font: 14 max_font: 24 color: true start_color: '#999' end_color: '#555' 这个部件可以直接显示所有文章的标签，如果您希望有一个独立的页面来展示，需要自己创建一个文件，具体操作在「页面」部分文档中。 二维码部件blog/_config.volantis.ymldonate: class: qrcode display: [desktop, mobile] # [desktop, mobile] height: 64px # Automatic height if not set images: - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png 您可以放置在文章页脚用于展示打赏图片，也可以放置在侧边栏。 通用文本部件blog/_config.volantis.ymlrepos: class: text display: [desktop] # [desktop, mobile] header: icon: fab fa-github title: 点个赞吧 url: https://github.com/xaoxuu/ content: - '您的赞对我来说很重要，如果您喜欢本主题，希望能够给下面的项目点个赞来支持一下。' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/prohud/logo.png" height="50px">](https://github.com/xaoxuu/ProHUD)' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/valuex/logo.png" height="50px">](https://github.com/xaoxuu/ValueX)' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/inspire/logo.png" height="50px">](https://github.com/xaoxuu/Inspire)' 您可以创建用于展示任何文本内容的文本部件。 通用列表部件blog/_config.volantis.ymlwiki-hexo-theme: class: list display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-chevron-left title: Hexo Themes url: /wiki/ rows: - name: Volantis for Hexo url: /wiki/volantis/ - name: Resume for Hexo url: /wiki/resume/ 您可以创建用于展示任何链接列表的列表部件。列表的 rows 中的每一项支持的属性有： name、url、icon、img、avatar，其中 img 是方形图片的链接，avatar 是圆形图片的链接。 组索引这个部件的布局继承自 list 部件，用于展示文章所属的分组的文章列表。请将您的 Volantis 升级至 2.5 版本以上使用。 blog/_config.volantis.ymlgroup-1: class: group display: [desktop, mobile] # [desktop, mobile] header: icon: fab fa-github title: Git url: /wiki/git/ 在文章的 front-matter 中设置： front-mattergroup: group-1order: 16sidebar: [group-1, toc] 「group-1」卡片将会以列表的形式显示所有设置了 group: group-1 的文章，顺序按照 order 从小到大排列。 通用网格部件blog/_config.volantis.ymlfeedback: class: grid display: [desktop, mobile] header: icon: fas fa-headset title: 联系开发者 url: https://github.com/volantis-x/hexo-theme-volantis fixed: true # 固定宽度 rows: - name: 反馈BUG icon: fas fa-bug url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: 疑问求助 icon: fas fa-question-circle url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: 提个建议 icon: fas fa-lightbulb url: https://github.com/volantis-x/hexo-theme-volantis/issues/ 您可以创建用于展示任何链接列表的网格部件。网格默认根据文字长度自动确定每一个格子的宽度，如果文字长短不一，建议通过设置 fixed: true 来固定宽度，此时文字过长的格子中的文字会换行显示。 通用页面部件blog/_config.volantis.ymltest: class: page display: [desktop, mobile] pid: haha content: excerpt # excerpt, more, content 您可以把整个页面的md内容作为一个小部件渲染显示出来。只需要设置小部件里的 pid 属性和文章的 front-matter 中设置一样的 pid 即可。 content 代表这个部件显示的内容，可选 excerpt，more，content 分别对应文章的摘要、摘要后面的内容、全文。 选择评论系统目前支持的评论系统有： valine, twikoo, waline, minivaline, disqus, disqusjs, gitalk, vssue, livere, isso, hashover blog/_config.volantis.ymlcomments: title: <i class='fas fa-comments'></i> 评论 subtitle: service: valine # valine, twikoo, waline, minivaline, disqus, disqusjs, gitalk, vssue, livere, isso, hashover ValinetwikoowalineMiniValineVssueGitalkDisqusDisqusJSLivereIssoHashover... 一款快速、简洁且高效的无后端评论系统 https://valine.js.org blog/_config.volantis.ymlcomments: ... service: valine ... valine: # js: https://cdn.jsdelivr.net/npm/valine@1.4/dist/Valine.min.js path: # 全局评论地址 目前设置全局评论地址后visitor失效,这是valine的问题 placeholder: 快来评论吧~ # 评论占位提示 # 其他配置项按照yml格式继续填写即可 除了 [el path placeholder emojiCDN emojiMaps] 选项 appId: # your appId appKey: # your appKey ... 可选配置项详见源码 其中，placeholder 支持在 front-matter 中设置。 front-matter---valine: placeholder: 你觉得xxx怎么样呢？--- 也可以通过设置 valine.path 实现多个页面共用一个评论框。 front-matter---valine: path: /--- 一个简洁、安全、免费的静态网站评论系统 | A simple, safe, free comment system. https://twikoo.js.org/ blog/_config.volantis.ymlcomments: ... service: twikoo ... twikoo: js: https://cdn.jsdelivr.net/npm/twikoo@latest # 建议锁定版本 path: # 全局评论地址 # 其他配置项按照yml格式继续填写即可 除了 [el path] 选项 envId: xxxxxxxxxxxxxxx # 腾讯云环境id 一个简洁、安全、免费的静态网站评论系统 | A simple, safe, free comment system. https://waline.js.org/ blog/_config.volantis.ymlcomments: ... service: waline ... # Waline # https://waline.js.org/ waline: js: https://cdn.jsdelivr.net/npm/@waline/client/dist/Waline.min.js path: # 全局评论地址 目前设置全局评论地址后visitor失效,这是waline的问题 placeholder: 快来评论吧~ # 评论占位提示 imageHosting: https://7bu.top/api/upload # 图床api（默认使用去不图床） # 其他配置项按照yml格式继续填写即可 除了 [el path placeholder uploadImage] 选项 serverURL: xxxxxxxxxxxxxxx # Waline 的服务端地址（必填） 测试用地址: https://waline-ruddy.vercel.app ... 可选配置项详见源码 一款快速、简洁且高效的无后端评论系统 https://github.com/MiniValine/MiniValine/ blog/_config.volantis.ymlcomments: ... service: minivaline ... # MiniValine # https://github.com/MiniValine/MiniValine minivaline: js: https://cdn.jsdelivr.net/npm/minivaline@latest path: # 全局评论地址 placeholder: 快来评论吧~ # 全局评论占位提示 # 更多选项 https://minivaline.js.org/docs/cn/#/Options 按照yml格式继续填写即可 （除了 [el path placeholder] 选项） # emoticonUrl 等列表选项 可参考 https://github.com/MiniValine/hexo-next-minivaline # 下面是一个例子： backend: waline serverURL: https://waline.vercel.app Vue 驱动的、基于 Issue 的评论插件 https://vssue.js.org/zh/ blog/_config.volantis.ymlcomments: ... service: vssue ... vssue: owner: repo: clientId: clientSecret: A modern comment component based on Github Issue and Preact. https://gitalk.github.io/ blog/_config.volantis.ymlcomments: ... service: gitalk ... gitalk: clientID: clientSecret: repo: owner: admin: # [] clientID 和 clientSecret 的获取方法可自行搜索教程，这里仅简单描述一下步骤： 点击 GitHub -> Settings https://github.com/settings/profile 点击 Developer settings https://github.com/settings/developers 点击 New OAuth App https://github.com/settings/applications/new 填写信息： Application name 随便填，我的是：xaoxuu.comHomepage URL 和 Authorization callback URL 都写你的网址，我的是：https://xaoxuu.com 可以通过设置 gitalk.id 实现多个页面共用一个评论框。 front-matter---gitalk: id: /wiki/volantis/--- Disqus - The #1 way to build an audience on your website. https://disqus.com/ blog/_config.volantis.ymlcomments: ... service: disqus ... disqus: shortname: Render Disqus comments in Mainland China using Disqus API https://github.com/SukkaW/DisqusJS blog/_config.volantis.ymlcomments: ... service: disqusjs ... # DisqusJS # https://github.com/SukkaW/DisqusJS disqusjs: path: # 全局评论地址 # 配置项按照yml格式继续填写即可 除了 [siteName url identifier] 选项 #shortname: #api: #apikey: #admin: #nesting: Communication makes better world. https://www.livere.com/ blog/_config.volantis.ymlcomments: ... service: livere ... livere: uid: #你的livere的uid 在这里查看你的 uid：https://livere.com/insight/myCode，在【代码管理 -> 一般网站】中找到如下这段代码，其中 data-uid 中的内容就是你的 livere_uid。 <!-- 来必力City版安装代码 --><div id="lv-container" data-id="city" data-uid="你的livere的uid">... A commenting server similar to Disqus. https://posativ.org/isso/ blog/_config.volantis.ymlcomments: ... service: isso ... isso: url: https://example.com/(path/) src: https://example.com/(path/)js/embed.min.js A free and open source PHP comment system designed to allow completely anonymous comments and easy theming. https://www.barkdull.org/software/hashover blog/_config.volantis.ymlcomments: ... service: hashover ... hashover: src: https://example.com/(path/)comments.phpblog/themes/volantis/layout/_third-party/comments/评论系统名称/layout.ejs这里写布局代码 blog/themes/volantis/layout/_third-party/comments/评论系统名称/script.ejs这里要写加载 js 的代码 收录更多评论系统 站内搜索blog/_config.volantis.ymlsearch: enable: true service: hexo # hexo, google, algolia, azure, baidu js: https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@2.6.4/js/search.js google: apiKey: engineId: algolia: applicationID: apiKey: indexName: azure: serviceName: indexName: queryKey: baidu: apiId: 默认配置为 Hexo 搜索，但是需要安装插件才能使用： npm i -S hexo-generator-search hexo-generator-json-content 第三方插件插件库Volantis 为丰富的插件提供了兼容性优化。大部分插件您只需开启和关闭，无需进行设置。 blog/_config.volantis.ymlplugins: ################# required plugins ################ # jquery jquery: https://cdn.jsdelivr.net/npm/jquery@3.5/dist/jquery.min.js # fontawesome fontawesome: https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.14/css/all.min.css ################# optional plugins ################ ######### Plugins to improve loading speed: # 预加载 preload: enable: true service: flying_pages # instant_page, flying_pages instant_page: https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@2/js/instant_page.js flying_pages: https://cdn.jsdelivr.net/gh/gijo-varghese/flying-pages@2.1.2/flying-pages.min.js # 图片懒加载 # https://www.npmjs.com/package/vanilla-lazyload lazyload: enable: true js: https://cdn.jsdelivr.net/npm/vanilla-lazyload@17.1.0/dist/lazyload.min.js onlypost: false loadingImg: # https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@3/img/placeholder/c617bfd2497fcea598e621413e315c368f8d8e.svg blurIn: true # 模糊加载效果 （loadingImg为空时有效） ######### Plugins to optimize the experience: # highlight.js highlightjs: enable: #true # Please set hexo.config.highlight.enable = false !!! js: https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10/build/highlight.min.js css: https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10/build/styles/solarized-light.min.css # more: https://www.jsdelivr.com/package/npm/highlight.js?path=styles # https://scrollrevealjs.org/api/reveal.html scrollreveal: enable: #true js: https://cdn.jsdelivr.net/npm/scrollreveal@4.0.6/dist/scrollreveal.min.js distance: 32px duration: 800 # ms interval: 20 # ms scale: 1 # 0.1~1 # Codeblock Copy Button clipboard: enable: #true js: https://cdn.jsdelivr.net/npm/clipboard@2/dist/clipboard.min.js ######### Plugins for SEO: # npm i hexo-wordcount wordcount: enable: #true ######### Plugins for ... # Button Ripple Effect nodewaves: enable: #true css: https://cdn.jsdelivr.net/npm/node-waves@0.7.6/dist/waves.min.css js: https://cdn.jsdelivr.net/npm/node-waves@0.7.6/dist/waves.min.js # fontawesome animation fontawesome_animation: enable: #true css: https://cdn.jsdelivr.net/gh/l-lin/font-awesome-animation/dist/font-awesome-animation.min.css # Typing Effects comment_typing: enable: #true js: https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@2/js/comment_typing.js # Slide Background backstretch: enable: #true js: https://cdn.jsdelivr.net/npm/jquery-backstretch@2.1.18/jquery.backstretch.min.js position: cover # cover: sticky on the cover. fixed: Fixed as background for the site. shuffle: true # shuffle playlist duration: 10000 # Duration (ms) fade: 1500 # fade duration (ms) (Not more than 1500) images: # For personal use only. At your own risk if used for commercial purposes !!! - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/001.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/002.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/003.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/004.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/005.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/006.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/012.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/016.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/019.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/033.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/034.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/035.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/038.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/039.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/042.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/046.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/051.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/052.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/054.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/056.jpg # APlayer is only available in mainland China. # APlayer config: https://github.com/metowolf/MetingJS aplayer: enable: #true js: aplayer: https://cdn.jsdelivr.net/npm/aplayer@1.10/dist/APlayer.min.js meting: https://cdn.jsdelivr.net/npm/meting@2.0/dist/Meting.min.js # Required server: netease # netease, tencent, kugou, xiami, baidu type: playlist # song, playlist, album, search, artist id: 3175833810 # song id / playlist id / album id / search keyword # Optional fixed: false # enable fixed mode theme: '#1BCDFC' # main color autoplay: false # audio autoplay order: list # player play order, values: 'list', 'random' loop: all # player loop play, values: 'all', 'one', 'none' volume: 0.7 # default volume, notice that player will remember user setting, default volume will not work after user set volume themselves list_max_height: 320px # list max height list_folded: true pjax: enable: true cover: true # 封面是否pjax处理 false：每次切换页面封面都重载，适合封面较少的情况 true：封面经过Pjax处理，适合封面较多的情况 timeout: 5000 # The timeout in milliseconds for the XHR requests. Set to 0 to disable the timeout. cacheBust: false # When set to true, Pjax appends a timestamp to skip the browser cache. animation: false # false, nprogress, circle banUrl: # 被屏蔽的 url 地址将不启用 pjax 跳转，可以在控制台下使用 window.location.pathname 获取 # - '/artitalk/' # artitalk 不支持 pjax # - '/bb/' # bbtalk 不支持 pjax # 从 issues 加载动态数据 # {% issues sites/timeline/friends | api=xxx | group=key:a,b,c %} # 例如： # {% issues sites | api=https://api.github.com/repos/volantis-x/examples/issues?sort=updated&state=open&page=1&per_page=100 | group=version:latest,v6,v5,v4,v3,v2,v1,v0 %} # 暗黑模式 darkmode # 样式：source/css/_plugins/dark.styl # 开关按钮：在 navbar.menu 中添加： # - name: 暗黑模式 # 可自定义 # icon: fas fa-moon # 可自定义 # toggle: darkmode darkmodejs: enable: #true # 旧版 Internet Explorer 淘汰行动 # https://www.microsoft.com/zh-cn/WindowsForBusiness/End-of-IE-support # 本主题不支持Internet Explorer的任何版本!!! killOldVersionsOfIE: enable: true # 禁用JavaScript提示 # 本页面需要浏览器支持（启用）JavaScript # 主题中的某些插件必须启用JavaScript才能正常工作，例如开启scrollreveal如果禁用JavaScript会导致卡片消失 killNoScript: enable: true # Artitalk https://artitalk.js.org # 配置过程请参考：https://artitalk.js.org/doc.html # 使用过旧版本的请修改Leancloud shuoshuo class部分列名：https://artitalk.js.org/release.html # 除appID和appKEY外均为选填项 artitalk: # Set `layout: artitalk` to enable in page # 配置项按照yml格式继续填写即可 appId: ogP8qj3veMh0LFpFWMPOyF0X-MdYXbMMI # your appID appKey: nHXLd3N3Jgh460t2iRQKWAtr # your appKEY # serverURL: #leancloud绑定的安全域名，使用国际版的话不需要填写 # lang: # 语言设置，zh为汉语，en为英语，es为西班牙语。默认为汉语 # pageSize: #每页说说的显示数量 # shuoPla: #在编辑说说的输入框中的占位符 # avatarPla: #自定义头像url的输入框的占位符 # motion: #加载动画的开关，1为开，0为关，默认为开 # bgImg: #说说输入框背景图片url # color1: #说说背景颜色1&按钮颜色1 # color2: #说说背景颜色2&按钮颜色2 # color3: #说说字体颜色 # cssUrl: #自定义css接口 # BBtalk https://bb.js.org bbtalk: js: https://cdn.jsdelivr.net/npm/bbtalk@0.1.5/dist/bbtalk.min.js # BBtalk.js appId: 0KzOX4vC7Jsk6vzUGNeEiUaI-gzGzoHsz # your appID appKey: HwCiWuxfpvKiLm4teCUgTIba # your appKEY serverURLs: https://bbapi.heson10.com # Request Api 域名 # Tidio聊天功能 # https://www.tidio.com/ tidio: enable: #true id: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx 幻灯片背景blog/_config.volantis.ymlplugins: ... backstretch: enable: true js: https://cdn.jsdelivr.net/npm/jquery-backstretch@2.1.18/jquery.backstretch.min.js position: cover # cover: sticky on the cover. fixed: Fixed as background for the site. duration: 20000 # Duration (ms) fade: 1500 # fade duration (ms) (Not more than 1500) images: # For personal use only. At your own risk if used for commercial purposes !!! - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg ... 幻灯片背景图片显示的位置可以选择粘贴在封面上，跟随封面一起滑动，也可以选择固定作为网页背景图片。 highlight.jsblog/_config.volantis.ymlplugins: ... # highlight.js highlightjs: enable: true # Please set hexo.config.highlight.enable = false !!! js: https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10/build/highlight.min.js css: https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10/build/styles/solarized-light.min.css # more: https://www.jsdelivr.com/package/npm/highlight.js?path=styles 如果需要使用 highlight.js 进行语法高亮，请将站点配置文件中的 highlight.enable 设置为 false 否则不会加载插件。您可以在 94 种 语法高亮主题 中挑选喜爱的主题，然后替换上面的 css 链接。 如果您使用 highlight.js 请确保没有使用 hexo 官方的 codeblock 标签，否则会报错。 经测试，使用 highlight.js 的情况下，部分容器内的代码可能仍然会被渲染甚至报错。 APlayer 音乐播放器blog/_config.volantis.ymlplugins: ... # APlayer is only available in mainland China. # APlayer config: https://github.com/metowolf/MetingJS aplayer: enable: true js: aplayer: https://cdn.jsdelivr.net/npm/aplayer@1.10/dist/APlayer.min.js meting: https://cdn.jsdelivr.net/npm/meting@2.0/dist/Meting.min.js # Required server: netease # netease, tencent, kugou, xiami, baidu type: playlist # song, playlist, album, search, artist id: 3175833810 # song id / playlist id / album id / search keyword # Optional fixed: false # enable fixed mode theme: '#1BCDFC' # main color autoplay: false # audio autoplay order: list # player play order, values: 'list', 'random' loop: all # player loop play, values: 'all', 'one', 'none' volume: 0.7 # default volume, notice that player will remember user setting, default volume will not work after user set volume themselves list_max_height: 320px # list max height list_folded: true APlayer播放器只可以在中国大陆地区使用。相关文档： APlayer | MetingJS 暗黑模式blog/_config.volantis.ymlplugins: ... # 样式：source/css/_plugins/dark.styl # 开关按钮：在 navbar.menu 中添加： # - name: 暗黑模式 # 可自定义 # icon: fas fa-moon # 可自定义 # toggle: darkmode darkmodejs: enable: true 结束支持blog/_config.volantis.ymlplugins: ... # 旧版 Internet Explorer 淘汰行动 # https://www.microsoft.com/zh-cn/WindowsForBusiness/End-of-IE-support # 本主题不支持Internet Explorer的任何版本!!! killOldVersionsOfIE: enable: true # 禁用JavaScript提示 # 本页面需要浏览器支持（启用）JavaScript # 主题中的某些插件必须启用JavaScript才能正常工作，例如开启scrollreveal如果禁用JavaScript会导致卡片消失 killNoScript: enable: true Artitalkblog/_config.volantis.ymlplugins: ... # Artitalk https://artitalk.js.org # 配置过程请参考：https://artitalk.js.org/doc.html # 使用过旧版本的请修改Leancloud shuoshuo class部分列名：https://artitalk.js.org/release.html # 除appID和appKEY外均为选填项 artitalk: # Set `layout: artitalk` to enable in page # 配置项按照yml格式继续填写即可 appId: ogP8qj3veMh0LFpFWMPOyF0X-MdYXbMMI # your appID appKey: nHXLd3N3Jgh460t2iRQKWAtr # your appKEY # serverURL: #leancloud绑定的安全域名，使用国际版的话不需要填写 # lang: # 语言设置，zh为汉语，en为英语，es为西班牙语。默认为汉语 # pageSize: #每页说说的显示数量 # shuoPla: #在编辑说说的输入框中的占位符 # avatarPla: #自定义头像url的输入框的占位符 # motion: #加载动画的开关，1为开，0为关，默认为开 # bgImg: #说说输入框背景图片url # color1: #说说背景颜色1&按钮颜色1 # color2: #说说背景颜色2&按钮颜色2 # color3: #说说字体颜色 # cssUrl: #自定义css接口 BBtalkblog/_config.volantis.ymlplugins: ... bbtalk: js: https://cdn.jsdelivr.net/npm/bbtalk@0.1.5/dist/bbtalk.min.js # BBtalk.js appId: 0KzOX4vC7Jsk6vzUGNeEiUaI-gzGzoHsz # your appID appKey: HwCiWuxfpvKiLm4teCUgTIba # your appKEY serverURLs: https://bbapi.heson10.com # Request Api 域名 Tidioblog/_config.volantis.ymlplugins: ... # Tidio聊天功能 # https://www.tidio.com/ tidio: enable: true id: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"},{"title":"主题配置","date":"2021-05-17T08:08:37.083Z","updated":"2021-05-17T08:08:37.083Z","comments":true,"path":"v5/theme-settings/index.html","permalink":"https://volantis.js.org/v5/theme-settings/","excerpt":"","text":"创建主题配置文件主题目录下的 _config.yml 文件通常负责主题相关配置，我们强烈建议您使用代替的主题配置文件以防止自己的配置丢失。那么如何使用代替主题配置文件呢？ 第 1/2 步：创建配置文件 在博客根目录的 _config.yml 文件旁边新建一个文件： _config.volantis.yml ，这个文件中的配置信息优先级高于主题文件夹中的配置文件。 第 2/2 步：覆盖自定义配置 当您需要修改某项内容时，例如导航栏菜单，那么您需要在主题配置文件中找到相关内容，复制进自己创建的配置文件中：blog/_config.volantis.ymlnavbar: visiable: auto # always, auto logo: # choose [img] or [icon + title] img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/Logo-NavBar@3x.png icon: title: menu: - name: 博客 icon: fas fa-rss url: /小提示使用「npm i hexo-theme-volantis」方式安装的主题，主题配置文件在「blog/node_modules/hexo-theme-volantis/_config.yml」使用传统方式安装的主题，主题配置文件在「blog/themes/volantis/_config.yml」 自定义主题外观最大布局宽度blog/_config.volantis.ymlcustom_css: ... max_width: 1080px # Sum of body width and sidebar width 网页所呈现的内容的最大宽度，即 body 和 sidebar 的宽度之和。 抗锯齿blog/_config.volantis.ymlcustom_css: ... font_smoothing: true # font-smoothing for webkit 自定义光标样式blog/_config.volantis.ymlcustom_css: ... cursor: enable: true text: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/text.png pointer: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/pointer.png default: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/left_ptr.png not-allowed: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/circle.png zoom-out: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/zoom-out.png zoom-in: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/zoom-in.png grab: https://cdn.jsdelivr.net/gh/inkss/common@master/cursor/openhand.png 导航栏样式您可以设置导航栏的高度以及视觉特效，视觉特效目前可选的有： shadow：卡片阴影。 floatable：当鼠标移动到容器内时，呈现出浮起来的效果。 blur：背景模糊效果（毛玻璃），当浏览器不支持时显示为不透明。 blog/_config.volantis.ymlcustom_css: ... navbar: height: 64px effect: [shadow, blur] # [shadow, floatable, blur] 滚动条样式blog/_config.volantis.ymlcustom_css: ... scrollbar: size: 4px border: 2px color: '#2196f3' hover: '#ff5722' 侧边栏样式视觉特效参数同上，值得注意的是：卡片的 floatable 效果和 blur 效果相冲突。 blog/_config.volantis.ymlcustom_css: ... sidebar: effect: [shadow] # [shadow, floatable, blur] 正文区域样式视觉特效参数同上，值得注意的是：卡片的 floatable 效果和 blur 效果相冲突。您可以在 language: true 这里设置代码块显示语言名称。text_align 可以设置 h1/h2/h3/h4/p 的文字对齐方向。 blog/_config.volantis.ymlcustom_css: ... body: effect: [shadow] # [shadow, floatable, blur] highlight: language: true # show language of codeblock copy_btn: true text_align: # left, right, justify, center h1: left h2: left h3: left h4: left p: justify note: # style for default note: {% note text %} icon: '\\f054' color: '' 布局间距您可以设置几种标题的布局间距 h2/h3/h4、段落间距 line、区块内部的段落间距 inline。 blog/_config.volantis.ymlcustom_css: ... gap: h2: 48px # Spacing above H2 (only px unit) h3: 32px # Spacing above H3 (only px unit) h4: 16px # Spacing above H4 (only px unit) paragraph: 1rem # Paragraph spacing between paragraphs row: .5rem # Paragraph spacing between other elements 自定义字体您可以自定义正文和代码字体。 blog/_config.volantis.ymlcustom_css: ... fontfamily: logofont: fontfamily: '"Varela Round", "PingFang SC", "Microsoft YaHei", Helvetica, Arial' name: 'Varela Round' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/VarelaRound/VarelaRound-Regular.ttf weight: normal style: normal bodyfont: fontfamily: 'UbuntuMono, "PingFang SC", "Microsoft YaHei", Helvetica, Arial' name: 'UbuntuMono' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/UbuntuMono/UbuntuMono-Regular.ttf weight: normal style: normal codefont: fontfamily: 'Menlo, Monaco' name: 'Monaco' url: https://cdn.jsdelivr.net/gh/volantis-x/cdn-fonts/Monaco/Monaco.ttf weight: normal style: normal 自定义颜色多彩配色方案 blog/_config.volantis.ymlcolor_scheme: # ------------ # 通用颜色 common: # 主题色 theme: '#44D7B6' # 链接色 link: '#2196f3' # 按钮色 button: '#44D7B6' # 鼠标放到交互元素上时的色 hover: '#ff5722' # 主题色块内部的文字颜色 inner: '#fff' # 选中区域文字的背景颜色 selection: 'alpha(#2196f3, 0.2)' # ------------ # 亮色主题（默认） light: # 网站背景色 site_bg: '#f4f4f4' # 网站背景上的文字 site_inner: '#fff' # 网站页脚文字 site_footer: '#666' # 卡片背景色 card: '#fff' # 卡片上的普通文字 text: '#444' # 区块和代码块背景色 block: '#f6f6f6' # 代码块高亮时的背景色 codeblock: '#FFF7EA' # 行内代码颜色 inlinecode: '#D56D28' # 文章部分 h1: '#444' h2: '#444' h3: '#444' h4: '#444' h5: '#444' h6: '#444' p: '#444' # 列表文字 list: '#666' # 列表 hover 时的文字 list_hl: 'mix($color-theme, #000, 80)' # 辅助性文字 meta: '#888' # ------------ # 暗色主题 dark: # 网站背景色 site_bg: '#222' # 网站背景上的文字 site_inner: '#eee' # 网站页脚文字 site_footer: '#aaa' # 卡片背景色 card: '#444' # 卡片上的普通文字 text: '#eee' # 区块和代码块背景色 block: '#3a3a3a' # 代码块高亮时的背景色 codeblock: '#343a3c' # 行内代码颜色 inlinecode: '#D56D28' # 文章部分 h1: '#eee' h2: '#eee' h3: '#ddd' h4: '#ddd' h5: '#ddd' h6: '#ddd' p: '#bbb' # 列表文字 list: '#aaa' # 列表 hover 时的文字 list_hl: 'mix($color-theme, #fff, 80)' # 辅助性文字 meta: '#888' # 夜间图片亮度 brightness: 70% 自定义右键菜单blog/_config.volantis.yml# 自定义右键菜单rightmenu: enable: true # hr: 分割线, music: 音乐控制器 layout: [home, help, examples, contributors, hr, source_docs, source_theme, hr, print, hr, dark_mode, hr, music] # 可选功能项 print: name: 打印页面 icon: fa fa-print onclick: document.execCommand('print') # 自定义菜单的格式如下 help: name: 常见问题 icon: fa fa-question url: https://volantis.js.org/faqs/ examples: name: 示例博客 icon: fa fa-rss url: https://volantis.js.org/examples/ contributors: name: 加入社区 icon: fa fa-fan fa-spin url: https://volantis.js.org/contributors/ source_docs: name: 本站源码 icon: fa fa-code-branch url: https://github.com/volantis-x/volantis-docs/ source_theme: name: 主题源码 icon: fa fa-code-branch url: https://github.com/volantis-x/hexo-theme-volantis/ dark_mode: name: Dark mode icon: fas fa-moon toggle: darkmode 设置网站导航栏导航栏配置导航栏分为 logo、menu、search 三个区域设置，其中 logo 区域如果设置了图片，则不能显示图标和标题， menu 区域的设置可以写在一个单独的文件中。 blog/_config.volantis.yml# 注意事项：建议规范全站路径 URL 最后带一个 "/" 例如 "about/"navbar: logo: # choose [img] or [icon + title] img: icon: title: menu: # The following can be written in `blog/source/_data/menu.yml` - name: 博客 icon: fas fa-rss url: / - name: 分类 icon: fas fa-folder-open url: categories/ - name: 标签 icon: fas fa-tags url: tags/ - name: 归档 icon: fas fa-archive url: archives/ - name: 友链 icon: fas fa-link url: friends/ - name: 关于 icon: fas fa-info-circle url: about/ search: 搜索 # Search bar placeholder 使用数据文件 建议新建一个文件，专门存放导航栏菜单配置，文件的路径为： blog/source/_data/menu.yml 文件的内容为： blog/source/_data/menu.yml- name: 博客 icon: fas fa-rss url: /... 菜单嵌套导航栏菜单支持嵌套，嵌套的属性名为 rows ，写法示例： blog/source/_data/menu.yml...- name: 更多 icon: fas fa-ellipsis-v rows: - name: 主题源码 url: https://github.com/volantis-x/hexo-theme-volantis/ - name: 更新日志 url: https://github.com/volantis-x/hexo-theme-volantis/releases/ - name: hr - name: 有疑问？ rows: - name: 看 FAQ url: faqs/ - name: 看 本站源码 url: https://github.com/volantis-x/volantis-docs/ - name: 提 Issue url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: hr - name: 公告和测试博文 url: archives/ - name: 示例博客 url: examples/ - name: 特别感谢 url: contributors/ 分割线在子菜单中，新增一个只有 name: hr 的“菜单”就会被渲染成一个分割线。 - name: hr 小标题在子菜单中，新增一个只有 name: 小标题内容（也可以有 icon: 小标题的图标）的“菜单”就会被渲染成一个小标题。 ...- name: 近期 icon: fas fa-clock url: / rows: - name: 热门文章 icon: fas fa-fire - name: ProHUD 开源库的设计思路 url: blog/2019-08-27-prohud/ - name: ValueX：实用的安全对象类型转换库 url: blog/2019-08-29-valuex/ - name: 心率管家 App 的设计与开发 url: blog/2019-07-23-heartmate/ 播放器在子菜单中，新增一个 icon: fas fa-compact-disc 的“菜单”就会被渲染成一个 APlayer 播放器。 - name: 背景音乐 icon: fas fa-compact-disc 设置网站页脚您通过 layout 可以自由布局网站页脚内容 aplayer, social, license, info, copyright。 blog/_config.volantis.ymlsite_footer: # layout of footer: [aplayer, social, license, info, copyright] layout: [aplayer, social, license, info, copyright] social: - icon: fas fa-rss url: atom.xml - icon: fas fa-envelope url: mailto:me@xaoxuu.com - icon: fab fa-github url: https://github.com/xaoxuu - icon: fas fa-headphones-alt url: https://music.163.com/#/user/home?id=63035382 copyright: '[Copyright © 2017-2021 XXX](/)' # You can add your own property here. (Support markdown, for example: br: '<br>') br: '<br>' 其中，aplayer 需要在插件部分设置中启用。您可以新增文字属性，用于展示其它文字信息，例如： blog/_config.volantis.ymlsite_footer: layout: [..., br, hello, ...] ... # You can add your own property here. (Support markdown, for example: br: '<br>') br: '<br>' hello: '[Hello World](/)' 网站与文章封面封面高度blog/_config.volantis.ymlcover: height_scheme: full # full, half ... 目前主题提供两种首页封面高度方案，其它页面均为半屏幕高度。 封面布局方案blog/_config.volantis.ymlcover: ... scheme: dock # search (搜索), dock (坞), featured (精选), focus (焦点) ... 布局方案 适合场景 search 注重搜索 dock 入口选项比较多 featured 选项在4个左右 focus 选项在4个左右 默认显示设置blog/_config.volantis.ymlcover: ... display: home: true archive: false others: false # can be written in front-matter 'cover: true' 由于主页、归档是 hexo 自动生成的，您需要在主题配置文件中设置是否显示封面，而其它页面则可以在 front-matter 中通过设置 cover: true/false 来决定显示封面或者不显示封面。 文章布局配置# 文章布局article: # 文章列表页面的文章卡片布局方案 preview: scheme: landscape # landscape # pin icon for post pin_icon: https://cdn.jsdelivr.net/gh/twitter/twemoji@13.0/assets/svg/1f4cc.svg # auto generate title if not exist auto_title: true # false, true # auto generate excerpt if not exist auto_excerpt: true # false, true # show split line or not line_style: solid # hidden, solid, dashed, dotted # show readmore button readmore: auto # auto, always # 文章详情页面的文章卡片本体布局方案 body: # 文章顶部信息 # 从 meta_library 中取 top_meta: [author, category, date, counter] # ---------------- # 文章页脚组件 footer_widget: # ---------------- # 参考资料、相关资料等 (for layout: post/docs) references: title: 参考资料 icon: fas fa-quote-left # 在 front-matter 中: # references: # - title: 某篇文章 # url: https:// # 即可显示此组件。 # ---------------- # 相关文章，需要安装插件 (for layout: post) # npm i hexo-related-popular-posts related_posts: enable: false title: 相关文章 icon: fas fa-bookmark max_count: 5 # 设为空则不使用文章头图 placeholder_img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/046.jpg # ---------------- # 版权声明组件 (for layout: post/docs) copyright: enable: true permalink: '本文永久链接是：' content: - '博客内容遵循 署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 协议' - permalink # ---------------- # 打赏组件 (for layout: post/docs) donate: enable: false images: - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png # 文章底部信息 # 从 meta_library 中取 bottom_meta: [updated, tags, share] # meta library meta_library: # 默认文章作者（可在 front-matter 中覆盖） author: avatar: name: 请设置文章作者 url: / # 文章创建日期 date: icon: fas fa-calendar-alt title: '发布于：' format: 'll' # 日期格式 http://momentjs.com/docs/ # 文章更新日期 updated: icon: fas fa-edit title: '更新于：' format: 'll' # 日期格式 http://momentjs.com/docs/ # 文章分类 category: icon: fas fa-folder-open # 文章浏览计数 counter: icon: fas fa-eye unit: '次浏览' # 文章评论数量：只支持 valine valinecount: icon: fas fa-comment-dots desc: '' # 条评论 # 文章字数和阅读时长 wordcount: icon_wordcount: fas fa-keyboard icon_duration: fas fa-hourglass-half # 文章标签 tags: icon: fas fa-hashtag # 分享 share: - id: qq img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/qq.png - id: qzone img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/qzone.png - id: weibo img: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/weibo.png - id: # qrcode # 当id为qrcode时需要安装插件 npm i hexo-helper-qrcode img: # https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/wechat.png - id: # telegram img: # https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/logo/128/telegram.png 其中 top_meta 和 bottom_meta 部分的取值自 meta_library 库。 侧边栏配置侧边栏小组件与 meta 库不同的是：除了现有的 widget ，您可以很轻易地创建自己的 widget ，然后放在需要的地方。此外，您还可以将 widget 写在单独的文件中。 查看所有相关配置 blog/_config.volantis.ymlsidebar: # 主页、分类、归档等独立页面 for_page: [blogger, category, tagcloud, qrcode] # layout: docs/post 这类文章页面 for_post: [toc] # 侧边栏组件库 widget_library: # --------------------------------------- # blogger info widget blogger: class: blogger display: [desktop, mobile] # [desktop, mobile] avatar: https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/Logo-NavBar@3x.png shape: rectangle # circle, rectangle url: /about/ title: subtitle: jinrishici: true # Poetry Today. You can set a string, and it will be displayed when loading fails. social: true # --------------------------------------- # toc widget (valid only in articles) toc: class: toc display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-list title: 本文目录 list_number: false min_depth: 2 max_depth: 5 # --------------------------------------- # category widget category: class: category display: [desktop] # [desktop, mobile] header: icon: fas fa-folder-open title: 文章分类 url: /blog/categories/ # --------------------------------------- # tagcloud widget tagcloud: class: tagcloud display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-tags title: 热门标签 url: /blog/tags/ min_font: 14 max_font: 24 color: true start_color: '#999' end_color: '#555' # --------------------------------------- # qrcode widget donate: class: qrcode display: [desktop, mobile] # [desktop, mobile] height: 64px # Automatic height if not set images: - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png # --------------------------------------- # webinfo widget webinfo: class: webinfo display: [desktop] header: icon: fas fa-award title: 站点信息 type: article: enable: true text: '文章数目：' unit: '篇' runtime: enable: true data: '2020/01/01' # 填写建站日期 text: '已运行时间：' unit: '天' wordcount: enable: true text: '本站总字数：' # 需要启用 wordcount unit: '字' siteuv: enable: true text: '本站访客数：' # 需要启用 busuanzi unit: '人' sitepv: enable: true text: '本站总访问量：' # 需要启用 busuanzi unit: '次' lastupd: enable: true friendlyShow: true # 更友好的时间显示 text: '最后活动时间：' unit: '日' 每一个小部件都有 class 和 display，前者代表这个小部件是什么，后者代表这个小部件在什么桌面和移动平台中是否显示，如果在移动平台显示，由于屏幕宽度有限，侧边栏的小部件则会被移动到正文区域下方，因此部分侧边栏小部件便失去意义，建议设置为仅桌面端显示。 小部件名: class: 小部件类别 display: [小部件在桌面端是否显示, 小部件在移动设备是否显示] 博主信息部件blog/_config.volantis.ymlblogger: class: blogger display: [desktop] # [desktop, mobile] avatar: https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/avatar/avatar.png title: subtitle: jinrishici: true # Poetry Today. You can set a string, and it will be displayed when loading fails. social: true 其中，今日诗词 jinrishici 如果设置为一个字符串，这个字符串会变成占位文字，加载失败时显示。如果不需要，就请设置为 jinrishici: false。social 的具体内容请在网站页脚部分设置。 文章目录部件blog/_config.volantis.ymltoc: class: toc display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-list title: 本文目录 list_number: false min_depth: 2 max_depth: 5 这个部件只能放置在侧边栏，并且在文章中有效。在移动设备中预览时，手指向上滑动时，导航栏右边会出现 TOC 按钮，点击即可展开 TOC 部件。如果您需要显示章节序号，请设置 list_number。 min_depth 和 max_depth 代表 TOC 支持的标题层级，最大范围是2～6。 文章分类部件blog/_config.volantis.ymlcategory: class: category display: [desktop] # [desktop, mobile] header: icon: fas fa-folder-open title: 文章分类 url: /blog/categories/ 这个部件可以直接显示所有文章分类，如果您希望有一个独立的页面来展示，需要自己创建一个文件，具体操作在「页面」部分文档中。 标签云部件blog/_config.volantis.ymltagcloud: class: tagcloud display: [desktop] # [desktop, mobile] header: icon: fas fa-tags title: 热门标签 url: /blog/tags/ min_font: 14 max_font: 24 color: true start_color: '#999' end_color: '#555' 这个部件可以直接显示所有文章的标签，如果您希望有一个独立的页面来展示，需要自己创建一个文件，具体操作在「页面」部分文档中。 二维码部件blog/_config.volantis.ymldonate: class: qrcode display: [desktop, mobile] # [desktop, mobile] height: 64px # Automatic height if not set images: - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png - https://cdn.jsdelivr.net/gh/volantis-x/cdn-org/blog/qrcode/github@volantis.png 您可以放置在文章页脚用于展示打赏图片，也可以放置在侧边栏。 通用文本部件blog/_config.volantis.ymlrepos: class: text display: [desktop] # [desktop, mobile] header: icon: fab fa-github title: 点个赞吧 url: https://github.com/xaoxuu/ content: - '您的赞对我来说很重要，如果您喜欢本主题，希望能够给下面的项目点个赞来支持一下。' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/prohud/logo.png" height="50px">](https://github.com/xaoxuu/ProHUD)' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/valuex/logo.png" height="50px">](https://github.com/xaoxuu/ValueX)' - '[<img src="https://cdn.jsdelivr.net/gh/xaoxuu/cdn-assets/proj/inspire/logo.png" height="50px">](https://github.com/xaoxuu/Inspire)' 您可以创建用于展示任何文本内容的文本部件。 通用列表部件blog/_config.volantis.ymlwiki-hexo-theme: class: list display: [desktop, mobile] # [desktop, mobile] header: icon: fas fa-chevron-left title: Hexo Themes url: /wiki/ rows: - name: Volantis for Hexo url: /wiki/volantis/ - name: Resume for Hexo url: /wiki/resume/ 您可以创建用于展示任何链接列表的列表部件。列表的 rows 中的每一项支持的属性有： name、url、icon、img、avatar，其中 img 是方形图片的链接，avatar 是圆形图片的链接。 组索引这个部件的布局继承自 list 部件，用于展示文章所属的分组的文章列表。请将您的 Volantis 升级至 2.5 版本以上使用。 blog/_config.volantis.ymlgroup-1: class: group display: [desktop, mobile] # [desktop, mobile] header: icon: fab fa-github title: Git url: /wiki/git/ 在文章的 front-matter 中设置： front-mattergroup: group-1order: 16sidebar: [group-1, toc] 「group-1」卡片将会以列表的形式显示所有设置了 group: group-1 的文章，顺序按照 order 从小到大排列。 通用网格部件blog/_config.volantis.ymlfeedback: class: grid display: [desktop, mobile] header: icon: fas fa-headset title: 联系开发者 url: https://github.com/volantis-x/hexo-theme-volantis fixed: true # 固定宽度 rows: - name: 反馈BUG icon: fas fa-bug url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: 疑问求助 icon: fas fa-question-circle url: https://github.com/volantis-x/hexo-theme-volantis/issues/ - name: 提个建议 icon: fas fa-lightbulb url: https://github.com/volantis-x/hexo-theme-volantis/issues/ 您可以创建用于展示任何链接列表的网格部件。网格默认根据文字长度自动确定每一个格子的宽度，如果文字长短不一，建议通过设置 fixed: true 来固定宽度，此时文字过长的格子中的文字会换行显示。 通用页面部件blog/_config.volantis.ymltest: class: page display: [desktop, mobile] pid: haha content: excerpt # excerpt, more, content 您可以把整个页面的md内容作为一个小部件渲染显示出来。只需要设置小部件里的 pid 属性和文章的 front-matter 中设置一样的 pid 即可。 content 代表这个部件显示的内容，可选 excerpt，more，content 分别对应文章的摘要、摘要后面的内容、全文。 选择评论系统目前支持的评论系统有： valine, twikoo, waline, minivaline, disqus, disqusjs, gitalk, vssue, livere, isso, hashover blog/_config.volantis.ymlcomments: title: <i class='fas fa-comments'></i> 评论 subtitle: service: valine # valine, twikoo, waline, minivaline, disqus, disqusjs, gitalk, vssue, livere, isso, hashover ValinetwikoowalineMiniValineVssueGitalkDisqusDisqusJSLivereIssoHashover... 一款快速、简洁且高效的无后端评论系统 https://valine.js.org blog/_config.volantis.ymlcomments: ... service: valine ... valine: # js: https://cdn.jsdelivr.net/npm/valine@1.4/dist/Valine.min.js path: # 全局评论地址 目前设置全局评论地址后visitor失效,这是valine的问题 placeholder: 快来评论吧~ # 评论占位提示 # 其他配置项按照yml格式继续填写即可 除了 [el path placeholder emojiCDN emojiMaps] 选项 appId: # your appId appKey: # your appKey ... 可选配置项详见源码 其中，placeholder 支持在 front-matter 中设置。 front-matter---valine: placeholder: 你觉得xxx怎么样呢？--- 也可以通过设置 valine.path 实现多个页面共用一个评论框。 front-matter---valine: path: /--- 一个简洁、安全、免费的静态网站评论系统 | A simple, safe, free comment system. https://twikoo.js.org/ blog/_config.volantis.ymlcomments: ... service: twikoo ... twikoo: js: https://cdn.jsdelivr.net/npm/twikoo@latest # 建议锁定版本 path: # 全局评论地址 # 其他配置项按照yml格式继续填写即可 除了 [el path] 选项 envId: xxxxxxxxxxxxxxx # 腾讯云环境id 一个简洁、安全、免费的静态网站评论系统 | A simple, safe, free comment system. https://waline.js.org/ blog/_config.volantis.ymlcomments: ... service: waline ... # Waline # https://waline.js.org/ waline: js: https://cdn.jsdelivr.net/npm/@waline/client/dist/Waline.min.js path: # 全局评论地址 目前设置全局评论地址后visitor失效,这是waline的问题 placeholder: 快来评论吧~ # 评论占位提示 imageHosting: https://7bu.top/api/upload # 图床api（默认使用去不图床） # 其他配置项按照yml格式继续填写即可 除了 [el path placeholder uploadImage] 选项 serverURL: xxxxxxxxxxxxxxx # Waline 的服务端地址（必填） 测试用地址: https://waline-ruddy.vercel.app ... 可选配置项详见源码 一款快速、简洁且高效的无后端评论系统 https://github.com/MiniValine/MiniValine/ blog/_config.volantis.ymlcomments: ... service: minivaline ... # MiniValine # https://github.com/MiniValine/MiniValine minivaline: js: https://cdn.jsdelivr.net/npm/minivaline@latest path: # 全局评论地址 placeholder: 快来评论吧~ # 全局评论占位提示 # 更多选项 https://minivaline.js.org/docs/cn/#/Options 按照yml格式继续填写即可 （除了 [el path placeholder] 选项） # emoticonUrl 等列表选项 可参考 https://github.com/MiniValine/hexo-next-minivaline # 下面是一个例子： backend: waline serverURL: https://waline.vercel.app Vue 驱动的、基于 Issue 的评论插件 https://vssue.js.org/zh/ blog/_config.volantis.ymlcomments: ... service: vssue ... vssue: owner: repo: clientId: clientSecret: A modern comment component based on Github Issue and Preact. https://gitalk.github.io/ blog/_config.volantis.ymlcomments: ... service: gitalk ... gitalk: clientID: clientSecret: repo: owner: admin: # [] clientID 和 clientSecret 的获取方法可自行搜索教程，这里仅简单描述一下步骤： 点击 GitHub -> Settings https://github.com/settings/profile 点击 Developer settings https://github.com/settings/developers 点击 New OAuth App https://github.com/settings/applications/new 填写信息： Application name 随便填，我的是：xaoxuu.comHomepage URL 和 Authorization callback URL 都写你的网址，我的是：https://xaoxuu.com 可以通过设置 gitalk.id 实现多个页面共用一个评论框。 front-matter---gitalk: id: /wiki/volantis/--- Disqus - The #1 way to build an audience on your website. https://disqus.com/ blog/_config.volantis.ymlcomments: ... service: disqus ... disqus: shortname: Render Disqus comments in Mainland China using Disqus API https://github.com/SukkaW/DisqusJS blog/_config.volantis.ymlcomments: ... service: disqusjs ... # DisqusJS # https://github.com/SukkaW/DisqusJS disqusjs: path: # 全局评论地址 # 配置项按照yml格式继续填写即可 除了 [siteName url identifier] 选项 #shortname: #api: #apikey: #admin: #nesting: Communication makes better world. https://www.livere.com/ blog/_config.volantis.ymlcomments: ... service: livere ... livere: uid: #你的livere的uid 在这里查看你的 uid：https://livere.com/insight/myCode，在【代码管理 -> 一般网站】中找到如下这段代码，其中 data-uid 中的内容就是你的 livere_uid。 <!-- 来必力City版安装代码 --><div id="lv-container" data-id="city" data-uid="你的livere的uid">... A commenting server similar to Disqus. https://posativ.org/isso/ blog/_config.volantis.ymlcomments: ... service: isso ... isso: url: https://example.com/(path/) src: https://example.com/(path/)js/embed.min.js A free and open source PHP comment system designed to allow completely anonymous comments and easy theming. https://www.barkdull.org/software/hashover blog/_config.volantis.ymlcomments: ... service: hashover ... hashover: src: https://example.com/(path/)comments.phpblog/themes/volantis/layout/_third-party/comments/评论系统名称/layout.ejs这里写布局代码 blog/themes/volantis/layout/_third-party/comments/评论系统名称/script.ejs这里要写加载 js 的代码 收录更多评论系统 站内搜索blog/_config.volantis.ymlsearch: enable: true service: hexo # hexo, google, algolia, azure, baidu js: https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@2.6.4/js/search.js google: apiKey: engineId: algolia: applicationID: apiKey: indexName: azure: serviceName: indexName: queryKey: baidu: apiId: 默认配置为 Hexo 搜索，但是需要安装插件才能使用： npm i -S hexo-generator-search hexo-generator-json-content 第三方插件插件库Volantis 为丰富的插件提供了兼容性优化。大部分插件您只需开启和关闭，无需进行设置。 blog/_config.volantis.ymlplugins: ################# required plugins ################ # jquery jquery: https://cdn.jsdelivr.net/npm/jquery@3.5/dist/jquery.min.js # fontawesome fontawesome: https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.14/css/all.min.css ################# optional plugins ################ ######### Plugins to improve loading speed: # 预加载 preload: enable: true service: flying_pages # instant_page, flying_pages instant_page: https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@2/js/instant_page.js flying_pages: https://cdn.jsdelivr.net/gh/gijo-varghese/flying-pages@2.1.2/flying-pages.min.js # 图片懒加载 # https://www.npmjs.com/package/vanilla-lazyload lazyload: enable: true js: https://cdn.jsdelivr.net/npm/vanilla-lazyload@17.1.0/dist/lazyload.min.js onlypost: false loadingImg: # https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@3/img/placeholder/c617bfd2497fcea598e621413e315c368f8d8e.svg blurIn: true # 模糊加载效果 （loadingImg为空时有效） ######### Plugins to optimize the experience: # highlight.js highlightjs: enable: #true # Please set hexo.config.highlight.enable = false !!! js: https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10/build/highlight.min.js css: https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10/build/styles/solarized-light.min.css # more: https://www.jsdelivr.com/package/npm/highlight.js?path=styles # https://scrollrevealjs.org/api/reveal.html scrollreveal: enable: #true js: https://cdn.jsdelivr.net/npm/scrollreveal@4.0.6/dist/scrollreveal.min.js distance: 32px duration: 800 # ms interval: 20 # ms scale: 1 # 0.1~1 # Codeblock Copy Button clipboard: enable: #true js: https://cdn.jsdelivr.net/npm/clipboard@2/dist/clipboard.min.js ######### Plugins for SEO: # npm i hexo-wordcount wordcount: enable: #true ######### Plugins for ... # Button Ripple Effect nodewaves: enable: #true css: https://cdn.jsdelivr.net/npm/node-waves@0.7.6/dist/waves.min.css js: https://cdn.jsdelivr.net/npm/node-waves@0.7.6/dist/waves.min.js # fontawesome animation fontawesome_animation: enable: #true css: https://cdn.jsdelivr.net/gh/l-lin/font-awesome-animation/dist/font-awesome-animation.min.css # Typing Effects comment_typing: enable: #true js: https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@2/js/comment_typing.js # Slide Background backstretch: enable: #true js: https://cdn.jsdelivr.net/npm/jquery-backstretch@2.1.18/jquery.backstretch.min.js position: cover # cover: sticky on the cover. fixed: Fixed as background for the site. shuffle: true # shuffle playlist duration: 10000 # Duration (ms) fade: 1500 # fade duration (ms) (Not more than 1500) images: # For personal use only. At your own risk if used for commercial purposes !!! - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/001.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/002.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/003.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/004.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/005.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/006.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/012.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/016.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/019.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/025.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/033.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/034.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/035.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/038.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/039.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/042.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/046.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/051.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/052.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/054.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/056.jpg # APlayer is only available in mainland China. # APlayer config: https://github.com/metowolf/MetingJS aplayer: enable: #true js: aplayer: https://cdn.jsdelivr.net/npm/aplayer@1.10/dist/APlayer.min.js meting: https://cdn.jsdelivr.net/npm/meting@2.0/dist/Meting.min.js # Required server: netease # netease, tencent, kugou, xiami, baidu type: playlist # song, playlist, album, search, artist id: 3175833810 # song id / playlist id / album id / search keyword # Optional fixed: false # enable fixed mode theme: '#1BCDFC' # main color autoplay: false # audio autoplay order: list # player play order, values: 'list', 'random' loop: all # player loop play, values: 'all', 'one', 'none' volume: 0.7 # default volume, notice that player will remember user setting, default volume will not work after user set volume themselves list_max_height: 320px # list max height list_folded: true pjax: enable: true cover: true # 封面是否pjax处理 false：每次切换页面封面都重载，适合封面较少的情况 true：封面经过Pjax处理，适合封面较多的情况 timeout: 5000 # The timeout in milliseconds for the XHR requests. Set to 0 to disable the timeout. cacheBust: false # When set to true, Pjax appends a timestamp to skip the browser cache. animation: false # false, nprogress, circle banUrl: # 被屏蔽的 url 地址将不启用 pjax 跳转，可以在控制台下使用 window.location.pathname 获取 # - '/artitalk/' # artitalk 不支持 pjax # - '/bb/' # bbtalk 不支持 pjax # 从 issues 加载动态数据 # {% issues sites/timeline/friends | api=xxx | group=key:a,b,c %} # 例如： # {% issues sites | api=https://api.github.com/repos/volantis-x/examples/issues?sort=updated&state=open&page=1&per_page=100 | group=version:latest,v6,v5,v4,v3,v2,v1,v0 %} # 暗黑模式 darkmode # 样式：source/css/_plugins/dark.styl # 开关按钮：在 navbar.menu 中添加： # - name: 暗黑模式 # 可自定义 # icon: fas fa-moon # 可自定义 # toggle: darkmode darkmodejs: enable: #true # 旧版 Internet Explorer 淘汰行动 # https://www.microsoft.com/zh-cn/WindowsForBusiness/End-of-IE-support # 本主题不支持Internet Explorer的任何版本!!! killOldVersionsOfIE: enable: true # 禁用JavaScript提示 # 本页面需要浏览器支持（启用）JavaScript # 主题中的某些插件必须启用JavaScript才能正常工作，例如开启scrollreveal如果禁用JavaScript会导致卡片消失 killNoScript: enable: true # Artitalk https://artitalk.js.org # 配置过程请参考：https://artitalk.js.org/doc.html # 使用过旧版本的请修改Leancloud shuoshuo class部分列名：https://artitalk.js.org/release.html # 除appID和appKEY外均为选填项 artitalk: # Set `layout: artitalk` to enable in page # 配置项按照yml格式继续填写即可 appId: ogP8qj3veMh0LFpFWMPOyF0X-MdYXbMMI # your appID appKey: nHXLd3N3Jgh460t2iRQKWAtr # your appKEY # serverURL: #leancloud绑定的安全域名，使用国际版的话不需要填写 # lang: # 语言设置，zh为汉语，en为英语，es为西班牙语。默认为汉语 # pageSize: #每页说说的显示数量 # shuoPla: #在编辑说说的输入框中的占位符 # avatarPla: #自定义头像url的输入框的占位符 # motion: #加载动画的开关，1为开，0为关，默认为开 # bgImg: #说说输入框背景图片url # color1: #说说背景颜色1&按钮颜色1 # color2: #说说背景颜色2&按钮颜色2 # color3: #说说字体颜色 # cssUrl: #自定义css接口 # BBtalk https://bb.js.org bbtalk: js: https://cdn.jsdelivr.net/npm/bbtalk@0.1.5/dist/bbtalk.min.js # BBtalk.js appId: 0KzOX4vC7Jsk6vzUGNeEiUaI-gzGzoHsz # your appID appKey: HwCiWuxfpvKiLm4teCUgTIba # your appKEY serverURLs: https://bbapi.heson10.com # Request Api 域名 # Tidio聊天功能 # https://www.tidio.com/ tidio: enable: #true id: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx 幻灯片背景blog/_config.volantis.ymlplugins: ... backstretch: enable: true js: https://cdn.jsdelivr.net/npm/jquery-backstretch@2.1.18/jquery.backstretch.min.js position: cover # cover: sticky on the cover. fixed: Fixed as background for the site. duration: 20000 # Duration (ms) fade: 1500 # fade duration (ms) (Not more than 1500) images: # For personal use only. At your own risk if used for commercial purposes !!! - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper/abstract/41F215B9-261F-48B4-80B5-4E86E165259E.jpeg ... 幻灯片背景图片显示的位置可以选择粘贴在封面上，跟随封面一起滑动，也可以选择固定作为网页背景图片。 highlight.jsblog/_config.volantis.ymlplugins: ... # highlight.js highlightjs: enable: true # Please set hexo.config.highlight.enable = false !!! js: https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10/build/highlight.min.js css: https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10/build/styles/solarized-light.min.css # more: https://www.jsdelivr.com/package/npm/highlight.js?path=styles 如果需要使用 highlight.js 进行语法高亮，请将站点配置文件中的 highlight.enable 设置为 false 否则不会加载插件。您可以在 94 种 语法高亮主题 中挑选喜爱的主题，然后替换上面的 css 链接。 如果您使用 highlight.js 请确保没有使用 hexo 官方的 codeblock 标签，否则会报错。 经测试，使用 highlight.js 的情况下，部分容器内的代码可能仍然会被渲染甚至报错。 APlayer 音乐播放器blog/_config.volantis.ymlplugins: ... # APlayer is only available in mainland China. # APlayer config: https://github.com/metowolf/MetingJS aplayer: enable: true js: aplayer: https://cdn.jsdelivr.net/npm/aplayer@1.10/dist/APlayer.min.js meting: https://cdn.jsdelivr.net/npm/meting@2.0/dist/Meting.min.js # Required server: netease # netease, tencent, kugou, xiami, baidu type: playlist # song, playlist, album, search, artist id: 3175833810 # song id / playlist id / album id / search keyword # Optional fixed: false # enable fixed mode theme: '#1BCDFC' # main color autoplay: false # audio autoplay order: list # player play order, values: 'list', 'random' loop: all # player loop play, values: 'all', 'one', 'none' volume: 0.7 # default volume, notice that player will remember user setting, default volume will not work after user set volume themselves list_max_height: 320px # list max height list_folded: true APlayer播放器只可以在中国大陆地区使用。相关文档： APlayer | MetingJS 暗黑模式blog/_config.volantis.ymlplugins: ... # 样式：source/css/_plugins/dark.styl # 开关按钮：在 navbar.menu 中添加： # - name: 暗黑模式 # 可自定义 # icon: fas fa-moon # 可自定义 # toggle: darkmode darkmodejs: enable: true 结束支持blog/_config.volantis.ymlplugins: ... # 旧版 Internet Explorer 淘汰行动 # https://www.microsoft.com/zh-cn/WindowsForBusiness/End-of-IE-support # 本主题不支持Internet Explorer的任何版本!!! killOldVersionsOfIE: enable: true # 禁用JavaScript提示 # 本页面需要浏览器支持（启用）JavaScript # 主题中的某些插件必须启用JavaScript才能正常工作，例如开启scrollreveal如果禁用JavaScript会导致卡片消失 killNoScript: enable: true Artitalkblog/_config.volantis.ymlplugins: ... # Artitalk https://artitalk.js.org # 配置过程请参考：https://artitalk.js.org/doc.html # 使用过旧版本的请修改Leancloud shuoshuo class部分列名：https://artitalk.js.org/release.html # 除appID和appKEY外均为选填项 artitalk: # Set `layout: artitalk` to enable in page # 配置项按照yml格式继续填写即可 appId: ogP8qj3veMh0LFpFWMPOyF0X-MdYXbMMI # your appID appKey: nHXLd3N3Jgh460t2iRQKWAtr # your appKEY # serverURL: #leancloud绑定的安全域名，使用国际版的话不需要填写 # lang: # 语言设置，zh为汉语，en为英语，es为西班牙语。默认为汉语 # pageSize: #每页说说的显示数量 # shuoPla: #在编辑说说的输入框中的占位符 # avatarPla: #自定义头像url的输入框的占位符 # motion: #加载动画的开关，1为开，0为关，默认为开 # bgImg: #说说输入框背景图片url # color1: #说说背景颜色1&按钮颜色1 # color2: #说说背景颜色2&按钮颜色2 # color3: #说说字体颜色 # cssUrl: #自定义css接口 BBtalkblog/_config.volantis.ymlplugins: ... bbtalk: js: https://cdn.jsdelivr.net/npm/bbtalk@0.1.5/dist/bbtalk.min.js # BBtalk.js appId: 0KzOX4vC7Jsk6vzUGNeEiUaI-gzGzoHsz # your appID appKey: HwCiWuxfpvKiLm4teCUgTIba # your appKEY serverURLs: https://bbapi.heson10.com # Request Api 域名 Tidioblog/_config.volantis.ymlplugins: ... # Tidio聊天功能 # https://www.tidio.com/ tidio: enable: true id: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"}],"posts":[{"title":"使用 pandoc 正确渲染多行 MathJax 公式","slug":"blogs/2021-4-18-pandoc-renderer","date":"2021-04-18T00:00:00.000Z","updated":"2021-04-18T00:00:00.000Z","comments":true,"path":"blogs/2021-4-18-pandoc-renderer/","link":"https://shiraha.cn/2021/use-pandoc-to-render-multiline-formulas-correctly/","permalink":"https://volantis.js.org/blogs/2021-4-18-pandoc-renderer/","excerpt":"","text":"","categories":[{"name":"开发心得","slug":"开发心得","permalink":"https://volantis.js.org/categories/%E5%BC%80%E5%8F%91%E5%BF%83%E5%BE%97/"}],"tags":[],"author":"Nanami"},{"title":"为volantis添加瀑布流相册","slug":"blogs/2021-4-14-photos","date":"2021-04-14T00:00:00.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"blogs/2021-4-14-photos/","link":"https://goopher.tk/posts/7.html","permalink":"https://volantis.js.org/blogs/2021-4-14-photos/","excerpt":"经过折腾，目前相册功能可用了，就是还不支持分类和懒加载，等后续完善吧。","text":"经过折腾，目前相册功能可用了，就是还不支持分类和懒加载，等后续完善吧。","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"GOOPHER"},{"title":"为volantis添加hls.js以在Chrome上播放m3u8视频","slug":"blogs/2021-4-1-hls","date":"2021-04-01T00:00:00.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"blogs/2021-4-1-hls/","link":"https://goopher.tk/posts/4.html","permalink":"https://volantis.js.org/blogs/2021-4-1-hls/","excerpt":"在文章中插入m3u8视频的时候，由于Chrome等浏览器原生播放不了这种格式，所以需要添加hls.js等让其支持播放，如果你也遇到了这样的问题就来看看吧。","text":"在文章中插入m3u8视频的时候，由于Chrome等浏览器原生播放不了这种格式，所以需要添加hls.js等让其支持播放，如果你也遇到了这样的问题就来看看吧。","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"GOOPHER"},{"title":"volantis主题修改代码高亮样式","slug":"blogs/2021-3-31-highlightjs","date":"2021-03-31T00:00:00.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"blogs/2021-3-31-highlightjs/","link":"https://goopher.tk/posts/3.html","permalink":"https://volantis.js.org/blogs/2021-3-31-highlightjs/","excerpt":"在使用主题内的highlightjs的时候，你是否也遇到了它不换行、没有行号等问题？点进来看看吧。","text":"在使用主题内的highlightjs的时候，你是否也遇到了它不换行、没有行号等问题？点进来看看吧。","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"GOOPHER"},{"title":"为volantis主题添加图片轮播和热门文章","slug":"blogs/2021-2-30-slider","date":"2021-03-30T00:00:00.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"blogs/2021-2-30-slider/","link":"https://goopher.tk/posts/1.html","permalink":"https://volantis.js.org/blogs/2021-2-30-slider/","excerpt":"这篇教程是基于heson大佬的这篇 给Hexo Volantis主题添加图片轮播功能 创作的，由我将新的轮播模板迁移至主题内，由inkss大佬完善。在这感谢两位大佬，如果你也需要轮播插件，就进来看看吧。","text":"这篇教程是基于heson大佬的这篇 给Hexo Volantis主题添加图片轮播功能 创作的，由我将新的轮播模板迁移至主题内，由inkss大佬完善。在这感谢两位大佬，如果你也需要轮播插件，就进来看看吧。","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"GOOPHER"},{"title":"使用volantis更优雅地展示截图/录屏","slug":"blogs/2021-3-7-framei8","date":"2021-03-07T00:00:00.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"blogs/2021-3-7-framei8/","link":"https://goopher.tk/posts/24004.html","permalink":"https://volantis.js.org/blogs/2021-3-7-framei8/","excerpt":"我在主题文档中看到了frame标签，可以更高大上得展示我们的截图/录屏等。可是目前主题内仅内置了一个iPhone11的框架，想要使用其他的框架就得对齐修改，我经过折腾基本实现了，写下了这篇文章。","text":"我在主题文档中看到了frame标签，可以更高大上得展示我们的截图/录屏等。可是目前主题内仅内置了一个iPhone11的框架，想要使用其他的框架就得对齐修改，我经过折腾基本实现了，写下了这篇文章。","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"GOOPHER"},{"title":"为 hexo 博客支持 sweetalert 弹窗","slug":"blogs/2021-2-19-hexo-supports-sweetalert","date":"2021-02-19T00:00:00.000Z","updated":"2021-02-19T00:00:00.000Z","comments":true,"path":"blogs/2021-2-19-hexo-supports-sweetalert/","link":"https://luosw.fun/post/e281.html","permalink":"https://volantis.js.org/blogs/2021-2-19-hexo-supports-sweetalert/","excerpt":"","text":"","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"luosw"},{"title":"通过CoolPush实时推送hexo评论到QQ","slug":"blogs/2020-12-17-comments-push","date":"2020-12-17T00:00:00.000Z","updated":"2020-12-17T00:00:00.000Z","comments":true,"path":"blogs/2020-12-17-comments-push/","link":"https://www.hin.cool/posts/cpush.html","permalink":"https://volantis.js.org/blogs/2020-12-17-comments-push/","excerpt":"","text":"","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"W4J1e"},{"title":"哔哔！换个姿势在静态博客上发短博文（volantis适配版）","slug":"blogs/2020-10-09-bb-on-volantis","date":"2020-10-09T00:00:00.000Z","updated":"2020-10-09T00:00:00.000Z","comments":true,"path":"blogs/2020-10-09-bb-on-volantis/","link":"https://www.heson10.com/posts/15701.html","permalink":"https://volantis.js.org/blogs/2020-10-09-bb-on-volantis/","excerpt":"要在静态博客上发送短博文，不像 wordpress 和 typecho 新建个栏目那么简单。之前博客整的是 artitalk，已经有短博文的那种体验了，而且还能支持发送 markdown、图片、音乐等等功能。感觉唯一的缺点就是：发文不是很方便，需要在博客上登陆。(至少我觉得很麻烦)。后来看到 @熊野 的那篇《哔哔点啥，换个舒服的姿势》，顿时感觉爱了，这就是我梦寐以求发送短博文的姿势。","text":"要在静态博客上发送短博文，不像 wordpress 和 typecho 新建个栏目那么简单。之前博客整的是 artitalk，已经有短博文的那种体验了，而且还能支持发送 markdown、图片、音乐等等功能。感觉唯一的缺点就是：发文不是很方便，需要在博客上登陆。(至少我觉得很麻烦)。后来看到 @熊野 的那篇《哔哔点啥，换个舒服的姿势》，顿时感觉爱了，这就是我梦寐以求发送短博文的姿势。","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"Heson"},{"title":"Hexo 标签函数 list_tags 用法详解","slug":"blogs/2020-09-24-list-tags","date":"2020-09-24T00:00:00.000Z","updated":"2020-09-24T00:00:00.000Z","comments":true,"path":"blogs/2020-09-24-list-tags/","link":"https://www.heson10.com/posts/59108.html","permalink":"https://volantis.js.org/blogs/2020-09-24-list-tags/","excerpt":"","text":"","categories":[{"name":"开发心得","slug":"开发心得","permalink":"https://volantis.js.org/categories/%E5%BC%80%E5%8F%91%E5%BF%83%E5%BE%97/"}],"tags":[],"author":"Heson"},{"title":"如何给博客添加弹窗通知","slug":"blogs/2020-09-03-message-prompt","date":"2020-09-03T00:00:00.000Z","updated":"2020-09-04T00:00:00.000Z","comments":true,"path":"blogs/2020-09-03-message-prompt/","link":"https://colsrch.cn/posts/72bb5148/","permalink":"https://volantis.js.org/blogs/2020-09-03-message-prompt/","excerpt":"","text":"","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"Colsrch"},{"title":"博客访问速度提升：最佳线路分流","slug":"blogs/2020-08-31-hexospeed","date":"2020-08-31T00:00:00.000Z","updated":"2020-08-31T00:00:00.000Z","comments":true,"path":"blogs/2020-08-31-hexospeed/","link":"https://colsrch.cn/posts/56951997/","permalink":"https://volantis.js.org/blogs/2020-08-31-hexospeed/","excerpt":"","text":"","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"Colsrch"},{"title":"静态博客使用 Issues API 发布动态、友链、书签","slug":"blogs/2020-08-28-issue-api","date":"2020-08-28T00:00:00.000Z","updated":"2020-08-28T00:00:00.000Z","comments":true,"path":"blogs/2020-08-28-issue-api/","link":"https://xaoxuu.com/blog/2020-08-23-issues-api/","permalink":"https://volantis.js.org/blogs/2020-08-28-issue-api/","excerpt":"","text":"","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"xaoxuu"},{"title":"给 Volantis 主题调用 Valine 最新评论","slug":"blogs/2020-09-03-latest-comments","date":"2020-08-28T00:00:00.000Z","updated":"2020-09-03T00:00:00.000Z","comments":true,"path":"blogs/2020-09-03-latest-comments/","link":"https://www.heson10.com/posts/7207.html","permalink":"https://volantis.js.org/blogs/2020-09-03-latest-comments/","excerpt":"","text":"","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"Heson"},{"title":"给 Hexo Volantis 主题添加图片轮播功能","slug":"blogs/2020-08-21-main-banner","date":"2020-08-21T00:00:00.000Z","updated":"2020-08-22T00:00:00.000Z","comments":true,"path":"blogs/2020-08-21-main-banner/","link":"https://www.heson10.com/posts/19736.html","permalink":"https://volantis.js.org/blogs/2020-08-21-main-banner/","excerpt":"","text":"","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"Heson"},{"title":"如何快速优雅地删除 Valine 的垃圾评论","slug":"blogs/2020-07-03-valine","date":"2020-07-03T00:00:00.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"blogs/2020-07-03-valine/","link":"","permalink":"https://volantis.js.org/blogs/2020-07-03-valine/","excerpt":"Valine 评论由于可以匿名，发言成本低、质量低，使用 app 可以方便的删除垃圾评论。","text":"Valine 评论由于可以匿名，发言成本低、质量低，使用 app 可以方便的删除垃圾评论。 操作演示Your browser does not support the video tag. App 只支持数据存储于 LeanCloud 的评论系统。 App 登录前需要配置 AppID 和 AppKey，由于字符比较长，输入不方便，所以支持 URL Scheme 配置。将 URL 生成一个二维码，然后用手机扫码就可以打开 App 并自动配置好。 格式为： valine://cfg/id=7yIoRlSmfX09vQCERsuWzFnx-MdYXbMMI&key=3zCL5GFePTUjwbqLop44QFbr&alias=测试项目 也可以把管理员用户的账号和密码配置上，扫码直接登录，但是注意不要泄露出去： valine://cfg/id=7yIoRlSmfX09vQCERsuWzFnx-MdYXbMMI&key=3zCL5GFePTUjwbqLop44QFbr&alias=测试项目&user=me@xaoxuu.com&psw=q 注意：这个管理员用户并不是 LeanCloud 的账号，而是当前 Valine 数据库中的 _User 表中的一个用户，可以在 App 中注册，然后在 LeanCloud 上把注册的用户设置为管理员。 设置管理员的方法：在 _Role 表中新建一个 admin 角色，然后在 admin 角色的 users 列中点击 Relations 把自己刚注册的用户添加进去，这个用户就有了修改和删除评论数据的权限。 App 测试版地址 Valine for iOS Valine for Android","categories":[{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"}],"tags":[],"author":"xaoxuu"},{"title":"Volantis 主题部署 Pjax","slug":"blogs/2020-05-17-pjax","date":"2020-05-17T00:00:00.000Z","updated":"2020-08-07T00:00:00.000Z","comments":true,"path":"blogs/2020-05-17-pjax/","link":"https://inkss.cn/blog/76993423/","permalink":"https://volantis.js.org/blogs/2020-05-17-pjax/","excerpt":"","text":"","categories":[{"name":"开发心得","slug":"开发心得","permalink":"https://volantis.js.org/categories/%E5%BC%80%E5%8F%91%E5%BF%83%E5%BE%97/"}],"tags":[],"author":"inkss"},{"title":"关于主题与文档的更新","slug":"news/2020-04-04","date":"2020-04-04T00:00:00.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"news/2020-04-04/","link":"https://github.com/volantis-x/hexo-theme-volantis/issues/215","permalink":"https://volantis.js.org/news/2020-04-04/","excerpt":"由于主题目前仍处于青少年阶段，更新迭代速度比较快，所以不会保留旧版本的文档，如果需要查看旧版本的文档，请下载主题文档的源码，回退到旧版本，本地运行查看。 计划 2.x 的最后一个版本的文档会保留至 5.0 发布时，即最终会同时维护3个大版本的文档。 当主题稳定后会提供英文文档。","text":"由于主题目前仍处于青少年阶段，更新迭代速度比较快，所以不会保留旧版本的文档，如果需要查看旧版本的文档，请下载主题文档的源码，回退到旧版本，本地运行查看。 计划 2.x 的最后一个版本的文档会保留至 5.0 发布时，即最终会同时维护3个大版本的文档。 当主题稳定后会提供英文文档。","categories":[{"name":"官方资讯","slug":"官方资讯","permalink":"https://volantis.js.org/categories/%E5%AE%98%E6%96%B9%E8%B5%84%E8%AE%AF/"}],"tags":[]},{"title":"新版本「2.0」正式版发布","slug":"news/2020-03-10-2.0","date":"2020-03-10T00:00:00.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"news/2020-03-10-2.0/","link":"","permalink":"https://volantis.js.org/news/2020-03-10-2.0/","excerpt":"本次更新内容非常多，主要升级了导航栏、使用新的语言重写了全部样式。旧版本 Volantis 用户，请您卸载掉旧的样式渲染插件，并安装新的： 卸载 less npm uninstall hexo-renderer-less --save 安装 stylus npm install hexo-renderer-stylus --save","text":"本次更新内容非常多，主要升级了导航栏、使用新的语言重写了全部样式。旧版本 Volantis 用户，请您卸载掉旧的样式渲染插件，并安装新的： 卸载 less npm uninstall hexo-renderer-less --save 安装 stylus npm install hexo-renderer-stylus --save 新功能导航栏导航栏获得了史诗级的增强，可以设置N级子菜单。考虑到实用性，不太建议使用过多或者过深的菜单（超出屏幕的部分无法被看到）。 样式设置现在可以在主题配置文件中设置更多的样式： 最大布局宽度 导航栏高度、特效（阴影、毛玻璃、鼠标hover时浮起） 卡片特效（阴影、毛玻璃、鼠标hover时浮起） 代码框是否显示语言 标题和正文文本布局（靠左、靠右、居中） 正文字体 代码字体 各部分颜色 封面封面可以在主题配置文件中设置在首页、归档页面、其它页面默认是否显示。封面中可以同时显示logo图片、标题、副标题了。 小部件grid小部件可以设置 fixed: true 来固定网格宽度（适合文字长短不一的场景）。 其它可以设置「评论」的标题和副标题。可以创建多种颜色的折叠框。友链增加分组描述。 功能调整与优化样式渲染器使用 stylus 重写了所有样式，无需安装less插件了。相较于1.7.4，css文件体积缩小了19.75%。 主题配置文件 主题配置文件经过了较大改动，使得层级结构更加清晰。 优化了二维码（微信）分享的使用体验","categories":[{"name":"官方资讯","slug":"官方资讯","permalink":"https://volantis.js.org/categories/%E5%AE%98%E6%96%B9%E8%B5%84%E8%AE%AF/"}],"tags":[]},{"title":"新版本「2.0」测试版发布","slug":"news/2020-03-06-2.0-beta","date":"2020-03-06T19:43:00.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"news/2020-03-06-2.0-beta/","link":"","permalink":"https://volantis.js.org/news/2020-03-06-2.0-beta/","excerpt":"Beta6 导航栏N级菜单支持分割线和小标题，详见我的个人博客。","text":"Beta6 导航栏N级菜单支持分割线和小标题，详见我的个人博客。 Beta5 导航栏二级N级菜单 支持微信二维码分享（需安装二维码生成插件） Beta4 优化样式 更多样式可以在主题配置文件中自定义 调整主题配置文件 Beta3 优化样式 grid 部件新增 fixed: true 参数，用于固定宽度。 Beta2 可以创建多种颜色的折叠框 友链增加分组描述 Beta1 新版本使用 stylus 完全重写了样式。 可在主题配置文件中修改配色、标题等多种样式（需要关闭CDN）。已知的BUG有： Container左侧的图标（图片）始终显示不出来，原因未知。>div.info background-color: alpha($color-mac-cyan, 20%) border-left: $borderradius-codeblock solid $color-mac-cyan border-radius: $borderradius-codeblock >:before ...(省略无关代码) background-size: 16px 16px background-position: 4px 4px background-repeat: no-repeat background-color: $color-mac-cyan background-image: url("data:image/svg+xmlbase64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHdpZHRoPSIxNzkyIiBoZWlnaHQ9IjE3OTIiIHZpZXdCb3g9IjAgMCAxNzkyIDE3OTIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTEyMTYgMTM0NHYxMjhxMCAyNi0xOSA0NXQtNDUgMTloLTUxMnEtMjYgMC00NS0xOXQtMTktNDV2LTEyOHEwLTI2IDE5LTQ1dDQ1LTE5aDY0di0zODRoLTY0cS0yNiAwLTQ1LTE5dC0xOS00NXYtMTI4cTAtMjYgMTktNDV0NDUtMTloMzg0cTI2IDAgNDUgMTl0MTkgNDV2NTc2aDY0cTI2IDAgNDUgMTl0MTkgNDV6bS0xMjgtMTE1MnYxOTJxMCAyNi0xOSA0NXQtNDUgMTloLTI1NnEtMjYgMC00NS0xOXQtMTktNDV2LTE5MnEwLTI2IDE5LTQ1dDQ1LTE5aDI1NnEyNiAwIDQ1IDE5dDE5IDQ1eiIgZmlsbD0iI2ZmZiIvPjwvc3ZnPg==")我试过把url里面的内容换成网络图片的URL是可以正常显示的。源码在： themes/volantis/source/css/_third-party/container.styl","categories":[{"name":"官方资讯","slug":"官方资讯","permalink":"https://volantis.js.org/categories/%E5%AE%98%E6%96%B9%E8%B5%84%E8%AE%AF/"}],"tags":[]},{"title":"测试「文章内链接作文本的话无法生成静态文件」","slug":"test/2020-03-06-test-url","date":"2020-03-06T00:00:00.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"test/2020-03-06-test-url/","link":"","permalink":"https://volantis.js.org/test/2020-03-06-test-url/","excerpt":"","text":"5、测试Tomcat是否配置成功：打开浏览器，输入在地址栏中输入： http://localhost:8080 的运行结果如下图即为即为配置成功！（因为Tomcat已经在运行再次打开会报错） 相关 Issue： #164 结论：存在这篇文章的情况下能够成功 deploy ，说明这不是主题的 BUG。 markdwon 解析插件为 hexo-renderer-marked 时此插件默认会自动识别 URL ，且原文链接前后没有空格，所以链接前后增加一个空格或者在根目录配置文件中设置 autolink: false 都可以避免 deploy 报错。插件：hexo-renderer-marked","categories":[],"tags":[]},{"title":"新增 pjax 开发分支","slug":"news/2020-02-25","date":"2020-02-25T00:00:00.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"news/2020-02-25/","link":"","permalink":"https://volantis.js.org/news/2020-02-25/","excerpt":"","text":"由于功能未完全兼容，如果想率先使用，尽量不要改主题配置文件。 不能使用封面 mathjax 有折叠框的页面，折叠框打开之后目录高亮位置不对应 很多未知问题 感谢 @inkss 发布的这篇教程 《Hexo 博客部署 Pjax 局部刷新》当所有兼容性问题解决或妥协之后，pjax 分支会合并入 master。","categories":[{"name":"官方资讯","slug":"官方资讯","permalink":"https://volantis.js.org/categories/%E5%AE%98%E6%96%B9%E8%B5%84%E8%AE%AF/"}],"tags":[]},{"title":"主题更名为「Volantis」","slug":"news/2020-02-22","date":"2020-02-22T00:00:00.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"news/2020-02-22/","link":"","permalink":"https://volantis.js.org/news/2020-02-22/","excerpt":"","text":"主题原名「Material X」,最初由「Material-Flow」改编，现已完全没有材质化设计的影子了。风格偏向简约风技术类博客，最大的特点是自由。现更名为「Volantis」，取自权力的游戏地名。","categories":[{"name":"官方资讯","slug":"官方资讯","permalink":"https://volantis.js.org/categories/%E5%AE%98%E6%96%B9%E8%B5%84%E8%AE%AF/"}],"tags":[]},{"title":"主题文档网页更新并开源","slug":"news/2020-02-21","date":"2020-02-21T00:00:00.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"news/2020-02-21/","link":"","permalink":"https://volantis.js.org/news/2020-02-21/","excerpt":"","text":"主题经过几年迭代，现已高度模块化和可定制化，功能相对完善，适合用作文档。原来的 文档主题 将不再维护和更新。 现在使用的文档页面源码是： volantis-docs","categories":[{"name":"官方资讯","slug":"官方资讯","permalink":"https://volantis.js.org/categories/%E5%AE%98%E6%96%B9%E8%B5%84%E8%AE%AF/"}],"tags":[]},{"title":"已关闭评论区","slug":"news/2020-02-20","date":"2020-02-20T00:00:00.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"news/2020-02-20/","link":"","permalink":"https://volantis.js.org/news/2020-02-20/","excerpt":"","text":"使用 GitHub Issue由于 Valine 匿名评论不适合追踪和解决问题，因此决定暂时关闭评论区。为了精准高效解决问题，请前往 GitHub Issue 遇到问题怎么办 确定已经查阅文档找不到相关内容。 前往「常见问题」页面，查看是否有解决方案。 访问在线示例，查看是否具有相同第问题。 如果在线示例表示正常，则说明自己配置有误，检查开发环境、主题配置是否正确。如果检查不出问题，提Issue询问。 如果在线示例也存在相同问题，则说明存在BUG，请提Issue反馈。 如果在线示例没有相关内容，下载示例博客源码，修改运行本地预览，进行第3步判断操作。","categories":[{"name":"官方资讯","slug":"官方资讯","permalink":"https://volantis.js.org/categories/%E5%AE%98%E6%96%B9%E8%B5%84%E8%AE%AF/"}],"tags":[]},{"title":"版本命名规范化","slug":"news/2020-02-19","date":"2020-02-19T00:00:00.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"news/2020-02-19/","link":"","permalink":"https://volantis.js.org/news/2020-02-19/","excerpt":"","text":"主版本号.子版本号.修订版本号 主题从2017年至今，已经经历了相当多的大版本迭代和数不尽的小版本更新，但是版本号的更新一直没有遵循规范。从下次更新开始，将遵循下述的规范： 主版本号： 较大改动、框架调整或重构 子版本号： 较小或局部的功能性更新 修订版本号： 修复BUG或无关紧要的细节调整","categories":[{"name":"官方资讯","slug":"官方资讯","permalink":"https://volantis.js.org/categories/%E5%AE%98%E6%96%B9%E8%B5%84%E8%AE%AF/"}],"tags":[]},{"title":"心率测量工具限免活动","slug":"news/2020-02-18","date":"2020-02-18T00:00:00.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"news/2020-02-18/","link":"","permalink":"https://volantis.js.org/news/2020-02-18/","excerpt":"","text":"心率管家 App（仅iOS端），专业版不定期限免，欢迎下载体验。 如果您看到的时候已经过了限免期，可以先下载免费版使用。为了吸引 app 推荐类网站的爬虫进行推荐，专业版的价格通常在0元到68元之间浮动变化的。 心率管家 专业版 心率管家 免费版","categories":[{"name":"官方资讯","slug":"官方资讯","permalink":"https://volantis.js.org/categories/%E5%AE%98%E6%96%B9%E8%B5%84%E8%AE%AF/"}],"tags":[]},{"title":"Code Highlight Style test","slug":"test/code-highlight","date":"2019-07-25T16:43:00.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"test/code-highlight/","link":"","permalink":"https://volantis.js.org/test/code-highlight/","excerpt":"Make sure all the code blocks highlighted correctly. All the code samples are come from the demo of https://highlightjs.org","text":"Make sure all the code blocks highlighted correctly. All the code samples are come from the demo of https://highlightjs.org Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. #[derive(Debug)]pub enum State { Start, Transient, Closed,}impl From<&'a str> for State { fn from(s: &'a str) -> Self { match s { "start" => State::Start, "closed" => State::Closed, _ => unreachable!(), } }} [ { "title": "apples", "count": [12000, 20000], "description": {"text": "...", "sensitive": false} }, { "title": "oranges", "count": [17500, null], "description": {"text": "...", "sensitive": false} }] class MyClass { public static myValue: string; constructor(init: string) { this.myValue = init; }}import fs = require("fs");module MyModule { export interface MyInterface extends Other { myProperty: any; }}declare magicNumber number;myArray.forEach(() => { }); // fat arrow syntax @requires_authorizationdef somefunc(param1='', param2=0): r'''A docstring''' if param1 > param2: # interesting print 'Gre\\'ater' return (param2 - param1 + 1 + 0b10l) or Noneclass SomeClass: pass>>> message = '''interpreter... prompt''' <!DOCTYPE html><title>Title</title><style>body {width: 500px;}</style><script type="application/javascript"> function $init() {return true;}</script><body> <p checked class="title" id='title'>Title</p> <!-- here goes the rest of the page --></body> function $initHighlight(block, cls) { try { if (cls.search(/\\bno\\-highlight\\b/) != -1) return process(block, true, 0x0F) + ` class="${cls}"`; } catch (e) { /* handle exception */ } for (var i = 0 / 2; i < classes.length; i++) { if (checkCondition(classes[i]) === undefined) console.log('undefined'); } return ( <div> <web-component>{block}</web-component> </div> )}export $initHighlight; #include <iostream>int main(int argc, char *argv[]) { /* An annoying "Hello World" example */ for (auto i = 0; i < 0xFFFF; i++) cout << "Hello, World!" << endl; char c = '\\n'; unordered_map <string, vector<string> > m; m["key"] = "\\\\\\\\"; // this is an error return -2e3 + 12l;} CREATE TABLE "topic" ( "id" serial NOT NULL PRIMARY KEY, "forum_id" integer NOT NULL, "subject" varchar(255) NOT NULL);ALTER TABLE "topic"ADD CONSTRAINT forum_id FOREIGN KEY ("forum_id")REFERENCES "forum" ("id");-- Initialsinsert into "topic" ("forum_id", "subject")values (2, 'D''artagnian'); #import <UIKit/UIKit.h>#import "Dependency.h"@protocol WorldDataSource@optional- (NSString *)worldName;@required- (BOOL)allowsToLive;@end// comment@property (nonatomic, readonly) NSString *title;- (IBAction) show;@end /** * @author John Smith <john.smith@example.com>*/package l2f.gameserver.model;public abstract class L2Char extends L2Object { public static final Short ERROR = 0x0001; public void moveTo(int x, int y, int z) { _ai = null; log("Should not be called"); if (1 > 5) { // wtf!? return; } }} import Foundation@objc class Person: Entity { var name: String! var age: Int! init(name: String, age: Int) { /* /* ... */ */ } // Return a descriptive string for this person func description(offset: Int = 0) -> String { return "\\(name) is \\(age + offset) years old" }} @font-face { font-family: Chunkfive; src: url('Chunkfive.otf');}body, .usertext { color: #F0F0F0; background: #600; font-family: Chunkfive, sans;}@import url(print.css);@media print { a[href^=http]::after { content: attr(href) }} # The Greeter classclass Greeter def initialize(name) @name = name.capitalize end def salute puts "Hello #{@name}!" endendg = Greeter.new("world")g.salute # MakefileBUILDDIR = _buildEXTRAS ?= $(BUILDDIR)/extras.PHONY: main cleanmain: @echo "Building main facility..." build_main $(BUILDDIR)clean: rm -rf $(BUILDDIR)/* package mainimport "fmt"func main() { ch := make(chan float64) ch <- 1.0e10 // magic number x, ok := <- ch defer fmt.Println(`exitting now\\`) go println(len("hello world!")) return} #!/bin/bash###### CONFIGACCEPTED_HOSTS="/root/.hag_accepted.conf"BE_VERBOSE=falseif [ "$UID" -ne 0 ]then echo "Superuser rights required" exit 2figenApacheConf(){ echo -e "# Host ${HOME_DIR}$1/$2 :"} ; boilerplate[package]name = "some_name"authors = ["Author"]description = "This is \\a description"[[lib]]name = ${NAME}default = Trueauto = nocounter = 1_000","categories":[],"tags":[]},{"title":"Markdown Style test","slug":"test/markdown","date":"2018-07-24T23:31:06.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"test/markdown/","link":"","permalink":"https://volantis.js.org/test/markdown/","excerpt":"This post is originated from here and is used for testing markdown style. This post contains nearly every markdown usage. Make sure all the markdown elements below show up correctly.","text":"This post is originated from here and is used for testing markdown style. This post contains nearly every markdown usage. Make sure all the markdown elements below show up correctly. Headers# H1## H2### H3#### H4##### H5###### H6Alternatively, for H1 and H2, an underline-ish style:Alt-H1======Alt-H2------ H1H2H3H4H5H6Alternatively, for H1 and H2, an underline-ish style: Alt-H1Alt-H2EmphasisEmphasis, aka italics, with *asterisks* or _underscores_.Strong emphasis, aka bold, with **asterisks** or __underscores__.Combined emphasis with **asterisks and _underscores_**.Strikethrough uses two tildes. ~~Scratch this.~~ Emphasis, aka italics, with asterisks or underscores. Strong emphasis, aka bold, with asterisks or underscores. Combined emphasis with asterisks and underscores. Strikethrough uses two tildes. Scratch this. Lists1. First ordered list item2. Another item * Unordered sub-list.1. Actual numbers don't matter, just that it's a number 1. Ordered sub-list4. And another item. You can have properly indented paragraphs within list items. Notice the blank line above, and the leading spaces (at least one, but we'll use three here to also align the raw Markdown). To have a line break without a paragraph, you will need to use two trailing spaces. Note that this line is separate, but within the same paragraph. (This is contrary to the typical GFM line break behaviour, where trailing spaces are not required.)* Unordered list can use asterisks- Or minuses+ Or pluses- Paragraph In unordered list For example like this.Common Paragraph with some text.And more text. First ordered list item Another item Unordered sub-list. Actual numbers don't matter, just that it's a number Ordered sub-list And another item. You can have properly indented paragraphs within list items. Notice the blank line above, and the leading spaces (at least one, but we'll use three here to also align the raw Markdown). To have a line break without a paragraph, you will need to use two trailing spaces.Note that this line is separate, but within the same paragraph.(This is contrary to the typical GFM line break behaviour, where trailing spaces are not required.) Unordered list can use asterisks Or minuses Or pluses Paragraph In unordered list For example like this. Common Paragraph with some text.And more text. Inline HTML<p>To reboot your computer, press <kbd>ctrl</kbd>+<kbd>alt</kbd>+<kbd>del</kbd>.</p> To reboot your computer, press ctrl+alt+del. <dl> <dt>Definition list</dt> <dd>Is something people use sometimes.</dd> <dt>Markdown in HTML</dt> <dd>Does *not* work **very** well. Use HTML <em>tags</em>.</dd></dl> Definition list Is something people use sometimes. <dt>Markdown in HTML</dt> <dd>Does *not* work **very** well. Use HTML <em>tags</em>.</dd> Links[I'm an inline-style link](https://www.google.com)[I'm an inline-style link with title](https://www.google.com "Google's Homepage")[I'm a reference-style link][Arbitrary case-insensitive reference text][I'm a relative reference to a repository file](https://cdn.jsdelivr.net/gh/theme-volantis/hexo-theme-volantis/LICENSE)[You can use numbers for reference-style link definitions][1]Or leave it empty and use the [link text itself]Some text to show that the reference links can follow later.[arbitrary case-insensitive reference text]: https://hexo.io[1]: https://hexo.io/docs/[link text itself]: https://hexo.io/api/ I'm an inline-style link I'm an inline-style link with title I'm a reference-style link I'm a relative reference to a repository file You can use numbers for reference-style link definitions Or leave it empty and use the link text itself Some text to show that the reference links can follow later. Imageshover to see the title text:Inline-style:![alt text](https://hexo.io/icon/favicon-196x196.png "Logo Title Text 1")Reference-style:![alt text][logo][logo]: https://hexo.io/icon/favicon-196x196.png "Logo Title Text 2" hover to see the title text: Inline-style: Reference-style: Code and Syntax HighlightingInline code has back-ticks around it. var s = "JavaScript syntax highlighting";alert(s); s = "Python syntax highlighting"print s No language indicated, so no syntax highlighting.But let's throw in a <b>tag</b>. Tables| |ASCII |HTML ||----------------|-------------------------------|-----------------------------||Single backticks|`'Isn't this fun?'` |'Isn't this fun?' ||Quotes |`"Isn't this fun?"` |"Isn't this fun?" ||Dashes |`-- is en-dash, --- is em-dash`|-- is en-dash, --- is em-dash| ASCII HTML Single backticks 'Isn't this fun?' 'Isn't this fun?' Quotes "Isn't this fun?" "Isn't this fun?" Dashes -- is en-dash, --- is em-dash -- is en-dash, --- is em-dash Colons can be used to align columns. | Tables | Are | Cool || ------------- |:-------------:| -----:|| col 3 is | right-aligned | || col 2 is | centered | || zebra stripes | are neat | Tables Are Cool col 3 is right-aligned col 2 is centered zebra stripes are neat The outer pipes (|) are optional, and you don't need to make the raw Markdown line up prettily. You can also use inline Markdown. Markdown | Less | Pretty--- | --- | ---*Still* | `renders` | **nicely**1 | 2 | 3 Markdown Less Pretty Still renders nicely 1 2 3 You can find more information about LaTeX mathematical expressions here. Blockquotes Blockquotes are very handy in email to emulate reply text.This line is part of the same quote. Quote break. This is a very long line that will still be quoted properly when it wraps. Oh boy let's keep writing to make sure this is long enough to actually wrap for everyone. Oh, you can put Markdown into a blockquote. Horizontal RuleThree or more... ---Hyphens***Asterisks___Underscores Hyphens Asterisks Underscores Line BreaksHere's a line for us to start with.This line is separated from the one above by two newlines, so it will be a *separate paragraph*.This line is also a separate paragraph, but...This line is only separated by a single newline, so it's a separate line in the *same paragraph*. Here's a line for us to start with. This line is separated from the one above by two newlines, so it will be a separate paragraph. This line is also a separate paragraph, but...This line is only separated by a single newline, so it's a separate line in the same paragraph. This is a regular paragraph.<table> <tr> <td>Foo</td> </tr></table>This is another regular paragraph. This is a regular paragraph. Foo This is another regular paragraph. Youtube videos<a href="https://www.youtube.com/watch?feature=player_embedded&v=ARted4RniaU" target="_blank"><img src="https://img.youtube.com/vi/ARted4RniaU/0.jpg"alt="IMAGE ALT TEXT HERE" width="240" height="180" border="10" /></a>Pure markdown version:[![IMAGE ALT TEXT HERE](https://img.youtube.com/vi/ARted4RniaU/0.jpg)](https://www.youtube.com/watch?v=ARted4RniaU) Pure markdown version:","categories":[],"tags":[{"name":"Foo","slug":"foo","permalink":"https://volantis.js.org/tags/foo/"},{"name":"Bar","slug":"bar","permalink":"https://volantis.js.org/tags/bar/"}]},{"title":"","slug":"news/2017-10-24","date":"2017-10-24T00:00:00.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"news/2017-10-24/","link":"","permalink":"https://volantis.js.org/news/2017-10-24/","excerpt":"","text":"Volantis A Wonderful Theme for Hexo Volantis 是一个功能丰富、高度模块化的 Hexo 博客主题。得益于其强大的模块化特性，您可以轻松搭建一个极简风格的博客，也可以仿照官网搭建一个多人协作的、包含文档模块的大体量综合型博客。 开始使用","categories":[{"name":"官方资讯","slug":"官方资讯","permalink":"https://volantis.js.org/categories/%E5%AE%98%E6%96%B9%E8%B5%84%E8%AE%AF/"}],"tags":[]},{"title":"Images","slug":"test/images","date":"2013-12-26T22:46:49.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"test/images/","link":"","permalink":"https://volantis.js.org/test/images/","excerpt":"","text":"This is a image test post. 截屏2020-03-1317.25.10.png 截屏2020-03-1317.27.42.png 截屏2020-03-1317.28.02.png","categories":[],"tags":[]},{"title":"","slug":"test/no-title","date":"2013-12-25T22:57:49.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"test/no-title/","link":"","permalink":"https://volantis.js.org/test/no-title/","excerpt":"","text":"This post doesn't have a title. Make sure it's accessible.","categories":[],"tags":[]},{"title":"Excerpts","slug":"test/excerpts","date":"2013-12-25T00:23:23.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"test/excerpts/","link":"","permalink":"https://volantis.js.org/test/excerpts/","excerpt":"The following contents should be invisible in home/archive page.","text":"The following contents should be invisible in home/archive page. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce eget urna vitae velit eleifend interdum at ac nisi. In nec ligula lacus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Sed eu cursus erat, ut dapibus quam. Aliquam eleifend dolor vitae libero pharetra adipiscing. Etiam adipiscing dolor a quam tempor, eu convallis nulla varius. Aliquam sollicitudin risus a porta aliquam. Ut nec velit dolor. Proin eget leo lobortis, aliquam est sed, mollis mauris. Fusce vitae leo pretium massa accumsan condimentum. Fusce malesuada gravida lectus vel vulputate. Donec bibendum porta nibh ut aliquam. Sed lorem felis, congue non fringilla eu, aliquam eu eros. Curabitur orci libero, mollis sed semper vitae, adipiscing in lectus. Aenean non egestas odio. Donec sollicitudin nisi quis lorem gravida, in pharetra mauris fringilla. Duis sit amet faucibus dolor, id aliquam neque. In egestas, odio gravida tempor dictum, mauris felis faucibus purus, sit amet commodo lacus diam vitae est. Ut ut quam eget massa semper sodales. Aenean non ipsum cursus, blandit lectus in, ornare odio. Curabitur ultrices porttitor vulputate.","categories":[],"tags":[]},{"title":"Videos","slug":"test/videos","date":"2013-12-25T00:19:15.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"test/videos/","link":"","permalink":"https://volantis.js.org/test/videos/","excerpt":"","text":"This is a video test post. Youtube Vimeo","categories":[],"tags":[]},{"title":"Gallery Post","slug":"test/gallery-post","date":"2013-12-25T00:16:18.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"test/gallery-post/","link":"","permalink":"https://volantis.js.org/test/gallery-post/","excerpt":"","text":"This post contains 4 photos: Widescreen wallpaper Portrait photo Dual widescreen wallpaper Small photo All photos should be displayed properly.","categories":[],"tags":[]},{"title":"Tag Plugins","slug":"test/tag-plugins","date":"2013-12-25T00:14:39.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"test/tag-plugins/","link":"","permalink":"https://volantis.js.org/test/tag-plugins/","excerpt":"","text":"This post is used for testing tag plugins. See docs for more info. Block QuoteNormal blockquote Praesent diam elit, interdum ut pulvinar placerat, imperdiet at magna. Quote from a bookDo not just seek happiness for yourself. Seek happiness for all. Through kindness. Through mercy. David LevithanWide Awake Quote from TwitterNEW: DevDocs now comes with syntax highlighting. http://devdocs.io @DevDocstwitter.com/devdocs/status/356095192085962752 Quote from an article on the webEvery interaction is both precious and an opportunity to delight. Seth Godin `http://sethgodin.typepad.com/seths_blog/2009/07/welcome-to-island-marketing.html` Welcome to Island Marketing Code BlockNormal code blockalert('Hello World!'); With captionArray.maparray.map(callback[, thisArg]) With caption and URL.compactUnderscore.js.compact([0, 1, false, 2, ‘’, 3]);=> [1, 2, 3] With marked linesLine 1,7-8,10 should be marked with different color. const http = require('http');const hostname = '127.0.0.1';const port = 1337;http.createServer((req, res) => { res.writeHead(200, { 'Content-Type': 'text/plain' }); res.end('Hello World\\n');}).listen(port, hostname, () => { console.log(`Server running at http://${hostname}:${port}/`);}); Note: Theme's style should support .highlight.line.marked (recommend to use the selection or current line color). Gist jsFiddle PullquoteLeftLorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas tempus molestie arcu, et fringilla mauris placerat ac. Nullam luctus bibendum risus. Ut cursus sed ipsum feugiat egestas. Suspendisse elementum, velit eu consequat consequat, augue lorem dapibus libero, eget pulvinar dolor est sit amet nulla. Suspendisse a porta tortor, et posuere mi. Pellentesque ultricies, mi quis volutpat malesuada, erat felis vulputate nisl, ac congue ante tortor ut ante. Proin aliquam sem vel mauris tincidunt, eget scelerisque tortor euismod. Nulla tincidunt enim nec commodo dictum. Mauris id sapien et orci gravida luctus id ut dui. In vel vulputate odio. Duis vel turpis molestie, scelerisque enim eu, lobortis eros. Cras at ipsum gravida, sagittis ante vel, viverra tellus. Nunc mauris turpis, elementum ullamcorper nisl pretium, ultrices cursus justo. Mauris porttitor commodo eros, ac ornare orci interdum in. Cras fermentum cursus leo sed mattis. In dignissim lorem sem, sit amet elementum mauris venenatis ac. RightLorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ligula justo, lobortis sit amet semper vel, dignissim sit amet libero. Praesent ac tempus ligula. Maecenas at gravida odio. Etiam tristique volutpat lacus eu faucibus. Donec non tempus arcu. Phasellus adipiscing, mauris nec mollis egestas, ipsum nunc auctor velit, et rhoncus lorem ipsum at ante. Praesent et sem in velit volutpat auctor. Duis vel mauris nulla. Maecenas mattis interdum ante, quis sagittis nibh cursus et. Nulla facilisi. Morbi convallis gravida tortor, ut fermentum enim gravida et. Nunc vel dictum nisl, non ultrices libero. Proin vestibulum felis eget orci consectetur lobortis. Vestibulum augue nulla, iaculis vitae augue vehicula, dignissim ultrices libero. Sed imperdiet urna et quam ultrices tincidunt nec ac magna. Etiam vel pharetra elit.","categories":[],"tags":[]},{"title":"www.google.com","slug":"test/link-post-without-title","date":"2013-12-24T23:44:13.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"test/link-post-without-title/","link":"http://www.google.com/","permalink":"https://volantis.js.org/test/link-post-without-title/","excerpt":"","text":"This is a link post without a title. The title should be the link with or without protocol. Clicking on the link should open Google in a new tab or window.","categories":[],"tags":[]},{"title":"日本語テスト","slug":"test/日本語テスト","date":"2013-12-24T23:33:26.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"test/日本語テスト/","link":"","permalink":"https://volantis.js.org/test/%E6%97%A5%E6%9C%AC%E8%AA%9E%E3%83%86%E3%82%B9%E3%83%88/","excerpt":"","text":"This is a Japanese test post. 私は昨日ついにその助力家というのの上よりするたなけれ。 最も今をお話団はちょうどこの前後なかろでくらいに困りがいるたをは帰着考えたなかって、そうにもするでうたらない。 がたを知っないはずも同時に九月をいよいよたありた。 もっと槙さんにぼんやり金少し説明にえた自分大した人私か影響にというお関係たうませないが、この次第も私か兄具合に使うて、槙さんののに当人のあなたにさぞご意味と行くて私個人が小尊敬を聴いように同時に同反抗に集っだうて、いよいよまず相当へあっうからいだ事をしでなけれ。 それでそれでもご時日をしはずはたったいやと突き抜けるますて、その元がは行ったてという獄を尽すていけですた。 この中道具の日その学校はあなたごろがすまなりかとネルソンさんの考えるですん、辺の事実ないというご盲従ありたですと、爺さんのためが薬缶が結果までの箸の当時してならて、多少の十月にためからそういう上からとにかくしましないと触れべきものたで、ないうですと多少お人達したのでたた。 From すぐ使えるダミーテキスト - 日本語 Lorem ipsum","categories":[],"tags":[]},{"title":"中文測試","slug":"test/中文測試","date":"2013-12-24T23:31:30.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"test/中文測試/","link":"","permalink":"https://volantis.js.org/test/%E4%B8%AD%E6%96%87%E6%B8%AC%E8%A9%A6/","excerpt":"","text":"This is a Chinese test post. 善我王上魚、產生資西員合兒臉趣論。畫衣生這著爸毛親可時，安程幾？合學作。觀經而作建。都非子作這！法如言子你關！手師也。 以也座論頭室業放。要車時地變此親不老高小是統習直麼調未，行年香一？ 就竟在，是我童示讓利分和異種百路關母信過明驗有個歷洋中前合著區亮風值新底車有正結，進快保的行戰從：弟除文辦條國備當來際年每小腳識世可的的外的廣下歌洲保輪市果底天影；全氣具些回童但倒影發狀在示，數上學大法很，如要我……月品大供這起服滿老？應學傳者國：山式排只不之然清同關；細車是！停屋常間又，資畫領生，相們制在？公別的人寫教資夠。資再我我！只臉夫藝量不路政吃息緊回力之；兒足灣電空時局我怎初安。意今一子區首者微陸現際安除發連由子由而走學體區園我車當會，經時取頭，嚴了新科同？很夫營動通打，出和導一樂，查旅他。坐是收外子發物北看蘭戰坐車身做可來。道就學務。 國新故。 工步他始能詩的，裝進分星海演意學值例道……於財型目古香亮自和這乎？化經溫詩。只賽嚴大一主價世哥受的沒有中年即病行金拉麼河。主小路了種就小為廣不？ From 亂數假文產生器 - Chinese Lorem Ipsum","categories":[],"tags":[]},{"title":"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam justo turpis, tincidunt ac convallis id.","slug":"test/long-title","date":"2013-12-24T23:31:06.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"test/long-title/","link":"","permalink":"https://volantis.js.org/test/long-title/","excerpt":"","text":"This post has a long title. Make sure the title displayed right.","categories":[],"tags":[]},{"title":"Link Post","slug":"test/link-post","date":"2013-12-24T23:30:04.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"test/link-post/","link":"http://www.google.com/","permalink":"https://volantis.js.org/test/link-post/","excerpt":"","text":"This is a link post. Clicking on the link should open Google in a new tab or window.","categories":[],"tags":[]},{"title":"Elements","slug":"test/elements","date":"2013-12-24T23:29:08.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"test/elements/","link":"","permalink":"https://volantis.js.org/test/elements/","excerpt":"","text":"The purpose of this post is to help you make sure all of HTML elements can display properly. If you use CSS reset, don't forget to redefine the style by yourself. Heading 1Heading 2Heading 3Heading 4Heading 5Heading 6 ParagraphLorem ipsum dolor sit amet, test link consectetur adipiscing elit. Strong text pellentesque ligula commodo viverra vehicula. Italic text at ullamcorper enim. Morbi a euismod nibh. Underline text non elit nisl. Deleted text tristique, sem id condimentum tempus, metus lectus venenatis mauris, sit amet semper lorem felis a eros. Fusce egestas nibh at sagittis auctor. Sed ultricies ac arcu quis molestie. Donec dapibus nunc in nibh egestas, vitae volutpat sem iaculis. Curabitur sem tellus, elementum nec quam id, fermentum laoreet mi. Ut mollis ullamcorper turpis, vitae facilisis velit ultricies sit amet. Etiam laoreet dui odio, id tempus justo tincidunt id. Phasellus scelerisque nunc sed nunc ultricies accumsan. Interdum et malesuada fames ac ante ipsum primis in faucibus. Sed erat diam, blandit eget felis aliquam, rhoncus varius urna. Donec tellus sapien, sodales eget ante vitae, feugiat ullamcorper urna. Praesent auctor dui vitae dapibus eleifend. Proin viverra mollis neque, ut ullamcorper elit posuere eget. Praesent diam elit, interdum ut pulvinar placerat, imperdiet at magna. Maecenas ornare arcu at mi suscipit, non molestie tortor ultrices. Aenean convallis, diam et congue ultricies, erat magna tincidunt orci, pulvinar posuere mi sapien ac magna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Praesent vitae placerat mauris. Nullam laoreet ante posuere tortor blandit auctor. Sed id ligula volutpat leo consequat placerat. Mauris fermentum dolor sed augue malesuada sollicitudin. Vivamus ultrices nunc felis, quis viverra orci eleifend ut. Donec et quam id urna cursus posuere. Donec elementum scelerisque laoreet. List TypesDefinition List (dl)Definition List TitleThis is a definition list division. Ordered List (ol) List Item 1 List Item 2 List Item 3 Unordered List (ul) List Item 1 List Item 2 List Item 3 Checkbox List (ul) List Item 1 unchecked List Item 2 checked List Item 3 checked Table Table Header 1 Table Header 2 Table Header 3 Division 1 Division 2 Division 3 Division 1 Division 2 Division 3 Division 1 Division 2 Division 3 Misc Stuff - abbr, acronym, sub, sup, kbd, etc.Lorem superscript dolor subscript amet, consectetuer adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. cite. Nunc iaculis suscipit dui. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus. Maecenas ornare tortor. Donec sed tellus eget sapien fringilla nonummy. NBA Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus. AVE. Use Crtl + C to stop.","categories":[],"tags":[]},{"title":"Hello World","slug":"test/hello-world","date":"2013-12-24T17:49:32.000Z","updated":"2021-05-17T08:08:37.075Z","comments":true,"path":"test/hello-world/","link":"","permalink":"https://volantis.js.org/test/hello-world/","excerpt":"","text":"Welcome to Hexo! This is your very first post. Check documentation to learn how to use.","categories":[],"tags":[]}],"categories":[{"name":"开发心得","slug":"开发心得","permalink":"https://volantis.js.org/categories/%E5%BC%80%E5%8F%91%E5%BF%83%E5%BE%97/"},{"name":"进阶玩法","slug":"进阶玩法","permalink":"https://volantis.js.org/categories/%E8%BF%9B%E9%98%B6%E7%8E%A9%E6%B3%95/"},{"name":"官方资讯","slug":"官方资讯","permalink":"https://volantis.js.org/categories/%E5%AE%98%E6%96%B9%E8%B5%84%E8%AE%AF/"}],"tags":[{"name":"Foo","slug":"foo","permalink":"https://volantis.js.org/tags/foo/"},{"name":"Bar","slug":"bar","permalink":"https://volantis.js.org/tags/bar/"}]} \ No newline at end of file diff --git a/contributors/index.html b/contributors/index.html index 7f82603a1..caecb016f 100644 --- a/contributors/index.html +++ b/contributors/index.html @@ -1,7 +1,7 @@ 鸣谢项目和社区贡献者 - Volantis

Volantis

中文创作者社区

博客

文档

示例

帮助

鸣谢

归档

源码

鸣谢项目和社区贡献者

Volantis Team

发布于：2021年5月11日

次浏览

Volantis 社区的发展离不开团队大佬们的无私奉献和社区小伙伴们的热情互助。每一个心怀梦想、有着独特见解的朋友都可以成为团队的一员。目前 Volantis 社区正处于建设初期，我们缺少各方面的人才，如果您使用主题至少一个月且长期活跃于社区，例如：

  • 解答 issues / discussions
  • 提交有效的建议
  • 官网文档补全/纠错
  • 发现并收录有意思的文章（搭建博客方面）到官网

我们非常欢迎您的加入，请在论坛发帖告诉我们。

感谢开发者

感谢社区建设者

如何参与社区建设

社区建设主要包括 Issues Discussions(论坛) 官网博客收录 官网文档维护 几个方面。

如何维护文档

目前 Volantis 4.x 已是已知的 Hexo 主题中文档最全面的，但仍有部分功能缺少明确的文档、部分文档已经过时，如果您发现了遗漏或者错误之处，我们非常希望您能够帮忙完善一下。

Volantis 官网支持 CI ，您可以直接在线编辑源码：

在线编辑文档

https://github.com/volantis-x/community/tree/master/source

如何收录博客

每位用户在使用或更新主题的时候都需要阅读官网的文档，收录的相关内容能帮助用户更高效地上手，同时也能够提高被收录的文章的曝光率。如果在官网能看到更多的有价值的文章，就会有更多 Volantis 用户或者非 Volantis 用户来访问。

如果您有或者发现了与 Hexo 博客搭建相关的文章，可以转载外链到 Volantis 官网，示例如下：

_posts/blogs/2020-05-17-pjax.md
---
title: Volantis 主题部署 Pjax
date: 2020-05-17
updated: 2020-08-07
categories: [开发心得]
author: inkss
link: https://inkss.cn/blog/76993423/
description: 本篇文章记录了我对 Volantis 主题做 Pjax 兼容的种种，大抵算是种记录吧~
headimg: # 可以设置文章头图
backup: https://archive.vn/U36NG # 将页面存档到 archive.tody 网页快照档案馆的存档链接 https://archive.tody
---

如果这篇文章的作者是第一次出现在官网，还需要在 _data/author.yml 文件中添加作者信息，例如：

_data/author.yml
...
inkss:
  name: 枋柚梓
  avatar: https://cdn.jsdelivr.net/gh/inkss/common@1.4.2/hexo/img/static/avatar.jpg
  url: https://inkss.cn

注意事项

  1. 文章存放在 _posts/blogs/ 目录中，且文件名格式为「年-月-日-文章话题」。
  2. 鼓励原创文章，摘要部分300字符以内。如果想不出摘要可以不写，不要在摘要里重复一遍文章标题。
  3. 最好选择一个文章分类，如果现有的分类中没有合适的，可以自己新增。
  4. 如果有文章头图，请确保图片内最多只有一个单词或短语，图片不清晰或者与文章无关的话不建议使用。
  5. 不仅限于自己的文章，可以在征得文章作者同意的情况下将其链接收录到官网。

在线编辑文档

https://github.com/volantis-x/community/tree/master/source/_posts/blogs

本页文档最后更新于：2021年5月11日