关于主题的一些魔改

数据不备份，魔改两行泪

我的开源工具

同款封面制作

压缩率很强的图床

自定义CSS

本站样式大部分为覆盖展示，不轻易修改主题文件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
/* 隐藏点赞 */
/* 引用链接隐藏外部提示 */
.tk-action .tk-action-link:first-child,
.tag-link-tips {
    display: none!important;
}

/* 手机端搜索栏样式 */
@media screen and (max-width: 768px), (max-height: 580px) {
    .search-dialog {
        top: 2rem!important;
        left: 5%!important;
        width: 90%!important;
        height: auto!important;
        border-radius: 10px!important;
    }
}

/* 首页文章的标签位置 */
#recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap {
    bottom: 15px!important;
}

/* 优化关于界面人生图片 */
img.author-content-img.no-lightbox.entered.loaded {
    filter: blur(0) brightness(.8);
}

/* 轮播下面导航栏分类优化 */
#catalog-list,
anzhiyu.barrageContent {
    scrollbar-width: none;
}

/* 优化文章顶部分类和标签显示异常 */
#post-firstinfo .meta-firstline span.post-meta-categories a.post-meta-categories {
    background: rgb(107 107 107 / 50%)!important;
}

#post #post-info #post-firstinfo .meta-firstline .article-meta__tags {
    color: #888!important;
}

/* 优化手机端文章页面边角露底色 */
@media screen and (max-width: 768px) {
    .post .layout#content-inner {
        background: transparent;
    }
}

/* 代码块的边框显示优化 */
#article-container figure.highlight {
    border: var(--style-border);
}

/* 手机端nav栏 */
#sidebar #sidebar-menus {
    padding-top: 10px!important;
}

/* 擦亮效果 */
#recent-posts > .recent-post-item:not(a)::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 200%;
    background: linear-gradient(to right, transparent, white, transparent);
    transform: translateX(-200%);
    transition: transform 0.5s linear;
    z-index: 1;
}

#recent-posts > .recent-post-item:not(a):hover::before {
    transform: translateX(100%) skewX(-60deg);
}

/* Twikoo*/
/* 评论框背景图优化 */
.twikoo .el-input__inner,
.twikoo .el-textarea__inner {
    transition: background-position-y 0.3s ease-in-out 0s !important;
}

.twikoo .el-input__inner:focus,
.twikoo .el-textarea__inner:focus {
    background-position-y: 350px;
}

.tk-input .el-textarea__inner {
    -moz-background-size: contain;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    background-size: contain
}

/* 评论回复 */
.tk-action-link {
    border-radius: 10px;
    padding: 5px 10px 5px 10px;
    border: var(--style-border);
}

.tk-action-link:hover {
    background: var(--anzhiyu-theme);
    color: #fff;
}

/* 评论后台优化 */
#body-wrap.page .el-input__inner {
    background: #ffffff0f;
}

[data-theme=dark] details > summary {
    background: none!important;
}

统计页面

效果如下，具体我已经忘记是看谁的文章了

第一步：添加charts.js

主题目录 /themes/anzhiyu/scripts/helpers 下添加一个 charts.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
// charts.js
const cheerio = require('cheerio')
const moment = require('moment')

