主题

配置教程

主题为butterfly
butterfly主题的JC配置教程

1
2
3
4
$ hexo clean(非必要)
$ hexo g
$ hexo d
$ hexo s(本地部署)

模块详解

留言板

目前用的是valine系统。
基于LeanCloud支持,我用的是国际版,还算比较方便。
留言时不必注册登录账号,想说什么可以直接说。

音乐电影

基于hexo-tag-aplayerhexo-tag-dplayer。参考GitHub的md还是搞不懂具体的配置流程,所以暂且搁置下了额。

原footer背景不舒服,改成了背景渐变式:以butterfly2.2.5为例,butterfly.yml的inject-head模块中引入https://cdn.jsdelivr.net/gh/sviptzk/HexoStaticFile@master/Hexo/css/footer.min.css

iconfont

iconfont挑选图标,放到购物车,然后添加到自己的项目中(没有项目就新建一个,没有用户就注册一个),进入项目,点击Font class,按照提示点一下更新之后,复制css,前面加上https:,添加到如上footer同样位置的地方,之后就可以引用自己项目中的iconfont啦!

  • 方法:原fa fa-xxx改成iconfont icon-xxx

每次更新完项目库都要替换原来的css哦~如果嫌麻烦,可以一次性把所有感觉日后可能用到的图标都添加上。

字体

此篇文章仅针对butterfly主题所写,其他主题则仅供参考。

废话不多说,直接上教程

  1. 字体仓库找个好看的字体(或者你自己有字体文件)。
  2. 转换网站把你的字体文件转换成css。
  3. 把css引入博客,插到inject里面。
  4. 把butterfly配置文件里的font-family改成与css相对应的字体。

post页

文章头

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
title:                     //标题
cover: //封面
description: //简述
tags: //标签
tags:[1,2] //多个同级标签(无父子级标签)
categories: //分类
categories:[1,2] //多个同级分类
categories:
- 1
- 2 //父子级分类(还可以往下加3、4、5······∞)
top: //置顶(true/false)
hidden: //隐藏(true/false)
password: //密码(如果不设置,最后三项都不必填写)
message: //密码输入框信息
wrong_pass_message: //密码错误弹窗信息

标签多样化

1
2
3
{% note 标签背景 %} #标签背景:default、primary、success、info、warning、danger.
要输入的文本. #更改标签背景色,到butterfly.yml里面的note模块修改。
{% endnote %}

default

primary

success

info

warning

danger

图片

图床

  1. 公共图床:imgchr,不注册就能上传图片,外链很方便,无水印,全球CDN。
  2. 私人图床:GitHub+jsDelivr

相对路径方法

  • plugin式
1
hexo new 哈喽,沃德

输入后,_posts 文件夹下面会出现 哈喽,沃德.md 和 哈喽,沃德 文件夹,把图片放到文件夹中,在 md 里面这样写:

1
{% asset_img 某图片.后缀名 图片展示的名字 %}
  • Markdown式

在主题source文件夹下新建photos文件夹专门用于放置文章图片,在md里面引用:

1
![图片名](/photos/图片名.后缀名)

右键新建Markdown

以typora为例:
新建txt,输入以下代码,保存后关闭,后缀名改成reg,双击导入注册表。

1
2
3
4
5
6
7
Windows Registry Editor Version 5.00
[HKEY_CLASSES_ROOT\.md]
@="Typora.exe"
[HKEY_CLASSES_ROOT\.md\ShellNew]
"NullFile"=""
[HKEY_CLASSES_ROOT\Typora.exe]
@="Markdown"