如果想DIY美化和魔改,基本上都涉及到自定义CSS和JS文件。如果直接修改主题文件,下次更新主题涉及大更新的时候,可能修改的地方就无效了。
主题来自:安知鱼Docs / Butterfly

创建文件

在博客的根目录下的 source 文件夹,还有一个是 themessource 文件夹(来自主题,但是不推荐放在那里)

在里面创建好所需要的文件夹,例如css、js、img、fonts等等这些文件夹,还有其他的配置文件可以自行创建。

Hexo

我这里为了不要这么乱,所以把所有DIY文件归类到config 目录下

引用自定义文件

直接在主题的配置文件即可,我的安知鱼主题文件为 _config.anzhiyu.yml / Butterfly的配置为 _config.butterfly.yml ,如果没有在根目录下创建过配置文件,可以在主题文件下找到 _config.yml

在主题配置文件中找到配置inject

css文件一般在 head 引入,js文件一般在 bottom引入,特色情况除外。

1
2
3
4
5
6
7
8
9
10
11
# Inject
# Insert the code to head (before '</head>' tag) and the bottom (before '</body>' tag)
# 插入代码到头部 </head> 之前 和 底部 </body> 之前
inject:
head:
# 自定义css
# - <link rel="stylesheet" href="/css/custom.css" media="defer" onload="this.media='all'">

bottom:
# 自定义js
# - <script src="/js/xxx"></script>

如果引入多个文件可以往后添加一行

1
2
3
4
head:
# 自定义css
- <link rel="stylesheet" href="/css/custom.css">
- <link rel="stylesheet" href="/css/fonts.css">