hexo.extend.filter.register('after_render:html', function (locals) {
  const $ = cheerio.load(locals)
  const post = $('#posts-chart')
  const tag = $('#tags-chart')
  const category = $('#categories-chart')
  const htmlEncode = false

  if (post.length > 0 || tag.length > 0 || category.length > 0) {
    if (post.length > 0 && $('#postsChart').length === 0) {
      if (post.attr('data-encode') === 'true') htmlEncode = true
      post.after(postsChart(post.attr('data-start')))
    }
    if (tag.length > 0 && $('#tagsChart').length === 0) {
      if (tag.attr('data-encode') === 'true') htmlEncode = true
      tag.after(tagsChart(tag.attr('data-length')))
    }
    if (category.length > 0 && $('#categoriesChart').length === 0) {
      if (category.attr('data-encode') === 'true') htmlEncode = true
      category.after(categoriesChart(category.attr('data-parent')))
    }

    if (htmlEncode) {
      return $.root().html().replace(/&#/g, '&#')
    } else {
      return $.root().html()
    }
  } else {
    return locals
  }
}, 15)

function postsChart (startMonth) {
  const startDate = moment(startMonth || '2020-01')
  const endDate = moment()

  const monthMap = new Map()
  const dayTime = 3600 * 24 * 1000
  for (let time = startDate; time <= endDate; time += dayTime) {
    const month = moment(time).format('YYYY-MM')
    if (!monthMap.has(month)) {
      monthMap.set(month, 0)
    }
  }
  hexo.locals.get('posts').forEach(function (post) {
    const month = post.date.format('YYYY-MM')
    if (monthMap.has(month)) {
      monthMap.set(month, monthMap.get(month) + 1)
    }
  })
  const monthArr = JSON.stringify([...monthMap.keys()])
  const monthValueArr = JSON.stringify([...monthMap.values()])

  return `
  <script id="postsChart">
    var color = document.documentElement.getAttribute('data-theme') === 'light' ? '#4c4948' : 'rgba(255,255,255,0.7)'
    var postsChart = echarts.init(document.getElementById('posts-chart'), 'light');
    var postsOption = {
      title: {
        text: '文章发布统计图',
        x: 'center',
        textStyle: {
          color: color
        }
      },
      tooltip: {
        trigger: 'axis'
      },
      xAxis: {
        name: '日期',
        type: 'category',
        boundaryGap: false,
        nameTextStyle: {
          color: color
        },
        axisTick: {
          show: false
        },
        axisLabel: {
          show: true,
          color: color
        },
        axisLine: {
          show: true,
          lineStyle: {
            color: color
          }
        },
        data: ${monthArr}
      },
      yAxis: {
        name: '文章篇数',
        type: 'value',
        nameTextStyle: {
          color: color
        },
        splitLine: {
          show: false
        },
        axisTick: {
          show: false
        },
        axisLabel: {
          show: true,
          color: color
        },
        axisLine: {
          show: true,
          lineStyle: {
            color: color
          }
        }
      },
      series: [{
        name: '文章篇数',
        type: 'line',
        smooth: true,
        lineStyle: {
            width: 0
        },
        showSymbol: false,
        itemStyle: {
          opacity: 1,
          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
            offset: 0,
            color: 'rgba(128, 255, 165)'
          },
          {
            offset: 1,
            color: 'rgba(1, 191, 236)'
          }])
        },
        areaStyle: {
          opacity: 1,
          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
            offset: 0,
            color: 'rgba(128, 255, 165)'
          }, {
            offset: 1,
            color: 'rgba(1, 191, 236)'
          }])
        },
        data: ${monthValueArr},
        markLine: {
          data: [{
            name: '平均值',
            type: 'average',
            label: {
              color: color
            }
          }]
        }
      }]
    };
    postsChart.setOption(postsOption);
    window.addEventListener('resize', () => {
      postsChart.resize();
    });
    postsChart.on('click', 'series', (event) => {
      if (event.componentType === 'series') window.location.href = '/archives/' + event.name.replace('-', '/');
    });
  </script>`
}

function tagsChart (len) {
  const tagArr = []
  hexo.locals.get('tags').map(function (tag) {
    tagArr.push({ name: tag.name, value: tag.length, path: tag.path })
  })
  tagArr.sort((a, b) => { return b.value - a.value })

  const dataLength = Math.min(tagArr.length, len) || tagArr.length
  const tagNameArr = []
  for (let i = 0; i < dataLength; i++) {
    tagNameArr.push(tagArr[i].name)
  }
  const tagNameArrJson = JSON.stringify(tagNameArr)
  const tagArrJson = JSON.stringify(tagArr)

  return `
  <script id="tagsChart">
    var color = document.documentElement.getAttribute('data-theme') === 'light' ? '#4c4948' : 'rgba(255,255,255,0.7)'
    var tagsChart = echarts.init(document.getElementById('tags-chart'), 'light');
    var tagsOption = {
      title: {
        text: 'Top ${dataLength} 标签统计图',
        x: 'center',
        textStyle: {
          color: color
        }
      },
      tooltip: {},
      xAxis: {
        name: '标签',
        type: 'category',
        nameTextStyle: {
          color: color
        },
        axisTick: {
          show: false
        },
        axisLabel: {
          show: true,
          color: color,
          interval: 0
        },
        axisLine: {
          show: true,
          lineStyle: {
            color: color
          }
        },
        data: ${tagNameArrJson}
      },
      yAxis: {
        name: '文章篇数',
        type: 'value',
        splitLine: {
          show: false
        },
        nameTextStyle: {
          color: color
        },
        axisTick: {
          show: false
        },
        axisLabel: {
          show: true,
          color: color
        },
        axisLine: {
          show: true,
          lineStyle: {
            color: color
          }
        }
      },
      series: [{
        name: '文章篇数',
        type: 'bar',
        data: ${tagArrJson},
        itemStyle: {
          borderRadius: [5, 5, 0, 0],
          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
            offset: 0,
            color: 'rgba(128, 255, 165)'
          },
          {
            offset: 1,
            color: 'rgba(1, 191, 236)'
          }])
        },
        emphasis: {
          itemStyle: {
            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
              offset: 0,
              color: 'rgba(128, 255, 195)'
            },
            {
              offset: 1,
              color: 'rgba(1, 211, 255)'
            }])
          }
        },
        markLine: {
          data: [{
            name: '平均值',
            type: 'average',
            label: {
              color: color
            }
          }]
        }
      }]
    };
    tagsChart.setOption(tagsOption);
    window.addEventListener('resize', () => {
      tagsChart.resize();
    });
    tagsChart.on('click', 'series', (event) => {
      if(event.data.path) window.location.href = '/' + event.data.path;
    });
  </script>`
}

function categoriesChart (dataParent) {
  const categoryArr = []
  let categoryParentFlag = false
  hexo.locals.get('categories').map(function (category) {
    if (category.parent) categoryParentFlag = true
    categoryArr.push({
      name: category.name,
      value: category.length,
      path: category.path,
      id: category._id,
      parentId: category.parent || '0'
    })
  })
  categoryParentFlag = categoryParentFlag && dataParent === 'true'
  categoryArr.sort((a, b) => { return b.value - a.value })
  function translateListToTree (data, parent) {
    let tree = []
    let temp
    data.forEach((item, index) => {
      if (data[index].parentId == parent) {
        let obj = data[index];
        temp = translateListToTree(data, data[index].id);
        if (temp.length > 0) {
          obj.children = temp
        }
        if (tree.indexOf())
          tree.push(obj)
      }
    })
    return tree
  }
  const categoryNameJson = JSON.stringify(categoryArr.map(function (category) { return category.name }))
  const categoryArrJson = JSON.stringify(categoryArr)
  const categoryArrParentJson = JSON.stringify(translateListToTree(categoryArr, '0'))

  return `
  <script id="categoriesChart">
    var color = document.documentElement.getAttribute('data-theme') === 'light' ? '#4c4948' : 'rgba(255,255,255,0.7)'
    var categoriesChart = echarts.init(document.getElementById('categories-chart'), 'light');
    var categoryParentFlag = ${categoryParentFlag}
    var categoriesOption = {
      title: {
        text: '文章分类统计图',
        x: 'center',
        textStyle: {
          color: color
        }
      },
      legend: {
        top: 'bottom',
        data: ${categoryNameJson},
        textStyle: {
          color: color
        }
      },
      tooltip: {
        trigger: 'item'
      },
      series: []
    };
    categoriesOption.series.push(
      categoryParentFlag ?
      {
        nodeClick :false,
        name: '文章篇数',
        type: 'sunburst',
        radius: ['15%', '90%'],
        center: ['50%', '55%'],
        sort: 'desc',
        data: ${categoryArrParentJson},
        itemStyle: {
          borderColor: '#fff',
          borderWidth: 2,
          emphasis: {
            focus: 'ancestor',
            shadowBlur: 10,
            shadowOffsetX: 0,
            shadowColor: 'rgba(255, 255, 255, 0.5)'
          }
        }
      }
      :
      {
        name: '文章篇数',
        type: 'pie',
        radius: [30, 80],
        roseType: 'area',
        label: {
          color: color,
          formatter: '{b} : {c} ({d}%)'
        },
        data: ${categoryArrJson},
        itemStyle: {
          emphasis: {
            shadowBlur: 10,
            shadowOffsetX: 0,
            shadowColor: 'rgba(255, 255, 255, 0.5)'
          }
        }
      }
    )
    categoriesChart.setOption(categoriesOption);
    window.addEventListener('resize', () => {
      categoriesChart.resize();
    });
    categoriesChart.on('click', 'series', (event) => {
      if(event.data.path) window.location.href = '/' + event.data.path;
    });
  </script>`
}

第二步：插入JS到Inject

_config.anzhiyu.yml文件中搜 Inject插入到bottom

1
<script src="https://lib.baomitu.com/echarts/4.9.0-rc.1/echarts.min.js"></script>

例子：

1
2
3
4
5
6
7
# Inject
# Insert the code to head (before '</head>' tag) and the bottom (before '</body>' tag)
# 插入代码到头部 </head> 之前 和 底部 </body> 之前
inject:
  head:
  bottom:
      - <script src="https://lib.baomitu.com/echarts/4.9.0-rc.1/echarts.min.js"></script>

第三步： 新建一个统计页面

1
hexo new page charts

前往博客根目录下 source/charts/index.md，修改内容如下

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
---
title: 统计
type: "charts"
comments: false
aside: false
---

<script src="https://lib.baomitu.com/echarts/4.9.0-rc.1/echarts.min.js"></script>

<!-- 文章发布时间统计图 --> <!-- 2020-02是从2020年2月开始计算 -->
<div id="posts-chart" data-start="2020-02" style="border-radius: 8px; height: 300px; padding: 10px;"></div>
<!-- 文章标签统计图 --> <!-- data-length="10" 是显示的标签数量 -->
<div id="tags-chart" data-length="10" style="border-radius: 8px; height: 300px; padding: 10px;"></div>
<!-- 文章分类统计图 -->
<div id="categories-chart" data-parent="true" style="border-radius: 8px; height: 300px; padding: 10px;"></div>

接入Umami和关于页面的修改

之前写过文章了，直接食用

即刻短文的修改

效果如下，手机端才会显示修改后的样式

第一步：修改 essay.pug

直接覆盖 themes/anzhiyu/layout/includes/page目录下essay.pug文件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
//- essay.pug 本人不太会pug所以可能代码不太好看
if site.data.essay
  each i in site.data.essay
    #essay_page
      .author-content.author-content-item.essayPage.single(style = i.top_background ? `background: url(${i.top_background}) left 28% / cover no-repeat;` : "")
      .author-info
        .msg
          .avatar
              a.essay-avatar(href=i.avatarLink)
                img(src=i.avatar)
          .eassy-name=i.name
        .desc=i.desc
      #bber
        section.timeline.page-1.content
          ul#waterfall.list
            each item, index in i.essay_list
              if index < i.limit
                li.bber-item
                  .user-avatar(style = i.top_background ? `background: url(${i.avatar}) left 28% / cover no-repeat #ffffffad;` : "")
                  .bber-content
                    .right
                      .bber-name=i.name
                      p.datacont= item.content
                        if item.image
                          .bber-container-img
                            each iten, indey in item.image
                              a.bber-content-img(href=url_for(item.image[indey]), target="_blank",  data-fancybox="gallery", data-caption="")
                                img(src=url_for(item.image[indey]))
                            .bber-content-noimg
                            .bber-content-noimg
                            .bber-content-noimg
                        if item.video
                          .bber-container-img
                            each iten, indey in item.video
                              if (item.video[indey].includes('player.bilibili.com'))
                                div(style="position: relative; padding: 30% 45%;margin-top: 10px;margin-bottom: 10px;")
                                  iframe(style="position: absolute; width: 100%; height: 100%; left: 0; top: 0;margin: 0;border-radius: 12px;border: var(--style-border);" src=url_for(item.video[indey]) scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true")
                              else
                                a.bber-content-video(href=url_for(item.video[indey]) data-fancybox="gallery", data-caption="")
                                  video(src=url_for(item.video[indey]))
                            .bber-content-noimg
                            .bber-content-noimg
                            .bber-content-noimg
                        if item.aplayer
                          .bber-music
                            meting-js(id=item.aplayer.id, server=item.aplayer.server, type="song", mutex="true",preload="none", theme="var(--anzhiyu-main)", data-lrctype="0", order="list")
                      .bber-bottom
                        .bber-info-address
                          if item.address
                              span=item.address
                        .bber-info-time
                          - var datedata = new Date(item.date).toISOString()
                          time.datatime(datetime= item.date)= datedata
                          .bber-info-link
                            if item.link
                              a.bber-content-link(title="跳转到短文指引的链接", href=url_for(item.link),  rel="external nofollow")
                                i.anzhiyufont.anzhiyu-icon-link
                                | 链接
                          .bber-reply(onclick="rm.rightMenuCommentText(" + `'${item.content}'` + ")")
                            i.anzhiyufont.anzhiyu-icon-message
                  hr.essay-hr
      #bber-tips(style='color: var(--anzhiyu-secondtext);')
        ="- 只展示最近" + i.limit + "条短文 -"

第二步：新建essay-style.css

在博客根目录下的source文件夹中新建一个static文件夹，再新建一个essay-style.css，内容如下

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
.author-info {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	position: relative;
	top: -35px;
	z-index: 3;
	margin-right: 25px
}

.msg {
	display: flex;
	flex-direction: row-reverse;
	align-items: flex-start
}

a.essay-avatar {
	height: 60px;
	width: 60px;
	display: block;
	border-radius: 10px;
	background: #fff
}

[data-theme=dark] a.essay-avatar {
	background: #ffffffad
}

.eassy-name {
	margin-right: 10px;
	padding-top: 2px;
	color: #eee;
	font-weight: 600;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	word-break: break-all;
	display: -webkit-box;
	overflow: hidden
}

.content.narrow-row {
	padding: 0 50px
}

#bber div.bber-content {
	position: relative;
	flex-direction: column
}

li {
	list-style: none
}

#bber {
	margin-top: -2rem
}

