6.0 KiB
title | top | categories | status | |
---|---|---|---|---|
Cosy 入门 | 2 |
|
doing |
Hexo 安装主题
Hexo
主题的安装方式非常简单,只需将主题 Hexo-theme-cosy
复制目录的 themes
目录下,然后在 Hexo
的 _config.yml
中修改下主题配置即可
# 找到 theme 配置项
theme: Hexo-theme-cosy
获取 Cosy
hexo配置
在 Hexo
的 _config.yml
中调整
基础配置
# 网页标题
title: 17px blog
# 侧边栏顶部显示
subtitle: "Mozzie"
# 用于SEO的html元描述
description: ""
# 用于SEO的html关键字
keywords:
# 文章版权声明显示作者名称
author: Mozzie
# 在此处设置您的网站url
url: https://mozzie.cn
语言
你可以在 hexo-theme-cosy/languages
中找到不同的语言文件,如果想切换语言,在配置文件中,填入 yml
的文件名
language: en
文章语法高亮
关闭hexo默认的highlight.js语法高亮
highlight:
enable: false
line_number: true
auto_detect: false
tab_replace: ""
wrap: true
hljs: false
prismjs:
enable: true
preprocess: true
line_number: true
line_threshold: 0
tab_replace: ""
Cosy 主题配置
下面的配置基于 Hexo-theme-cosy
下的 _config.yml
文章分类图标
按照顺序,依次设置 svg
图标,可以在 xicon 方面的获取丰富的图标
postCategoryIcons:
- <svg>...</svg>
- <svg>...</svg>
- <svg>...</svg>
网站图标 favicon
- 支持
svg
- 支持
图片url
,如:/img/favicon.png
favicon: ''
ICP备案号
😁 如不需要备案号,可直接删除
icp: 苏ICP备xxxxxxx号-x
首页底部文字
😁 如不需要,可直接删除,或者改为 false
motto: false
文章版权申明
默认开启,当 enable: false
,默认关闭
postCopyright:
enable: true
license: CC BY-NC-SA 4.0
license_url: https://creativecommons.org/licenses/by-nc-sa/4.0/
katex 数学公式
可自行配置 cdn
katex:
enable: true
jsCdn: //cdn.jsdelivr.net/npm/katex@0.13.18/dist/katex.min.js
cssCdn: //cdn.jsdelivr.net/npm/katex@0.13.18/dist/katex.min.css
mermaid 流程图
在撰写时,请使用 {% mermaid %}
和 {% endmermaid %}
包裹
{% mermaid %}
graph TD;
A --> B;
A --> C;
B --> D;
C --> D;
{% endmermaid %}
相应配置如下
mermaid:
enable: true
cdn: //cdn.jsdelivr.net/npm/mermaid@10.4.0/dist/mermaid.min.js
valine 文章评论
首先需要注册 LeanCloud
国际区用户,创建数据库
请根据相关地区法规,酌情
valine:
enable: true
# 替换
appId: appId
# 替换
appKey: appKey
avatar: monsterid
cdn: //unpkg.com/valine@latest/dist/Valine.min.js
# 替换
serverURLs: //xxxxxxxx.api.lncldglobal.com
algolia搜索
博客自带的本地搜索,基于前端开发,存在或多或少的问题,建议换成 algolia
,免费账户 总共有 10,000
条记录,每月有 100,000
的操作数
注册 & 获取 Key
-
创建一个新的
Index
,例如hex-blog
-
复制并保存:
- Application ID
- Search-Only API Key
- Admin API Key
- Usage API Key
- 替换配置
在 Hexo
的 _config.yml
中加入
algolia:
# 替换
appId: Application ID
# 替换
apiKey: Usage API Key
# 请勿泄露,用于上报,替换
adminApiKey: Admin API Key
# 替换
SearchOnlyAPIKey: Search-Only API Key
chunkSize: 5000
# 替换
indexName: hex-blog
fields:
- content:strip
- categories
- date
- permalink
- slug
- tags
- title
安装 hexo-algoliasearch
这是 Hexo 博客帖子索引插件,自动化提交索引到 Algolia
如出遇到问题,可阅读 hexo-algoliasearch 仓库 最新说明
安装命令:
npm install hexo-algoliasearch --save
使用 algolia
在每次博客发布之前,进行索引上传的操作,命令通常如下
hexo clean
hexo generate
hexo algolia
🇨🇳 和风天气 Widget
Cosy 主要针对国内用户,在首页集成了和风天气的卡片,通过 和风天气开发服务 注册
注册完成后,在配置中填入你的 appKey
和 cityCode(城市代码)
weather:
enable: true
# 替换
cityCode: cityCode
appKey: appKey
其中 cityCode
可以在 官方的地区列表仓库 中的 China-City-List-latest.csv
找到你所在城市的 cityCode
前置元数据
在 Hexo 的 Markdown 文件中,一个典型的 YAML 格式的 Front Matter
可能会是这样的:
---
title: 我的文章标题
categories:
- javascript
tags:
- 编程
- JavaScript
---
top
实现文章置顶的功能,给定一个数值,可以进行排序,设定了 top
元数据的文章,会在分类列表中,使用 📌 标记
例如有三篇文章:
- 文章1
---
title: 文章1
top: 0
categories:
- javascript
tags:
- 编程
- JavaScript
---
- 文章2
---
title: 文章2
top: 1
categories:
- javascript
tags:
- 编程
- JavaScript
---
- 文章3
---
title: 文章3
categories:
- javascript
tags:
- 编程
- JavaScript
---
那么在 javascript
分类下,排序的顺序依次为:文章1 > 文章2 > 文章3
status
用于区分文章的状态,同时利用文章分类列表的筛选
,进行快速筛选,Cosy 主题内置了 4 种状态
- done:完成
- doing:进行中
- todo:待办
- other:废弃
例如:
---
title: 文章1
categories:
- javascript
status: done
---