# hexo 配置文档
# hexo 基本配置
hexo 基本配置
# hexo 主题选择
因为也想整一个好看的静态 blog 站,挑了好久,终于找到了这个主题
在此感谢!hexo-theme-shoka
# hexo 主题安装依赖安装
主题从 git clone 下来,才是开始,还要安装需要的依赖,但是安装过程并不顺利,因为各自的环境总会有些差异。
需要安装那些依赖主题站有中文文档
Theme Shoka 依赖以下 Hexo 插件
插件名称 | npm 地址 | 功能 | 依赖程度 |
---|---|---|---|
hexo-renderer-multi-markdown-it | 链接 | md 文件渲染器,压缩 css/js/html | 必需 |
hexo-autoprefixer | 链接 | 给生成的 css 文件们添加浏览器前缀 | 必需 |
hexo-algoliasearch | 链接 | 站内搜索功能 | 搜索按钮失灵 |
hexo-symbols-count-time | 链接 | 文章或站点字数及阅读时间统计 | 统计没有 |
hexo-feed | 链接 | 生成 Feed 文件 | Feed 文件没有 |
安装完以上插件后,修改站点配置文件,加入相关配置。
用 npm 安装必须的 hexo-renderer-multi-markdown-it 后,渲染的页面不完整,和主题的效果相差甚远。
npm un hexo-renderer-marked --save #首先卸载原本的文本渲染器 | |
npm i hexo-renderer-multi-markdown-it --save #安装 |
也可使用 cnpm 安装
npm install -g cnpm –registry=http://registry.npm.taobao.org #安装 cnpm 管理器 | |
cnpm i hexo-renderer-multi-markdown-it –save #用 cnpm 重新安装 |
# 主题基本配置
可跳转至主题作者的 theme-shoka-doc 查看详情配置
- 基本配置
- 界面显示
- 特殊功能
这里记录一些简单配置
# 文章配置
--- | |
title: 文章标题 | |
#置顶开关 | |
sticky: true | |
#文章封面图 | |
cover: assets/wallpaper-2572384.jpg | |
# 或者写成 | |
cover: http://placehold.it/350x150.jpg | |
--- |
# Valine 配置
Valine 是一款基于 LeanCloud 的快速、简洁且高效的无后端评论系统。
注册创建应用简单,拿到 appId 和 appKey, 填到主题的配置中就行了
如何获取 LeanCloud 的 appId 和 appKey
valine: | |
appId: #Your_appId | |
appKey: #Your_appkey | |
placeholder: ヽ(○´∀`)ノ♪ # Comment box placeholder | |
avatar: mp # Gravatar style : mp, identicon, monsterid, wavatar, robohash, retro | |
pageSize: 10 # Pagination size | |
lang: zh-CN | |
visitor: true # Article reading statistic | |
NoRecordIP: false # Whether to record the commenter IP | |
serverURLs: # When the custom domain name is enabled, fill it in here (it will be detected automatically by default, no need to fill in) | |
powerMode: true | |
tagMeta: | |
visitor: 新朋友 | |
master: 主人 | |
friend: 小伙伴 | |
investor: 金主粑粑 | |
tagColor: | |
master: "var(--color-orange)" | |
friend: "var(--color-aqua)" | |
investor: "var(--color-pink)" | |
tagMember: | |
master: | |
# - hash of master@email.com | |
# - hash of master2@email.com | |
friend: | |
# - hash of friend@email.com | |
# - hash of friend2@email.com | |
investor: | |
# - hash of investor1@email.com |
本地测试问题不大,但是在线上,需要在 LeanCloud 设置安全域名
控制台 => 设置 => 安全中心 => 设置 Web 安全域名
# algolia 配置
Algolia 是一家为网站与移动应用提供托管式搜索 API
同样注册创建
需要注意的是,需要创建一个有权限的 apiKey,能给的都给
补充:由于 algolia 服务到期,搜索提示超出配额,并且影响到评论功能无法正确显示。
algolia: | |
appId: #Your appId | |
apiKey: #Your apiKey | |
adminApiKey: #Your adminApiKey | |
chunkSize: 5000 | |
indexName: "amber" | |
fields: | |
- title #必须配置 | |
- path #必须配置 | |
- categories #推荐配置 | |
- content:strip:truncate,0,2000 | |
- gallery | |
- photos | |
- tags |
fields 中的 title 和 path 必须在文章的 md 设置 (path 会自动生成)
通过 hexo 命令创建文章,会自动生成 md 文件
hexo new "*****" |
最后在执行以下命令,生成索引
hexo algolia |
# live2d
给个人站点添加喜欢的 live2d 形象
首先安装 hexo-helper-live2d
npm i hexo-helper-live2d --save |
然后到 jsdelivr 查找自己喜欢的 live2d 形象
npm i live2d-widget-model-nico --save | |
npm i live2d-widget-model-aoba --save #青叶的 lvie2d 有的包不完整需要自己修改源文件 |
然后把配置写入 _config.yml 根据需要修改
## Live2D 看板娘 | |
live2d: | |
enable: true #启用 | |
scriptFrom: local | |
pluginRootPath: live2dw/ #生成的静态目录 | |
pluginJsPath: lib/ | |
pluginModelPath: assets/ | |
tagMode: false | |
debug: false | |
model: | |
use: live2d-widget-model-aoba #自己安装的 live2d | |
display: | |
position: left #形象的定位左 右 | |
width: 300 #大小 | |
height: 600 | |
mobile: | |
show: false #手机版是否显示 | |
react: | |
opacity: 1 #透明度 |
# 遇到的问题
- npm 安装时可能网络原因,无法安装 可以切换中国镜像
hexo-theme-shoka 主题因为作者许久未更新,部分方法过时报错(新版本主题无此问题)
err: TypeError: yaml.Load is not a function
原因是最新版的 js-yaml 不支持 safeLoad 方法了,搜索一下主题目录里全部的 safeLoad,大概有三处,改成 load
分别在 config.js links.js 和 media.js 文件里