修改 _layout.ejs
打开 themes/主题名称/layout/layout.ejs
在body标签内添加一个js引用，即< /body>之前添加代码，不要放在< /head>后。
1
2
3
4
| <% if (theme.canvas_nest) { %>
<script type="text/javascript"
color="0,0,0" opacity='0.4' zIndex="-2" count="88" src="//cdn.bootcss.com/canvas-nest.js/1.0.0/canvas-nest.min.js"></script>
<% } %>
|
可参照自己所用主题的 layout.ejs 中有 if 的那部分代码。
配置项说明
1
2
3
4
| color：线条颜色, 默认：'0,0,0'；三个数字分别为（R,G,B）
opacity：线条透明度（0~1）, 默认：0.5
count：线条的总数量，默认：150
zIndex：背景的z-index属性，css属性用于控制所在层的位置，默认：-1
|
修改配置文件
打开themes/主题名称/_config.yml，随意找一行，添加代码：
1
2
3
4
5
6
| # --------------------------------------------------------------
# background settings
# --------------------------------------------------------------
# add canvas-nest effect
# see detail from https://github.com/hustcc/canvas-nest.js
canvas_nest: true
|
然后运行hexo s，在浏览器的地址栏输入localhost:4000就能看到效果了。
参考：**距离**