hr.essay-hr {
	margin: 25px auto;
	border: 1px solid var(--hr-border)
}

#bber .bber-container-img {
	justify-content: flex-start
}

#bber .bber-content-img,#bber .bber-content-video {
	width: 32%;
	margin-right: 1%
}

#bber .bber-content .datacont {
	font-size: 14px;
	font-weight: 400;
	color: var(--font-color)
}

.bber-name,.user-avatar {
	display: none
}

.bber-reply {
	position: absolute;
	right: 15px;
	bottom: 0;
	height: 26px;
	line-height: 26px
}

time.datatime {
	font-size: 13px
}

.bber-info-link {
	position: absolute;
	right: 40px;
	bottom: 0;
	line-height: 26px
}

.bber-info-address {
	color: #4e9df8;
	font-size: .7rem
}

div#bber-tips {
	padding-bottom: 20px
}

#bber .bber-bottom {
	display: inline!important
}

#bber>section>ul>li>div .bber-info-from,#bber>section>ul>li>div .bber-info-time {
	background: 0 0;
	padding: 0;
	height: 26px
}

#bber .bber-content-img img {
	width: 100%
}

@media screen and (max-width:900px),(max-height:580px) {
	body[data-type=essay] #body-wrap .layout #page {
		padding: 0 5px!important
	}

	body[data-type=essay] div#post-comment {
		padding: 20px 15px!important
	}

	body[data-type=essay] .layout {
		padding: 0!important
	}

    body[data-type=essay] .right {
		margin-left: 55px
	}

	div#essay_page {
		border: var(--style-border);
		box-shadow: var(--anzhiyu-shadow-border);
		border-radius: 10px
	}

	a.essay-avatar {
		height: 60px;
		width: 60px
	}

	.author-content.author-content-item.essayPage.single {
		height: 16rem;
		border-radius: 10px
	}

	.desc {
		font-size: 14px
	}

	#bber {
		margin-top: -3rem!important;
		width: 95%;
		margin: auto
	}

	#bber .timeline ul li.bber-item:hover {
		border: none
	}

	#bber .timeline ul li.bber-item {
		width: 95%;
		border: none;
		border-radius: 0;
		padding: 0;
		background: 0 0;
		box-shadow: none
	}

	.bber-name {
		font-size: 16px;
		font-weight: 800;
		display: block
	}

	.user-avatar {
		width: 45px;
		height: 45px;
		border-radius: 10px;
		overflow: hidden;
		position: absolute;
		display: block
	}
}

第三步：插入CSS到Inject

_config.anzhiyu.yml文件中搜 Inject插入到bottom

1
<script src="https://lib.baomitu.com/echarts/4.9.0-rc.1/echarts.min.js"></script>

例子：

1
2
3
4
5
6
7
8
# Inject
# Insert the code to head (before '</head>' tag) and the bottom (before '</body>' tag)
# 插入代码到头部 </head> 之前 和 底部 </body> 之前
inject:
  head:
      - <link rel="stylesheet" href="/static/essay-style.css">
  bottom:

最后

其实本站并没有做多修改，写此文章仅为记录，方便以后升级更新