-
Notifications
You must be signed in to change notification settings - Fork 1
/
46524.html
285 lines (259 loc) · 63.1 KB
/
46524.html
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
<!DOCTYPE html><html lang="zh-CN" data-theme="light"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><title>猹的魔改日记-小小的重写个页脚 | 𝓨𝓾𝔂𝓪𝓷'𝓼 𝓑𝓵𝓸𝓰</title><meta name="keywords" content="hexo,butterfly,Course"><meta name="author" content="𝓨𝓾𝔂𝓪𝓷"><meta name="copyright" content="𝓨𝓾𝔂𝓪𝓷"><meta name="format-detection" content="telephone=no"><meta name="theme-color" content="#ffffff"><meta name="description" content="魔改第三弹！">
<meta property="og:type" content="article">
<meta property="og:title" content="猹的魔改日记-小小的重写个页脚">
<meta property="og:url" content="https://szsyzx.github.io/46524.html">
<meta property="og:site_name" content="𝓨𝓾𝔂𝓪𝓷'𝓼 𝓑𝓵𝓸𝓰">
<meta property="og:description" content="魔改第三弹！">
<meta property="og:locale" content="zh_CN">
<meta property="og:image" content="https://imgsrc.baidu.com/super/pic/item/513d269759ee3d6dd92dd61506166d224e4ade01.jpg">
<meta property="article:published_time" content="2022-08-17T17:00:00.000Z">
<meta property="article:modified_time" content="2022-08-17T17:00:00.000Z">
<meta property="article:author" content="𝓨𝓾𝔂𝓪𝓷">
<meta property="article:tag" content="hexo">
<meta property="article:tag" content="butterfly">
<meta property="article:tag" content="Course">
<meta name="twitter:card" content="summary">
<meta name="twitter:image" content="https://imgsrc.baidu.com/super/pic/item/513d269759ee3d6dd92dd61506166d224e4ade01.jpg"><link rel="shortcut icon" href="https://s2.loli.net/2022/09/05/XIJ8QimgfoG6khP.jpg"><link rel="canonical" href="https://szsyzx.github.io/46524"><link rel="preconnect" href="//cdn1.tianli0.top"/><link rel="preconnect" href="//busuanzi.ibruce.info"/><link rel="stylesheet" href="/css/index.css"><link rel="stylesheet" href="https://cdnjs.sourcegcdn.com/ajax/libs/font-awesome/6.1.1/css/all.min.css" media="print" onload="this.media='all'"><script>const GLOBAL_CONFIG = {
root: '/',
algolia: undefined,
localSearch: {"path":"search.xml","languages":{"hits_empty":"找不到您查询的内容：${query}"}},
translate: undefined,
noticeOutdate: undefined,
highlight: {"plugin":"highlighjs","highlightCopy":true,"highlightLang":true},
copy: {
success: '复制成功',
error: '复制错误',
noSupport: '浏览器不支持'
},
relativeDate: {
homepage: false,
post: false
},
runtime: '天',
date_suffix: {
just: '刚刚',
min: '分钟前',
hour: '小时前',
day: '天前',
month: '个月前'
},
copyright: undefined,
lightbox: 'fancybox',
Snackbar: undefined,
source: {
jQuery: 'https://cdnjs.sourcegcdn.com/ajax/libs/jquery/3.6.0/jquery.min.js',
justifiedGallery: {
js: 'https://cdnjs.sourcegcdn.com/ajax/libs/justifiedGallery/3.8.1/js/jquery.justifiedGallery.min.js',
css: 'https://cdnjs.sourcegcdn.com/ajax/libs/justifiedGallery/3.8.1/css/justifiedGallery.min.css'
},
fancybox: {
js: 'https://cdnjs.sourcegcdn.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.js',
css: 'https://cdnjs.sourcegcdn.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.css'
}
},
isPhotoFigcaption: true,
islazyload: false,
isanchor: false
}</script><script id="config-diff">var GLOBAL_CONFIG_SITE = {
isPost: true,
isHome: false,
isHighlightShrink: false,
isToc: false,
postUpdate: '2022-08-17 17:00:00'
}</script><noscript><style type="text/css">
#nav {
opacity: 1
}
.justified-gallery img {
opacity: 1
}
#recent-posts time,
#post-meta time {
display: inline !important
}
</style></noscript><script>(win=>{
win.saveToLocal = {
set: function setWithExpiry(key, value, ttl) {
if (ttl === 0) return
const now = new Date()
const expiryDay = ttl * 86400000
const item = {
value: value,
expiry: now.getTime() + expiryDay,
}
localStorage.setItem(key, JSON.stringify(item))
},
get: function getWithExpiry(key) {
const itemStr = localStorage.getItem(key)
if (!itemStr) {
return undefined
}
const item = JSON.parse(itemStr)
const now = new Date()
if (now.getTime() > item.expiry) {
localStorage.removeItem(key)
return undefined
}
return item.value
}
}
win.getScript = url => new Promise((resolve, reject) => {
const script = document.createElement('script')
script.src = url
script.async = true
script.onerror = reject
script.onload = script.onreadystatechange = function() {
const loadState = this.readyState
if (loadState && loadState !== 'loaded' && loadState !== 'complete') return
script.onload = script.onreadystatechange = null
resolve()
}
document.head.appendChild(script)
})
win.activateDarkMode = function () {
document.documentElement.setAttribute('data-theme', 'dark')
if (document.querySelector('meta[name="theme-color"]') !== null) {
document.querySelector('meta[name="theme-color"]').setAttribute('content', '#0d0d0d')
}
}
win.activateLightMode = function () {
document.documentElement.setAttribute('data-theme', 'light')
if (document.querySelector('meta[name="theme-color"]') !== null) {
document.querySelector('meta[name="theme-color"]').setAttribute('content', '#ffffff')
}
}
const t = saveToLocal.get('theme')
if (t === 'dark') activateDarkMode()
else if (t === 'light') activateLightMode()
})(window)</script><!-- hexo injector head_end start --><link rel="stylesheet" href="https://npm.elemecdn.com/[email protected]/lib/runtime.css" media="print" onload="this.media='all'"><link rel="stylesheet" href="https://npm.elemecdn.com/hexo-butterfly-swiper/lib/swiper.min.css" media="print" onload="this.media='all'"><!-- hexo injector head_end end --><meta name="generator" content="Hexo 5.3.0"><link rel="alternate" href="/atom.xml" title="𝓨𝓾𝔂𝓪𝓷'𝓼 𝓑𝓵𝓸𝓰" type="application/atom+xml">
<link rel="alternate" href="/rss.xml" title="𝓨𝓾𝔂𝓪𝓷'𝓼 𝓑𝓵𝓸𝓰" type="application/rss+xml">
</head><body><div id="sidebar"><div id="menu-mask"></div><div id="sidebar-menus"><div class="simply-cha-top"></div><div class="is-center" id="sidebar-avatar"><div class="avatar-img"><img src="https://s2.loli.net/2022/09/05/XIJ8QimgfoG6khP.jpg" onerror="this.onerror=null;this.src='/img/friend_404.gif'" alt="avatar"/></div><div class="author-info__name">𝓨𝓾𝔂𝓪𝓷</div><div class="author-info__description">欢迎光临小窝！</div></div><div class="site-data"><div class="data-item is-center"><div class="data-item-link"><a href="/archives/"><div class="headline">文章</div><div class="length-num">55</div></a></div></div><div class="data-item is-center"><div class="data-item-link"><a href="/tags/"><div class="headline">标签</div><div class="length-num">34</div></a></div></div><div class="data-item is-center"><div class="data-item-link"><a href="/categories/"><div class="headline">分类</div><div class="length-num">20</div></a></div></div></div><a class="button--animated" id="card-info-btn" target="_blank" rel="noopener" href="https://github.com/szsyzx"><i class="fab fa-github"></i><span> Follow Me</span></a><div class="menu-info-social-icons is-center"><a class="social-icon" href="https://github.com/szsyzx" target="_blank" title="Github"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-github"></use></svg></a><a class="social-icon" href="mailto:[email protected]" target="_blank" title="Email"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-youxiang"></use></svg></a><a class="social-icon" href="https://space.bilibili.com/238053726" target="_blank" title="Bilibili"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-CN_bilibiliB"></use></svg></a><a class="social-icon" href="https://music.163.com/#/user/home?id=3873812910" target="_blank" title="网易云"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-yinle"></use></svg></a><a class="social-icon" href="//rss.xml" target="_blank" title="rss"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-rss"></use></svg></a></div><hr/><div class="menus_items"><div class="menus_item"><a class="site-page" href="javascript:void(0);"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-xigua1"></use></svg><span> 笔记心得</span><i class="fas fa-chevron-down expand"></i></a><ul class="menus_item_child" style="left:-45px;"><li><a class="site-page child" href="/tags/Course/"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-jiaocheng"></use></svg><span> 教程分享</span></a></li><li><a class="site-page child" href="/tags/Project/"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-xiangmu"></use></svg><span> 收藏项目</span></a></li></ul></div><div class="menus_item"><a class="site-page" href="javascript:void(0);"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-miao"></use></svg><span> 笔记合集</span><i class="fas fa-chevron-down expand"></i></a><ul class="menus_item_child" style="left:-100px;"><li><a class="site-page child" href="/tags/%E8%BD%AF%E4%BB%B6%E4%B8%8B%E8%BD%BD/"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-colorful-code"></use></svg><span> 软件下载</span></a></li><li><a class="site-page child" href="/tags/Python/"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-colorful-code"></use></svg><span> 玩玩爬虫</span></a></li><li><a class="site-page child" href="/tags/html/"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-colorful-code"></use></svg><span> 服务搭建</span></a></li></ul></div><div class="menus_item"><a class="site-page" href="javascript:void(0);"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-tea"></use></svg><span> 生活日常</span><i class="fas fa-chevron-down expand"></i></a><ul class="menus_item_child" style="left:-100px;"><li><a class="site-page child" href="/link/"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-pengyou"></use></svg><span> 友情链接</span></a></li><li><a class="site-page child" href="/friendcircle/"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-pengyouquanzhushou2x"></use></svg><span> 朋友文章</span></a></li><li><a class="site-page child" href="/messageboard/"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-shuoshuo-"></use></svg><span> 留言信箱</span></a></li></ul></div><div class="menus_item"><a class="site-page" href="javascript:void(0);"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-liuyan"></use></svg><span> 君临天下</span><i class="fas fa-chevron-down expand"></i></a><ul class="menus_item_child" style="left:-45px;"><li><a class="site-page child" href="/tags/Diary/"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-tubiaozhizuomoban-"></use></svg><span> 我的随笔</span></a></li><li><a class="site-page child" href="/about/"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-xinfeng"></use></svg><span> 我的自述</span></a></li></ul></div></div><div class="simply-cha"></div></div></div><div class="post" id="body-wrap"><header class="not-top-img" id="page-header"><nav id="nav"><div id="nav-group"><span id="blog_name"><a id="site-name" href="/">𝓨𝓾𝔂𝓪𝓷'𝓼 𝓑𝓵𝓸𝓰</a></span><div id="menus"><div class="menus_items"><div class="menus_item"><a class="site-page" href="javascript:void(0);"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-xigua1"></use></svg><span> 笔记心得</span><i class="fas fa-chevron-down expand"></i></a><ul class="menus_item_child" style="left:-45px;"><li><a class="site-page child" href="/tags/Course/"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-jiaocheng"></use></svg><span> 教程分享</span></a></li><li><a class="site-page child" href="/tags/Project/"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-xiangmu"></use></svg><span> 收藏项目</span></a></li></ul></div><div class="menus_item"><a class="site-page" href="javascript:void(0);"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-miao"></use></svg><span> 笔记合集</span><i class="fas fa-chevron-down expand"></i></a><ul class="menus_item_child" style="left:-100px;"><li><a class="site-page child" href="/tags/%E8%BD%AF%E4%BB%B6%E4%B8%8B%E8%BD%BD/"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-colorful-code"></use></svg><span> 软件下载</span></a></li><li><a class="site-page child" href="/tags/Python/"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-colorful-code"></use></svg><span> 玩玩爬虫</span></a></li><li><a class="site-page child" href="/tags/html/"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-colorful-code"></use></svg><span> 服务搭建</span></a></li></ul></div><div class="menus_item"><a class="site-page" href="javascript:void(0);"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-tea"></use></svg><span> 生活日常</span><i class="fas fa-chevron-down expand"></i></a><ul class="menus_item_child" style="left:-100px;"><li><a class="site-page child" href="/link/"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-pengyou"></use></svg><span> 友情链接</span></a></li><li><a class="site-page child" href="/friendcircle/"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-pengyouquanzhushou2x"></use></svg><span> 朋友文章</span></a></li><li><a class="site-page child" href="/messageboard/"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-shuoshuo-"></use></svg><span> 留言信箱</span></a></li></ul></div><div class="menus_item"><a class="site-page" href="javascript:void(0);"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-liuyan"></use></svg><span> 君临天下</span><i class="fas fa-chevron-down expand"></i></a><ul class="menus_item_child" style="left:-45px;"><li><a class="site-page child" href="/tags/Diary/"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-tubiaozhizuomoban-"></use></svg><span> 我的随笔</span></a></li><li><a class="site-page child" href="/about/"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-xinfeng"></use></svg><span> 我的自述</span></a></li></ul></div></div></div><div id="navFn"><div id="search-button"><a class="social-icon search"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-sousuo"></use></svg><span> 搜索</span></a></div><div id="darkmodeBt"><a class="darkmode switch"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-deng1"></use></svg><span id="darkmode-switch"> 关灯</span></a></div><div id="toggle-menu"><a class="site-page"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-mulu"></use></svg></a></div></div></div></nav></header><main class="layout hide-aside" id="content-inner"><div id="post"><div id="post-info"><h1 class="post-title">猹的魔改日记-小小的重写个页脚</h1><div id="post-meta"><div class="tag-cloud-list is-center"><a href="/tags/hexo/" style="font-size: 1.5em; color: rgb(95, 125, 106)">hexo</a><a href="/tags/butterfly/" style="font-size: 1.5em; color: rgb(136, 166, 39)">butterfly</a><a href="/tags/Course/" style="font-size: 1.5em; color: rgb(162, 192, 146)">Course</a></div><div class="meta-firstline"><span class="post-meta-date"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-rili"></use></svg><span class="post-meta-label">发表于</span><time class="post-meta-date-created" datetime="2022-08-17T17:00:00.000Z" title="发表于 2022-08-17 17:00:00">2022-08-17</time><span class="post-meta-separator">|</span><svg class="icon" aria-hidden="true"><use xlink:href="#icon-shijian"></use></svg><span class="post-meta-label">更新于</span><time class="post-meta-date-updated" datetime="2022-08-17T17:00:00.000Z" title="更新于 2022-08-17 17:00:00">2022-08-17</time></span><span class="post-meta-categories"><span class="post-meta-separator">|</span><svg class="icon" aria-hidden="true"><use xlink:href="#icon-fenlei1"></use></svg><a class="post-meta-categories" href="/categories/%E9%AD%94%E6%94%B9%E6%97%A5%E8%AE%B0%E6%9C%AC/">魔改日记本</a></span></div><div class="meta-secondline"><span class="post-meta-separator"></span><span class="post-meta-wordcount"><i class="far fa-file-word fa-fw post-meta-icon"></i><span class="post-meta-label">字数总计:</span><span class="word-count">3k</span><span class="post-meta-separator">|</span><i class="far fa-clock fa-fw post-meta-icon"></i><span class="post-meta-label">阅读时长:</span><span>12分钟</span></span><span class="post-meta-separator">|</span><span class="post-meta-pv-cv" id="" data-flag-title="猹的魔改日记-小小的重写个页脚"><i class="far fa-eye fa-fw post-meta-icon"></i><span class="post-meta-label">阅读量:</span><span id="busuanzi_value_page_pv"></span></span></div><div class="line"> <svg class="icon" aria-hidden="true"><use xlink:href="#icon-xigua2"></use></svg><svg class="icon" aria-hidden="true"><use xlink:href="#icon-xigua2"></use></svg><svg class="icon" aria-hidden="true"><use xlink:href="#icon-xigua2"></use></svg><svg class="icon" aria-hidden="true"><use xlink:href="#icon-xigua2"></use></svg><svg class="icon" aria-hidden="true"><use xlink:href="#icon-xigua2"></use></svg></div></div></div><article class="post-content" id="article-container"><h2 id="前言"><a href="#前言" class="headerlink" title="前言"></a>前言</h2><div class="note red icon flat"><i class="note-icon fas fa-fan"></i><p>温馨提示：本日记本只提供魔改参考，并不做通用处理，很多源码修改都需要根据自己博客做小小微调</p>
</div>
<div class="note purple icon flat"><i class="note-icon far fa-hand-scissors"></i><p>另外在修改源码时注意做好备份处理。本帖只提供思路与方法，如果哪里炸了，请检查语法与缩进等，猹概不负责啦！</p>
</div>
<p>继白嫖<a target="_blank" rel="noopener" href="https://akilar.top/">店长</a>、<a target="_blank" rel="noopener" href="https://zfe.space/">冰老师</a>、<a target="_blank" rel="noopener" href="https://www.antmoe.com/">小康</a>、<a target="_blank" rel="noopener" href="https://www.nesxc.com/">小N</a>等大佬的魔改之后，猹终于不满于白嫖，开始想动手实操，把自己的博客调教成想要的样子，也以此来使猹学前端有实操的机会。</p>
<p><strong>注</strong>：这部分前言内容会在魔改日记本的每一篇都出现；另外这是一篇日记而非教程，文风可能不是那么友好（逃</p>
<hr>
<h2 id="页脚魔改两部分"><a href="#页脚魔改两部分" class="headerlink" title="页脚魔改两部分"></a>页脚魔改两部分</h2><h3 id="已经写完了哪本书？"><a href="#已经写完了哪本书？" class="headerlink" title="已经写完了哪本书？"></a>已经写完了哪本书？</h3><p><img src="https://noionion-picture-bed.oss-cn-hangzhou.aliyuncs.com/img/20220817155942.png"></p>
<p>最早看到这个点子的时候，是看到木木的站点和他的Hugo教程<a target="_blank" rel="noopener" href="https://immmmm.com/what-book-i-write/">《已写完了哪本书？》</a>，进而看到了最源头<a target="_blank" rel="noopener" href="https://www.jdeal.cn/152.html">《博客全站总字数统计》</a>。无奈 Hexo 没有相关的教程，我又不会前端，于是就试着写了个写死书名的版本。</p>
<p>但这样终究是个问题，当我每次大更新之后（尤其对于我常常一篇教程写个几千字的，有时候一不小心就会破个万字关），书名就得相应的变更一次，很是麻烦。随着学校实验室的教学开发项目暂时可以休息一小会，猹也顺利考过了科二（短时间没空学科三），于是花了点时间重写了一下。</p>
<p>Hugo 和 Typecho 可以直接找两篇原教程，这里只做了 pug 类 Hexo 主题的实现方案。</p>
<div class="tag link"><a class="link-card" title="Hugo：林木木《已写完了哪本书？》" target="_blank" rel="noopener" href="https://immmmm.com/what-book-i-write/"><div class="left"><img src="https://gravatar.loli.net/avatar/ba83fa02fc4b2ba621514941307e21be"/></div><div class="right"><p class="text">Hugo：林木木《已写完了哪本书？》</p><p class="url">https://immmmm.com/what-book-i-write/</p></div></a></div>
<div class="tag link"><a class="link-card" title="Typecho：Jdeal《博客全站总字数统计》" target="_blank" rel="noopener" href="https://www.jdeal.cn/152.html"><div class="left"><img src="https://www.jdeal.cn/favicon.ico"/></div><div class="right"><p class="text">Typecho：Jdeal《博客全站总字数统计》</p><p class="url">https://www.jdeal.cn/152.html</p></div></a></div>
<details cyan open><summary> 前置插件 </summary>
<div class='content'>
<p>Hexo 和 Butterfly 主题本身是不带字数统计功能的，所以需要前置安装插件<a target="_blank" rel="noopener" href="https://github.com/willin/hexo-wordcount">hexo-wordcount</a>：</p><div class="tag link"><a class="link-card" title="hexo-wordcount" target="_blank" rel="noopener" href="https://github.com/willin/hexo-wordcount"><div class="left"><img src="https://github.com/fluidicon.png"/></div><div class="right"><p class="text">hexo-wordcount</p><p class="url">https://github.com/willin/hexo-wordcount</p></div></a></div>
</div>
</details>
<details yellow open><summary> 设计思路 </summary>
<div class='content'>
<p>实际上对于这个功能，文字基本上是写死的，主要考虑的还是怎么获取字数。咱去查看了一下 wordcount 的函数调用源码，它是这样写的：</p><figure class="highlight js"><table><tr><td class="code"><pre><span class="line">hexo.extend.helper.register(<span class="string">'wordcount'</span>, <span class="function"><span class="keyword">function</span> (<span class="params">content</span>) </span>{</span><br><span class="line"> <span class="keyword">var</span> len = counter(content);</span><br><span class="line"> <span class="keyword">var</span> count = len[<span class="number">0</span>] + len[<span class="number">1</span>];</span><br><span class="line"> <span class="keyword">if</span> (count < <span class="number">1000</span>) {</span><br><span class="line"> <span class="keyword">return</span> count;</span><br><span class="line"> }</span><br><span class="line"> <span class="keyword">return</span> <span class="built_in">Math</span>.round(count / <span class="number">100</span>) / <span class="number">10</span> + <span class="string">'k'</span>;</span><br><span class="line">});</span><br><span class="line"></span><br><span class="line">hexo.extend.helper.register(<span class="string">'totalcount'</span>, <span class="function"><span class="keyword">function</span> (<span class="params">site</span>) </span>{</span><br><span class="line"> <span class="keyword">var</span> count = <span class="number">0</span>;</span><br><span class="line"> site.posts.forEach(<span class="function"><span class="keyword">function</span> (<span class="params">post</span>) </span>{</span><br><span class="line"> <span class="keyword">var</span> len = counter(post.content);</span><br><span class="line"> count += len[<span class="number">0</span>] + len[<span class="number">1</span>];</span><br><span class="line"> });</span><br><span class="line"> <span class="keyword">if</span> (count < <span class="number">1000</span>) {</span><br><span class="line"> <span class="keyword">return</span> count;</span><br><span class="line"> }</span><br><span class="line"> <span class="keyword">return</span> <span class="built_in">Math</span>.round(count / <span class="number">100</span>) / <span class="number">10</span> + <span class="string">'k'</span>;</span><br><span class="line">});</span><br></pre></td></tr></table></figure><p>这里字数统计的返回明显有两个不同的类型返回。当调用获取到的字数不及千字时，返回的是如<code>456</code>这样的数字类型，而大于千字时则返回<code>12k</code>之类的字符串，因此要做返回类型的判断。</p><p>pug 语法中遵循的是许多变量类型可以使用 js 提供的方法来进行，虽然不懂 js，但是百度水平还是有一点的。</p><p>js 中的<code>isNaN()</code>函数可以帮我判断这个变量是不是一个数字类型，而根据木木教程中提供的源代码可以知道，5w字以下都是<em>“还在努力更新中.. 加油！加油啦！”</em>字样。于是全数字就可以直接一条解决。</p><p>而大于1k字数的就需要对字符串做点处理，最简单的做法无疑是直接替换掉<code>k</code>然后直接使用<code>Number()</code>函数转化成数字来进行比较。pug 语法中的判断大约像是 python 缩进语法下的 c，没有什么学习难度可言。</p><p>代码就直接看下一部分了。</p>
</div>
</details>
<details blue><summary> pug 源码和 styl 样式 </summary>
<div class='content'>
<p>修改<code>[root]\themes\butterfly\layout\includes\footer.pug</code>文件，在适合的位置插入如下代码：</p><figure class="highlight py"><table><tr><td class="code"><pre><span class="line">.wordcount</span><br><span class="line"> - let allword = totalcount(site)</span><br><span class="line"> span= <span class="string">'猹居然写了 '</span> + allword + <span class="string">' 字'</span></span><br><span class="line"> </br></span><br><span class="line"> <span class="keyword">if</span> isNaN(allword)</span><br><span class="line"> - allword= Number(allword.replace(<span class="string">'k'</span>, <span class="string">''</span>))</span><br><span class="line"> <span class="keyword">if</span> allword< <span class="number">50</span></span><br><span class="line"> span= <span class="string">"还在努力更新中.. 加油！加油啦！"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">70</span></span><br><span class="line"> span= <span class="string">"好像写完一本 埃克苏佩里 的 《小王子》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">90</span></span><br><span class="line"> span= <span class="string">"好像写完一本 鲁迅 的 《呐喊》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">100</span></span><br><span class="line"> span= <span class="string">"好像写完一本 林海音 的 《城南旧事》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">110</span></span><br><span class="line"> span= <span class="string">"好像写完一本 马克·吐温 的 《王子与乞丐》了！ 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">120</span></span><br><span class="line"> span= <span class="string">"好像写完一本 鲁迅 的 《彷徨》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">130</span></span><br><span class="line"> span= <span class="string">"好像写完一本 余华 的 《活着》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">140</span></span><br><span class="line"> span= <span class="string">"好像写完一本 曹禺 的 《雷雨》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">150</span></span><br><span class="line"> span= <span class="string">"好像写完一本 史铁生 的 《宿命的写作》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">160</span></span><br><span class="line"> span= <span class="string">"好像写完一本 伯内特 的 《秘密花园》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">170</span></span><br><span class="line"> span= <span class="string">"好像写完一本 曹禺 的 《日出》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">180</span></span><br><span class="line"> span= <span class="string">"好像写完一本 马克·吐温 的 《汤姆·索亚历险记》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">190</span></span><br><span class="line"> span= <span class="string">"好像写完一本 沈从文 的 《边城》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">200</span></span><br><span class="line"> span= <span class="string">"好像写完一本 亚米契斯 的 《爱的教育》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">210</span></span><br><span class="line"> span= <span class="string">"好像写完一本 巴金 的 《寒夜》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">220</span></span><br><span class="line"> span= <span class="string">"好像写完一本 东野圭吾 的 《解忧杂货店》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">230</span></span><br><span class="line"> span= <span class="string">"好像写完一本 莫泊桑 的 《一生》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">250</span></span><br><span class="line"> span= <span class="string">"好像写完一本 简·奥斯汀 的 《傲慢与偏见》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">280</span></span><br><span class="line"> span= <span class="string">"好像写完一本 钱钟书 的 《围城》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">300</span></span><br><span class="line"> span= <span class="string">"好像写完一本 张炜 的 《古船》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">310</span></span><br><span class="line"> span= <span class="string">"好像写完一本 茅盾 的 《子夜》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">320</span></span><br><span class="line"> span= <span class="string">"好像写完一本 阿来 的 《尘埃落定》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">340</span></span><br><span class="line"> span= <span class="string">"好像写完一本 艾米莉·勃朗特 的 《呼啸山庄》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">350</span></span><br><span class="line"> span= <span class="string">"好像写完一本 雨果 的 《巴黎圣母院》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span> <span class="keyword">if</span> allword< <span class="number">360</span></span><br><span class="line"> span= <span class="string">"好像写完一本 东野圭吾 的 《白夜行》 了啊"</span></span><br><span class="line"> <span class="keyword">else</span></span><br><span class="line"> span= <span class="string">"好像写完一本我国著名的 四大名著 了！！！"</span></span><br><span class="line"> <span class="keyword">else</span></span><br><span class="line"> span= <span class="string">"还在努力更新中.. 加油！加油啦！"</span></span><br></pre></td></tr></table></figure><p>相关联的样式如下：</p><figure class="highlight styl"><table><tr><td class="code"><pre><span class="line">#footer</span><br><span class="line"> .wordcount</span><br><span class="line"> <span class="attribute">text-align</span>: center</span><br><span class="line"> <span class="attribute">font-family</span>: <span class="string">'Noto Serif SC'</span>, -apple-system,BlinkMacSystemFont,Roboto,Segoe UI,Helvetica,Arial,serif</span><br><span class="line"> <span class="attribute">font-size</span>: large</span><br><span class="line"> <span class="attribute">padding</span>: <span class="number">2rem</span> <span class="number">0</span> <span class="number">0</span> <span class="number">0</span></span><br></pre></td></tr></table></figure>
</div>
</details>
<h3 id="fluid风格页脚"><a href="#fluid风格页脚" class="headerlink" title="fluid风格页脚"></a>fluid风格页脚</h3><p>实际上<a target="_blank" rel="noopener" href="https://hexo.fluid-dev.com/">fluid</a>这个主题还是很戳我的感觉的，说简洁优雅我觉得并不为过，配置也简单（相比 butterfly 来讲就是没那么臃肿但也没那么通用化，但是由于 ejs 语法我也没空学，魔改它相对的就有一些难度）。它的页脚的简洁大方就可以作为我魔改移植的思路源头。</p>
<p>另外的是官方也给了页脚添加站点运行时长的教程，一样也作为了移植的对象来源。所以本部分将分为两节的魔改：增添站点运行时长魔改和原生 fluid 主题页脚魔改。</p>
<p>原生 fluid 新增完运行时长后的效果：</p>
<p><img src="https://noionion-picture-bed.oss-cn-hangzhou.aliyuncs.com/img/fluid_footer.png"></p>
<p>bf移植后效果（本地截的图，访问人数、浏览次数有问题很正常）：</p>
<p><img src="https://noionion-picture-bed.oss-cn-hangzhou.aliyuncs.com/img/noionion_bf_footer.png"></p>
<p>参考 fluid 教程：</p>
<div class="tag link"><a class="link-card" title="Fluid 页脚增加网站运行时长" target="_blank" rel="noopener" href="https://hexo.fluid-dev.com/posts/fluid-footer-custom/"><div class="left"><img src="https://hexo.fluid-dev.com/img/fluid.png"/></div><div class="right"><p class="text">Fluid 页脚增加网站运行时长</p><p class="url">https://hexo.fluid-dev.com/posts/fluid-footer-custom/</p></div></a></div>
<details cyan open><summary> 增加网站运行时长 </summary>
<div class='content'>
<p>其实 butterfly 主题官方在侧栏本身就提供了运行时长统计这一功能，但是原生的主题并不进行细致到时分秒的统计，我也懒得在它原生基础上继续修改。而 fluid 给的教程是十分友好的 html + js，移植到那个地方都有良好的鲁棒性。于是 js 照搬，改改输出的时间和字段；再把 html 稍微翻译成 pug 的语法，写好样式，就是个可用的版本。</p><p>原生提供的 html 代码是这样的：</p><figure class="highlight html"><table><tr><td class="code"><pre><span class="line"><span class="tag"><<span class="name">div</span> <span class="attr">style</span>=<span class="string">"font-size: 0.85rem"</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">span</span> <span class="attr">id</span>=<span class="string">"timeDate"</span>></span>载入天数...<span class="tag"></<span class="name">span</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">span</span> <span class="attr">id</span>=<span class="string">"times"</span>></span>载入时分秒...<span class="tag"></<span class="name">span</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">script</span> <span class="attr">src</span>=<span class="string">"/js/duration.js"</span>></span><span class="tag"></<span class="name">script</span>></span></span><br><span class="line"><span class="tag"></<span class="name">div</span>></span></span><br></pre></td></tr></table></figure><p>稍微改改样子，就差不多了：</p><figure class="highlight py"><table><tr><td class="code"><pre><span class="line">div(style=<span class="string">"font-size: 0.7rem"</span>)</span><br><span class="line"> span<span class="comment">#timeDate= '载入天数...'</span></span><br><span class="line"> span= <span class="string">' '</span></span><br><span class="line"> span<span class="comment">#times= '载入时分秒...'</span></span><br><span class="line"> script(src=<span class="string">"/js/add/duration.js"</span>)</span><br></pre></td></tr></table></figure>
</div>
</details>
<details red open><summary> fluid 页脚移植 </summary>
<div class='content'>
<p>fluid 主题的原生页脚其实也算不上“原生”，更准确的说是默认写在了配置文件中：</p><figure class="highlight yml"><table><tr><td class="code"><pre><span class="line"><span class="attr">footer:</span></span><br><span class="line"> <span class="attr">content:</span> <span class="string">'</span></span><br><span class="line"><span class="string"> <a href="https://hexo.io" target="_blank" rel="nofollow noopener"><span>Hexo</span></a></span></span><br><span class="line"><span class="string"> <i class="iconfont icon-love"></i></span></span><br><span class="line"><span class="string"> <a href="https://github.com/fluid-dev/hexo-theme-fluid" target="_blank" rel="nofollow noopener"><span>Fluid</span></a></span></span><br><span class="line"><span class="string"> '</span></span><br></pre></td></tr></table></figure><p>我要的只是它的样式，自然抄一个也不是什么难事：</p><figure class="highlight py"><table><tr><td class="code"><pre><span class="line">.footer-content</span><br><span class="line"> a(href=<span class="string">"https://hexo.io"</span> target=<span class="string">"_blank"</span> rel=<span class="string">"nofollow noopener"</span>)</span><br><span class="line"> span(style=<span class="string">"padding: 0.4rem"</span>)= <span class="string">'hexo'</span></span><br><span class="line"> a</span><br><span class="line"> i.fas.fa-heart</span><br><span class="line"> a(href=<span class="string">"https://butterfly.js.org/"</span> target=<span class="string">"_blank"</span> rel=<span class="string">"nofollow noopener"</span>)</span><br><span class="line"> span(style=<span class="string">"padding: 0.4rem"</span>)= <span class="string">'butterfly'</span></span><br></pre></td></tr></table></figure><p>再加上底下的站点统计（这个才是真的 fluid 原生内容，但自己写就够了）</p><blockquote><p>虽然不蒜子的统计经常莫得，但用它的接口我觉得挺好</p></blockquote><figure class="highlight py"><table><tr><td class="code"><pre><span class="line">.statistics</span><br><span class="line"> span<span class="comment">#site_uv= '有 '</span></span><br><span class="line"> span<span class="comment">#busuanzi_value_site_uv</span></span><br><span class="line"> span= <span class="string">' 人光顾过猹的小窝'</span></span><br><span class="line"> span<span class="comment">#site_pv</span></span><br><span class="line"> span= <span class="string">'共 '</span></span><br><span class="line"> span<span class="comment">#busuanzi_value_site_pv</span></span><br><span class="line"> span= <span class="string">' 次在这里摘了个瓜'</span></span><br></pre></td></tr></table></figure>
</div>
</details>
<details yellow><summary> 相关源码修改 </summary>
<div class='content'>
<p>稍微整合一下上述 pug 的移植修改，还是修改同一个文件：<code>[root]\themes\butterfly\layout\includes\footer.pug</code>，在适合的位置插入如下代码（字样需要自己改改）：</p><figure class="highlight py"><table><tr><td class="code"><pre><span class="line">.footer-content</span><br><span class="line"> a(href=<span class="string">"https://hexo.io"</span> target=<span class="string">"_blank"</span> rel=<span class="string">"nofollow noopener"</span>)</span><br><span class="line"> span(style=<span class="string">"padding: 0.4rem"</span>)= <span class="string">'hexo'</span></span><br><span class="line"> a</span><br><span class="line"> i.fas.fa-heart</span><br><span class="line"> a(href=<span class="string">"https://butterfly.js.org/"</span> target=<span class="string">"_blank"</span> rel=<span class="string">"nofollow noopener"</span>)</span><br><span class="line"> span(style=<span class="string">"padding: 0.4rem"</span>)= <span class="string">'butterfly'</span></span><br><span class="line"> div(style=<span class="string">"font-size: 0.7rem"</span>)</span><br><span class="line"> span<span class="comment">#timeDate= '载入天数...'</span></span><br><span class="line"> span= <span class="string">' '</span></span><br><span class="line"> span<span class="comment">#times= '载入时分秒...'</span></span><br><span class="line"> script(src=<span class="string">"/js/add/duration.js"</span>)</span><br><span class="line">.statistics</span><br><span class="line"> span<span class="comment">#site_uv= '有 '</span></span><br><span class="line"> span<span class="comment">#busuanzi_value_site_uv</span></span><br><span class="line"> span= <span class="string">' 人光顾过猹的小窝'</span></span><br><span class="line"> span<span class="comment">#site_pv</span></span><br><span class="line"> span= <span class="string">'共 '</span></span><br><span class="line"> span<span class="comment">#busuanzi_value_site_pv</span></span><br><span class="line"> span= <span class="string">' 次在这里摘了个瓜'</span></span><br></pre></td></tr></table></figure><p>然后再新增文件：<code>[root]\themes\butterfly\source\js\add\duration.js</code>（实际上是 fluid 官方提供的 js，也还是要修改一些字样和起始的时间）</p><figure class="highlight js"><table><tr><td class="code"><pre><span class="line">!(<span class="function"><span class="keyword">function</span>(<span class="params"></span>) </span>{</span><br><span class="line"> <span class="comment">/** 计时起始时间，自行修改 **/</span></span><br><span class="line"> <span class="keyword">var</span> start = <span class="keyword">new</span> <span class="built_in">Date</span>(<span class="string">"2020/10/31 00:00:00"</span>);</span><br><span class="line"></span><br><span class="line"> <span class="function"><span class="keyword">function</span> <span class="title">update</span>(<span class="params"></span>) </span>{</span><br><span class="line"> <span class="keyword">var</span> now = <span class="keyword">new</span> <span class="built_in">Date</span>();</span><br><span class="line"> now.setTime(now.getTime()+<span class="number">250</span>);</span><br><span class="line"> days = (now - start) / <span class="number">1000</span> / <span class="number">60</span> / <span class="number">60</span> / <span class="number">24</span>;</span><br><span class="line"> dnum = <span class="built_in">Math</span>.floor(days);</span><br><span class="line"> hours = (now - start) / <span class="number">1000</span> / <span class="number">60</span> / <span class="number">60</span> - (<span class="number">24</span> * dnum);</span><br><span class="line"> hnum = <span class="built_in">Math</span>.floor(hours);</span><br><span class="line"> <span class="keyword">if</span>(<span class="built_in">String</span>(hnum).length === <span class="number">1</span> ){</span><br><span class="line"> hnum = <span class="string">"0"</span> + hnum;</span><br><span class="line"> }</span><br><span class="line"> minutes = (now - start) / <span class="number">1000</span> /<span class="number">60</span> - (<span class="number">24</span> * <span class="number">60</span> * dnum) - (<span class="number">60</span> * hnum);</span><br><span class="line"> mnum = <span class="built_in">Math</span>.floor(minutes);</span><br><span class="line"> <span class="keyword">if</span>(<span class="built_in">String</span>(mnum).length === <span class="number">1</span> ){</span><br><span class="line"> mnum = <span class="string">"0"</span> + mnum;</span><br><span class="line"> }</span><br><span class="line"> seconds = (now - start) / <span class="number">1000</span> - (<span class="number">24</span> * <span class="number">60</span> * <span class="number">60</span> * dnum) - (<span class="number">60</span> * <span class="number">60</span> * hnum) - (<span class="number">60</span> * mnum);</span><br><span class="line"> snum = <span class="built_in">Math</span>.round(seconds);</span><br><span class="line"> <span class="keyword">if</span>(<span class="built_in">String</span>(snum).length === <span class="number">1</span> ){</span><br><span class="line"> snum = <span class="string">"0"</span> + snum;</span><br><span class="line"> }</span><br><span class="line"> <span class="comment">/** 字样根据需要调整 **/</span></span><br><span class="line"> <span class="built_in">document</span>.getElementById(<span class="string">"timeDate"</span>).innerHTML = <span class="string">"本站安全运行&nbsp"</span>+dnum+<span class="string">"&nbsp天"</span>;</span><br><span class="line"> <span class="built_in">document</span>.getElementById(<span class="string">"times"</span>).innerHTML = hnum + <span class="string">"&nbsp小时&nbsp"</span> + mnum + <span class="string">"&nbsp分&nbsp"</span> + snum + <span class="string">"&nbsp秒啦，咱不能老偷瓜的！"</span>;</span><br><span class="line"> }</span><br><span class="line"></span><br><span class="line"> update();</span><br><span class="line"> <span class="built_in">setInterval</span>(update, <span class="number">1000</span>);</span><br><span class="line">})();</span><br></pre></td></tr></table></figure><p>相关的 styl 样式如下：</p><figure class="highlight styl"><table><tr><td class="code"><pre><span class="line">#footer</span><br><span class="line"> .footer-<span class="attribute">content</span></span><br><span class="line"> <span class="attribute">padding</span>: <span class="number">2rem</span> <span class="number">0</span> <span class="number">0</span> <span class="number">0</span></span><br><span class="line"> <span class="attribute">text-align</span>: center</span><br><span class="line"> a</span><br><span class="line"> <span class="attribute">font-family</span>: <span class="string">'aqqxs'</span>, sans-serif</span><br><span class="line"> <span class="attribute">color</span>: var(--font-color)</span><br><span class="line"> <span class="attribute">font-size</span>: <span class="number">1rem</span></span><br><span class="line"> .statistics</span><br><span class="line"> <span class="attribute">padding-top</span>: <span class="number">0.6rem</span></span><br><span class="line"> <span class="attribute">display</span>: flex</span><br><span class="line"> <span class="attribute">flex-direction</span>: column</span><br><span class="line"> <span class="attribute">justify-content</span>: center</span><br><span class="line"> <span class="attribute">font-family</span>: <span class="string">'Noto Serif SC'</span>, -apple-system,BlinkMacSystemFont,Roboto,Segoe UI,Helvetica,Arial,serif</span><br><span class="line"> <span class="attribute">font-size</span>: <span class="number">0.6rem</span></span><br><span class="line"> #site_pv</span><br><span class="line"> <span class="attribute">display</span>: inline</span><br><span class="line"> <span class="attribute">text-align</span>: center</span><br><span class="line"> #site_uv</span><br><span class="line"> <span class="attribute">display</span>: inline</span><br><span class="line"> <span class="attribute">text-align</span>: center</span><br></pre></td></tr></table></figure>
</div>
</details>
<details blue open><summary> 看心情的页脚移植待办 </summary>
<div class='content'>
<div class='checkbox red'><input type="checkbox" /> <p>徽标（暂时没备案就懒得搞）</p> </div><div class='checkbox blue'><input type="checkbox" /> <p>背景（看猹什么时候愿意画画）</p> </div>
</div>
</details>
<hr>
<h3 id="售后（糖果屋小广告"><a href="#售后（糖果屋小广告" class="headerlink" title="售后（糖果屋小广告"></a>售后（糖果屋小广告</h3><p>菜单栏的魔改就这样结束啦！如果有需要询问的，可以加入糖果屋交流讨论（猹已经常驻糖果屋且不想开自己的群</p>
<img src=https://noionion-picture-bed.oss-cn-hangzhou.aliyuncs.com/img/akicandyroom.jpg alt='🧊Akilarの糖果屋' style='max-height:500px'> </article><div class="post-copyright"><div class="post-copyright__title"><span class="post-copyright-info"><h>猹的魔改日记-小小的重写个页脚</h></span></div><div class="post-copyright__type"><span class="post-copyright-info"><a href="https://szsyzx.github.io/46524.html">https://szsyzx.github.io/46524.html</a></span></div><div class="post-copyright-m"><div class="post-copyright-m-info"><div class="post-copyright-a"><h>作者</h><div class="post-copyright-cc-info"><h>𝓨𝓾𝔂𝓪𝓷</h></div></div><div class="post-copyright-c"><h>发布于</h><div class="post-copyright-cc-info"><h>2022-08-17</h></div></div><div class="post-copyright-u"><h>更新于</h><div class="post-copyright-cc-info"><h>2022-08-17</h></div></div><div class="post-copyright-c"><h>许可协议</h><div class="post-copyright-cc-info"><a class="icon" rel="noopener" target="_blank" title="Creative Commons" href="https://creativecommons.org/"><i class="fab fa-creative-commons"></i></a><a rel="noopener" target="_blank" title="CC BY-NC-SA 4.0" href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a></div></div></div></div></div><div class="tag_share"><div class="post-meta__tag-list"><a class="post-meta__tags" href="/tags/hexo/">hexo</a><a class="post-meta__tags" href="/tags/butterfly/">butterfly</a><a class="post-meta__tags" href="/tags/Course/">Course</a></div><div class="post_share"><div class="social-share" data-image="https://imgsrc.baidu.com/super/pic/item/513d269759ee3d6dd92dd61506166d224e4ade01.jpg" data-sites="facebook,twitter,wechat,weibo,qq"></div><link rel="stylesheet" href="https://cdnjs.sourcegcdn.com/ajax/libs/social-share.js/1.0.16/css/share.min.css" media="print" onload="this.media='all'"><script src="https://cdnjs.sourcegcdn.com/ajax/libs/social-share.js/1.0.16/js/social-share.min.js" defer></script></div></div><div class="relatedPosts"><div class="headline is-center"><span> 相关推荐</span></div><div class="relatedPosts-list"><div><a href="/12280.html" title="猹的魔改日记-菜单栏及移动端侧边菜单栏的魔改"><img class="cover" src="https://imgsrc.baidu.com/super/pic/item/36d12f2eb9389b509316b18cc035e5dde6116e07.jpg" alt="cover"><div class="content is-center"><div class="date"><i class="fas fa-history fa-fw"></i> 2021-08-22</div><div class="title">猹的魔改日记-菜单栏及移动端侧边菜单栏的魔改</div></div></a></div><div><a href="/40244.html" title="猹的魔改日记-小菜单和复制/F12提示栏"><img class="cover" src="https://imgsrc.baidu.com/super/pic/item/912397dda144ad349c57d65995a20cf430ad8500.jpg" alt="cover"><div class="content is-center"><div class="date"><i class="fas fa-history fa-fw"></i> 2021-11-30</div><div class="title">猹的魔改日记-小菜单和复制/F12提示栏</div></div></a></div></div></div><div id="post-comment"><div class="comment-head is-center"><div class="comment-headline"><span> 评论</span></div></div><div class="comment-wrap"><div><div id="twikoo-wrap"></div></div></div></div></div></main><footer id="footer"><div class="wordcount"><span>本站更新了 33.3k 字</span></br><span>还在努力更新中.. 加油！加油啦！</span></div><div class="footer-content"><a href="https://hexo.io" target="_blank" rel="nofollow noopener"><span style="padding: 0.4rem">hexo</span></a><a><i class="fas fa-heart"></i></a><a href="https://butterfly.js.org/" target="_blank" rel="nofollow noopener"><span style="padding: 0.4rem">butterfly</span></a><div style="font-size: 0.7rem"><span id="timeDate">载入天数...</span><span> </span><span id="times">载入时分秒...</span><script src="/js/add/duration.js"></script></div></div><div class="statistics"><span id="site_uv">有 <span id="busuanzi_value_site_uv"></span><span> 人光顾过我的小窝</span></span><span id="site_pv"><span>共 </span><span id="busuanzi_value_site_pv"></span><span> 次在这里摘了个瓜</span></span></div></footer></div><div id="rightside"><div id="rightside-menu"><div id="rightside-avatar-card"><div class="is-center" id="rightside-avatar"><div class="avatar-img"><img src="https://s2.loli.net/2022/09/05/XIJ8QimgfoG6khP.jpg" onerror="this.onerror=null;this.src='/img/friend_404.gif'" alt="avatar"></div><div class="author-info__name">𝓨𝓾𝔂𝓪𝓷</div><div class="author-info__description">欢迎光临小窝！</div></div><div class="site-data"><div class="data-item is-center"><div class="data-item-link"><a href="/archives/"><div class="headline">文章</div><div class="length-num">55</div></a></div></div><div class="data-item is-center"><div class="data-item-link"><a href="/tags/"><div class="headline">标签</div><div class="length-num">34</div></a></div></div><div class="data-item is-center"><div class="data-item-link"><a href="/categories/"><div class="headline">分类</div><div class="length-num">20</div></a></div></div></div><a class="button--animated" id="card-info-btn" target="_blank" rel="noopener" href="https://github.com/szsyzx"><i class="fab fa-github"></i><span> Follow Me</span></a><div class="menu-info-social-icons is-center"><a class="social-icon" href="https://github.com/szsyzx" target="_blank" title="Github"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-github"></use></svg></a><a class="social-icon" href="mailto:[email protected]" target="_blank" title="Email"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-youxiang"></use></svg></a><a class="social-icon" href="https://space.bilibili.com/238053726" target="_blank" title="Bilibili"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-CN_bilibiliB"></use></svg></a><a class="social-icon" href="https://music.163.com/#/user/home?id=3873812910" target="_blank" title="网易云"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-yinle"></use></svg></a><a class="social-icon" href="//rss.xml" target="_blank" title="rss"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-rss"></use></svg></a></div></div><div class="is-center" id="rightside-menus"><button id="rightside-childmenu-contents" type="button" title="目录"><i class="fas fa-list-ul"></i></button><button id="rightside-childmenu-comment"><a href="#post-comment" title="直达评论"><i class="fas fa-comments"></i></a></button><button id="rightside-childmenu-go-up" type="button" title="回到顶部"><i class="fas fa-arrow-up"></i></button><button id="rightside-childmenu-unfold" type="button" title="展开菜单"><i class="fas fa-angle-up"></i></button><button id="rightside-childmenu-fold" type="button" title="收起菜单"><i class="fas fa-angle-down"></i></button></div></div><div id="rightside-contents"><div class="card-widget" id="card-toc"><div class="item-headline is-center"><i class="fas fa-stream"></i><span>目录</span></div><div class="toc-content"><ol class="toc"><li class="toc-item toc-level-2"><a class="toc-link" href="#%E5%89%8D%E8%A8%80"><span class="toc-text">前言</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#%E9%A1%B5%E8%84%9A%E9%AD%94%E6%94%B9%E4%B8%A4%E9%83%A8%E5%88%86"><span class="toc-text">页脚魔改两部分</span></a><ol class="toc-child"><li class="toc-item toc-level-3"><a class="toc-link" href="#%E5%B7%B2%E7%BB%8F%E5%86%99%E5%AE%8C%E4%BA%86%E5%93%AA%E6%9C%AC%E4%B9%A6%EF%BC%9F"><span class="toc-text">已经写完了哪本书？</span></a></li><li class="toc-item toc-level-3"><a class="toc-link" href="#fluid%E9%A3%8E%E6%A0%BC%E9%A1%B5%E8%84%9A"><span class="toc-text">fluid风格页脚</span></a></li><li class="toc-item toc-level-3"><a class="toc-link" href="#%E5%94%AE%E5%90%8E%EF%BC%88%E7%B3%96%E6%9E%9C%E5%B1%8B%E5%B0%8F%E5%B9%BF%E5%91%8A"><span class="toc-text">售后（糖果屋小广告</span></a></li></ol></li></ol></div></div></div></div><div id="local-search"><div class="search-dialog"><div class="search-dialog__title" id="local-search-title">本地搜索</div><div id="local-input-panel"><div id="local-search-input"><div class="local-search-box"><input class="local-search-box--input" placeholder="搜索文章" type="text"/></div></div></div><hr/><div id="local-search-results"></div><span class="search-close-button"><i class="fas fa-times"></i></span></div><div id="search-mask"></div></div><div><script src="/js/utils.js"></script><script src="/js/main.js"></script><script src="/js/search/local-search.js"></script><div class="js-pjax"><script>(()=>{
const $countDom = document.getElementById('twikoo-count')
const init = () => {
let initData = {
el: '#twikoo-wrap',
envId: 'blog-twikoo-5gjox0si204192ef',
region: ''
}
if (false) {
const otherData = false
initData = Object.assign(initData, otherData)
}
twikoo.init(initData)
}
const getCount = () => {
twikoo.getCommentsCount({
envId: 'blog-twikoo-5gjox0si204192ef',
region: '',
urls: [window.location.pathname],
includeReply: false
}).then(function (res) {
$countDom.innerText = res[0].count
}).catch(function (err) {
console.error(err);
});
}
const loadTwikoo = (bool = false) => {
if (typeof twikoo === 'object') {
init()
bool && $countDom && setTimeout(getCount,0)
} else {
getScript('https://cdnjs.sourcegcdn.com/ajax/libs/twikoo/1.5.4/twikoo.all.min.js').then(()=> {
init()
bool && $countDom && setTimeout(getCount,0)
})
}
}
if ('Twikoo' === 'Twikoo' || !true) {
if (true) btf.loadComment(document.getElementById('twikoo-wrap'), loadTwikoo)
else loadTwikoo(true)
} else {
window.loadOtherComment = () => {
loadTwikoo()
}
}
})()</script></div><script async src="//at.alicdn.com/t/font_2749059_1lswi5j6yqg.js"></script><script src="/js/add/nav.js"></script><script src="/js/add/rightside.js"></script><script src="https://cdn1.tianli0.top/npm/butterfly-extsrc@1/dist/activate-power-mode.min.js"></script><script>POWERMODE.colorful = true;
POWERMODE.shake = false;
POWERMODE.mobile = false;
document.body.addEventListener('input', POWERMODE);
</script><script async data-pjax src="//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script></div><!-- hexo injector body_end start --><script data-pjax>
function butterfly_footer_beautify_injector_config(){
var parent_div_git = document.getElementById('footer-wrap');
var item_html = '<div id="workboard"></div><div id="ghbdages" style="overflow:hidden;max-height:180px;height:auto;text-align:center;margin-top:10px"><div class="swiper-wrapper"><div class="swiper-slide"><a class="github-badge" target="_blank" href="https://hexo.io/" style="margin-inline:5px" title="博客框架为Hexo_v5.3.0"><img src="https://img.shields.io/badge/Frame-Hexo-blue?style=flat&logo=hexo" alt=""/></a><a class="github-badge" target="_blank" href="https://butterfly.js.org/" style="margin-inline:5px" title="主题版本Butterfly_v3.7.0-b2"><img src="https://img.shields.io/badge/Theme-Butterfly-6513df?style=flat&logo=bitdefender" alt=""/></a><a class="github-badge" target="_blank" href="https://www.sourcegcdn.com/" style="margin-inline:5px" title="本站使用Source Global CDN为部分静态资源提供CDN加速"><img src="https://img.shields.io/badge/CDN-sourcegcdn-orange?style=flat&logo=Apache%20RocketMQ" alt=""/></a><a class="github-badge" target="_blank" href="https://www.jsdelivr.com/" style="margin-inline:5px" title="本站使用JsDelivr仅用于访问部分静态资源"><img src="https://img.shields.io/badge/CDN-jsDelivr-orange?style=flat&logo=jsDelivr" alt=""/></a><a class="github-badge" target="_blank" href="https://github.com/" style="margin-inline:5px" title="本站项目由Github托管"><img src="https://img.shields.io/badge/Source-Github-d021d6?style=flat&logo=GitHub" alt=""/></a><a class="github-badge" target="_blank" href="http://creativecommons.org/licenses/by-nc-sa/4.0/" style="margin-inline:5px" title="本站采用知识共享署名-非商业性使用-相同方式共享4.0国际许可协议进行许可"><img src="https://img.shields.io/badge/Copyright-BY--NC--SA%204.0-d42328?style=flat&logo=Claris" alt=""/></a></div></div></div><style>a.github-badge:hover:before {display:none}</style>';
console.log('已挂载butterfly_footer_beautify')
parent_div_git.insertAdjacentHTML("beforeend",item_html)
}
var elist = 'null'.split(',');
var cpage = location.pathname;
var epage = 'all';
var flag = 0;
for (var i=0;i<elist.length;i++){
if (cpage.includes(elist[i])){
flag++;
}
}
if ((epage ==='all')&&(flag == 0)){
butterfly_footer_beautify_injector_config();
}
else if (epage === cpage){
butterfly_footer_beautify_injector_config();
}
</script><script async src="https://npm.elemecdn.com/[email protected]/lib/runtime.js"></script><script defer src="https://npm.elemecdn.com/hexo-butterfly-swiper/lib/swiper.min.js"></script><script defer data-pjax src="https://npm.elemecdn.com/hexo-butterfly-footer-beautify/lib/swiperbdage_init_js.min.js"></script><!-- hexo injector body_end end --></body></html>