-
Notifications
You must be signed in to change notification settings - Fork 3
/
Copy pathatom.xml
633 lines (305 loc) · 206 KB
/
atom.xml
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
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
<?xml version="1.0" encoding="utf-8"?>
<feed xmlns="http://www.w3.org/2005/Atom">
<title>黑石博客 - Hexo博客</title>
<link href="https://www.heson10.com/atom.xml" rel="self"/>
<link href="https://www.heson10.com/"/>
<updated>2022-06-07T14:18:23.272Z</updated>
<id>https://www.heson10.com/</id>
<author>
<name>Heson</name>
</author>
<generator uri="https://hexo.io/">Hexo</generator>
<entry>
<title>给哔哔安了个家</title>
<link href="https://www.heson10.com/posts/21347.html"/>
<id>https://www.heson10.com/posts/21347.html</id>
<published>2021-01-09T14:26:49.000Z</published>
<updated>2022-06-07T14:18:23.272Z</updated>
<content type="html"><![CDATA[<p><a href="https://bb.js.org/">https://bb.js.org</a> 上线了。</p><p>前面关于适配哔哔杂七杂八写了好多文章，总感觉特别乱。</p><p>为了方便哔哔更好地适配，更为了给哔哔添加新的功能，我把哔哔的前端代码重构了，使用<code>Webpack</code>打包为<code>bbtalk.js</code>。</p><article class="message lv"><div class="message_body"><p>这样日后更新只用改版本号，添加功能只用增添配置项即可。</p></div></article><p>哔哔以后的教程会直接在官网更新。</p><p>在适配和功能上有什么需求，请移步<a href="https://github.com/BBtalkJS/BBtalk/issues">https://github.com/BBtalkJS/BBtalk/issues</a></p>]]></content>
<summary type="html"><p><a href="https://bb.js.org/">https://bb.js.org</a> 上线了。</p>
<p>前面关于适配哔哔杂七杂八写了好多文章，总感觉特别乱。</p>
<p>为了方便哔哔更好地适配，更为了给哔哔添加新的功能，我把哔哔的前端代码重构了，使用</summary>
<category term="技术交流" scheme="https://www.heson10.com/categories/%E6%8A%80%E6%9C%AF%E4%BA%A4%E6%B5%81/"/>
<category term="hexo" scheme="https://www.heson10.com/categories/hexo/"/>
<category term="哔哔" scheme="https://www.heson10.com/categories/hexo/%E5%93%94%E5%93%94/"/>
<category term="哔哔" scheme="https://www.heson10.com/tags/%E5%93%94%E5%93%94/"/>
</entry>
<entry>
<title>黑石哔哔支持微信直发图片功能</title>
<link href="https://www.heson10.com/posts/61220.html"/>
<id>https://www.heson10.com/posts/61220.html</id>
<published>2020-12-24T23:22:26.000Z</published>
<updated>2022-06-07T14:18:23.272Z</updated>
<content type="html"><![CDATA[<p>🙄什么是图片直发？发个图就知道了</p><p><img src="https://picup.heson10.com/img/upyun/2020/12/image-20201229181910083.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/12/image-20201229181910083.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="黑石哔哔图片直发功能"></p><p>这个功能咕了2个月了，今天终于写好了，开个贴纪念一下😁。</p><p>其实2个月之前，这个功能代码已经写的差不多了，但在测试的时候一直报错，关于腾讯云函数临时空间<code>tmp</code>写入权限的问题。当时用的<code>path</code>调用的是当前目录下的<code>/tmp</code>文件夹，一直报错没有权限😅。今天突然发现，有写入权限的<code>tmp</code>文件夹不在函数内部，而是在根目录里。感觉腾讯云开发文档里面写的不是很清楚，或者说是我太菜了没看明白😂。</p><p>腾讯云有关<code>tmp</code>文件参考<a href="https://cloud.tencent.com/document/product/583/9694">https://cloud.tencent.com/document/product/583/9694</a></p><h2 id="🎄什么是哔哔？"><a href="#🎄什么是哔哔？" class="headerlink" title="🎄什么是哔哔？"></a>🎄什么是哔哔？</h2><article class="message lan"><div class="message_body"><p>通过给微信公众号发消息，同步到博客的一个小功能。</p></div></article><p>效果图：</p><p><img src="https://picup.heson10.com/img/upyun/2020/11/20201130221518.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/11/20201130221518.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="哔哔效果图"></p><p>系列文章→<a href="/categories/hexo/%E5%93%94%E5%93%94/">点我直达</a></p><h2 id="🔧TO-DO"><a href="#🔧TO-DO" class="headerlink" title="🔧TO DO"></a>🔧TO DO</h2><p> 总算把一个大问题解决了，这两天准备再优化一下:</p><ul><li><code>hexo-bb</code>插件支持微信表情转义😀😁😂🤣</li><li>哔哔后端代码优化</li><li>哔哔图片存储更换为<code>去不图床</code></li><li>哔哔文档</li></ul><h2 id="😉关于哔哔中微信表情的转义"><a href="#😉关于哔哔中微信表情的转义" class="headerlink" title="😉关于哔哔中微信表情的转义"></a>😉关于哔哔中微信表情的转义</h2><p>转义用的是 <a href="https://github.com/buddys/qq-wechat-emotion-parser">https://github.com/buddys/qq-wechat-emotion-parser</a></p><p>里面表情不是很全，当前提了<code>issues</code>想让作者更新下（感觉希望不大，作者已经好久好久没更新了🤣）。准备自己再找找最新的微信表情，自己整一个。</p><p>已经改过哔哔代码的小伙伴，可自行添加：</p><pre><code class="html"><script src="https://cdn.jsdelivr.net/gh/buddys/qq-wechat-emotion-parser@master/dist/qq-wechat-emotion-parser.min.js"></script></code></pre><p>js加到这里：</p><p><img src="https://picup.heson10.com/img/upyun/2020/12/image-20201224234653465.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/12/image-20201224234653465.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="哔哔模板添加微信emoji转义"></p><p>然后找到<code>function urlToLink(str)</code>函数，在最下面<code>return</code>的上一行添加：</p><pre><code class="javascript">str = qqWechatEmotionParser(str)</code></pre><p>如图：</p><p><img src="https://picup.heson10.com/img/upyun/2020/12/image-20201224234840052.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/12/image-20201224234840052.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="bb添加微信表情转义"></p><p>ok，各位</p><p>圣诞快乐！</p><h2 id="💗公众号"><a href="#💗公众号" class="headerlink" title="💗公众号"></a>💗公众号</h2><p><img src="https://picup.heson10.com/img/upyun/2020/10/bbbbb.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/bbbbb.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="黑石哔哔"></p>]]></content>
<summary type="html"><p>🙄什么是图片直发？发个图就知道了</p>
<p><img src="https://picup.heson10.com/img/upyun/2020/12/image-20201229181910083.png" class="lazyload" data-srcset=</summary>
<category term="hexo" scheme="https://www.heson10.com/categories/hexo/"/>
<category term="哔哔" scheme="https://www.heson10.com/categories/hexo/%E5%93%94%E5%93%94/"/>
<category term="hexo" scheme="https://www.heson10.com/tags/hexo/"/>
<category term="哔哔" scheme="https://www.heson10.com/tags/%E5%93%94%E5%93%94/"/>
</entry>
<entry>
<title>Hexo 部署至云服务器（宝塔面板）</title>
<link href="https://www.heson10.com/posts/51315.html"/>
<id>https://www.heson10.com/posts/51315.html</id>
<published>2020-12-18T10:36:07.000Z</published>
<updated>2022-06-07T14:18:23.272Z</updated>
<content type="html"><![CDATA[<h2 id="🎄简介"><a href="#🎄简介" class="headerlink" title="🎄简介"></a>🎄简介</h2><p>hexo 博客部署方法有好多种，<code>github pages</code>、<code>gitee pages(pro)</code>、<code>vercel</code>，<code>cloudflare page</code>、<code>阿里云oss</code>、<code>腾讯存储桶</code>等等这些不需要购买服务器的部署方式。一般大部分都用以上方式部署自己的hexo博客，但也有少部分部署在<code>自己服务器</code>的同志。</p><p>新手部署服务器最常见的方法就是：直接把本地生成的<code>public</code>中的文件，直接ftp到服务器<code>www根目录</code>，简单粗暴。</p><p>还有一种更优雅地方式，那就是直接在服务器上搭建<code>git仓库</code>，hexo三连直接<code>deploy</code>上去（跟搭建在github pages上的方式一样）。</p><h2 id="💻为什么要部署至服务器？"><a href="#💻为什么要部署至服务器？" class="headerlink" title="💻为什么要部署至服务器？"></a>💻为什么要部署至服务器？</h2><p>个人感觉手头有闲置的网速较快的服务器，可以尝试部署至服务器。</p><p>比如我手头有一个<code>腾讯云香港二区 2核 4GB 5M的服务器。</code>对比了一下我放在又拍云cdn上的主站网速，可以看到：</p><p><img src="https://picup.heson10.com/img/upyun/2020/12/Snipaste_2020-12-18_11-11-36.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/12/Snipaste_2020-12-18_11-11-36.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="Snipaste_2020-12-18_11-11-36"></p><p><strong>这速度可谓不相上下。</strong></p><p>相比起github pages的慢、coding pages的抽（移动宽带经常抽），服务器部署还是有一定优势的。</p><p>当然，如果域名<code>备案</code>了，手头没有闲置的<code>服务器</code>，还是建议嫖上国内的CDN（又拍云）。</p><h2 id="🎁部署教程"><a href="#🎁部署教程" class="headerlink" title="🎁部署教程"></a>🎁部署教程</h2><p>老样子，简单说下思路：</p><ul><li>服务器安装宝塔面板（方法可见<a href="/posts/44528.html">《在腾讯云服务器上搭建WordPress》</a>前半部分，宝塔面板的安装）</li><li>创建git仓库，并配置git钩子，自动同步文件到网站目录</li><li>配置网站访问设置</li><li>本地<code>git deploy</code>设置</li></ul><h3 id="准备工作"><a href="#准备工作" class="headerlink" title="准备工作"></a>准备工作</h3><p>1.云服务安装宝塔面板 <a href="https://www.heson10.com/posts/44528.html">https://www.heson10.com/posts/44528.html</a></p><p>2.本地生成ssh秘钥备用</p><pre><code class="shell">git config --global user.name "GitHub用户名"git config --global user.email "GitHub的邮箱"ssh-keygen -t rsa -C "GitHub的邮箱"</code></pre><h3 id="连接服务器终端"><a href="#连接服务器终端" class="headerlink" title="连接服务器终端"></a>连接服务器终端</h3><p>宝塔面板用户可直接左侧导航栏<code>终端</code>登录（如图）</p><p><img src="https://cdn.jsdelivr.net/gh/heson10/pic@master/pic/image-20201218232100536.png" class="lazyload" data-srcset="https://cdn.jsdelivr.net/gh/heson10/pic@master/pic/image-20201218232100536.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="宝塔终端登录"></p><ul><li>切换到 <code>root</code> 账号</li></ul><pre><code class="shell">sudo su root</code></pre><p> 宝塔默认是root账号，注意看图：</p><p><img src="https://picup.heson10.com/img/upyun/2020/12/image-20201218232821791.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/12/image-20201218232821791.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="image-20201218232821791"></p><ul><li>安装 <code>git</code> </li></ul><pre><code class="shell">yum install git</code></pre><h3 id="创建-Git-账户"><a href="#创建-Git-账户" class="headerlink" title="创建 Git 账户"></a>创建 Git 账户</h3><p>创建 Git 账户并赋予权限</p><pre><code class="shell">adduser gitchmod 740 /etc/sudoers</code></pre><p>编辑 <code>/etc/sudoers</code> 文件</p><pre><code class="shell">vim /etc/sudoers</code></pre><p>按<code>i</code>键进入编辑模式，找到<code>root ALL=(ALL) ALL</code>，在其下方加入：</p><pre><code class="shell">git ALL=(ALL) ALL</code></pre><p>如图所示：</p><p><img src="https://picup.heson10.com/img/upyun/2020/12/image-20201218233157429.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/12/image-20201218233157429.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="image-20201218233157429"></p><p>输入完成后按<code>esc</code>，再输入<code>:wq</code>，保存退出。</p><p>更变<code>/etc/sudoers</code>权限</p><pre><code class="shell">chmod 400 /etc/sudoers</code></pre><p>设置 git 账户密码</p><pre><code class="shell">sudo passwd git</code></pre><p>输入密码，输入的时候是看不到任何显示的，输完回车即可。</p><p>切换至 <code>git 用户</code>，创建 <code>~/.ssh</code> 文件夹和 <code>~/.ssh/authorized_keys</code> 文件</p><pre><code class="sh">su gitmkdir ~/.sshvim ~/.ssh/authorized_keys</code></pre><p>同样<code>i</code>进入编辑模式，把之前本地准备的<code>id_rsa.pub</code>文件中的公钥复制进去，按<code>esc</code>后，输入<code>:wq</code>保存。</p><p>更改权限：</p><pre><code class="shell">chmod 600 /home/git/.ssh/authorized_keyschmod 700 /home/git/.ssh</code></pre><p>本地测试：</p><pre><code class="shell">ssh -v git@服务器ip地址或域名</code></pre><p>不用输密码就成了。</p><h3 id="创建git仓库"><a href="#创建git仓库" class="headerlink" title="创建git仓库"></a>创建git仓库</h3><p>切换为<code>root</code>用户</p><pre><code class="shell">sudo su root</code></pre><p>创建<code>repo</code>作为仓库目录，并加权限</p><pre><code class="shell">mkdir /var/repochown -R git:git /var/repochmod -R 755 /var/repo</code></pre><p>创建 hexo 目录作为网站根目录</p><pre><code class="shell">mkdir /var/hexochown -R git:git /var/hexochmod -R 755 /var/hexo</code></pre><p>创建一个空白的 git 仓库</p><pre><code class="shell">cd /var/repogit init --bare hexo.git</code></pre><p>编辑一个 Git 钩子</p><pre><code class="shell">vim /var/repo/hexo.git/hooks/post-receive</code></pre><p>按<code>i</code>进入编辑模式，添加下面的代码，按<code>esc</code>输入<code>:wq</code> 保存</p><pre><code class="shell">#!/bin/bashgit --work-tree=/var/hexo --git-dir=/var/repo/hexo.git checkout -f</code></pre><p>更改权限</p><pre><code class="shell">chown -R git:git /var/repo/hexo.git/hooks/post-receivechmod +x /var/repo/hexo.git/hooks/post-receive</code></pre><h3 id="宝塔网站配置"><a href="#宝塔网站配置" class="headerlink" title="宝塔网站配置"></a>宝塔网站配置</h3><p>创建一个网站</p><p><img src="https://picup.heson10.com/img/upyun/2020/12/image-20201218235031007.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/12/image-20201218235031007.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="image-20201218235031007"></p><h3 id="本地-Git-deploy-设置"><a href="#本地-Git-deploy-设置" class="headerlink" title="本地 Git deploy 设置"></a>本地 Git deploy 设置</h3><p>安装git部署插件</p><pre><code class="shell">npm install hexo-deployer-git --save</code></pre><p>在博客根目录配置</p><pre><code class="yaml">deploy: type: git repo: git@服务器ip或域名:/var/repo/hexo.git branch: master</code></pre><h2 id="🧧结束语"><a href="#🧧结束语" class="headerlink" title="🧧结束语"></a>🧧结束语</h2><article class="message zi"><div class="message_body"><p>码字不易！配置成功的小伙伴留个评论!✨没成功的更要留个评论！🎃</p></div></article><p>配置完成后，可直接hexo三连到自己的服务器。简单快捷。</p><p>如有报错，可贴评论区。欢迎指正！</p><h4 id="参考链接"><a href="#参考链接" class="headerlink" title="参考链接"></a>参考链接</h4><p><a href="https://hjxlog.com/posts/20191130a1.html">将Hexo部署到阿里云轻量服务器</a></p>]]></content>
<summary type="html"><h2 id="🎄简介"><a href="#🎄简介" class="headerlink" title="🎄简介"></a>🎄简介</h2><p>hexo 博客部署方法有好多种，<code>github pages</code>、<code>gitee pages(pr</summary>
<category term="hexo" scheme="https://www.heson10.com/categories/hexo/"/>
<category term="部署" scheme="https://www.heson10.com/categories/hexo/%E9%83%A8%E7%BD%B2/"/>
<category term="hexo" scheme="https://www.heson10.com/tags/hexo/"/>
<category term="部署" scheme="https://www.heson10.com/tags/%E9%83%A8%E7%BD%B2/"/>
<category term="服务器" scheme="https://www.heson10.com/tags/%E6%9C%8D%E5%8A%A1%E5%99%A8/"/>
</entry>
<entry>
<title>Typecho Cuteen4 哔哔页面适配</title>
<link href="https://www.heson10.com/posts/57231.html"/>
<id>https://www.heson10.com/posts/57231.html</id>
<published>2020-12-04T20:07:44.000Z</published>
<updated>2022-06-07T14:18:23.272Z</updated>
<content type="html"><![CDATA[<article class="message lv"><div class="message_body"><p>喜大普奔，Cuteen4 于昨天上线了！今天有小伙伴留言说想适配哔哔。开整！</p></div></article><p>demo: <a href="https://typecho.heson10.com/index.php/9.html">https://typecho.heson10.com/index.php/9.html</a></p><h2 id="准备工作"><a href="#准备工作" class="headerlink" title="准备工作"></a>准备工作</h2><ul><li>Leancloud创建存储空间</li><li>微信公众号绑定</li></ul><p>具体方法之前有说。<a href="/posts/58339.html#%E5%87%86%E5%A4%87%E5%B7%A5%E4%BD%9C">点我直达</a></p><h2 id="创建bb-php"><a href="#创建bb-php" class="headerlink" title="创建bb.php"></a>创建bb.php</h2><p>在主题目录<code>\usr\themes\Cuteen</code>下新建<code>bb.php</code>模板，加入以下代码：</p><pre><code class="php"><?php/** * 哔哔页面 * @package custom */$this->need('base/head.php');$this->need('base/navbar.php');?><div class="row justify-content-center <?= Ctx::SidebarArray()[0] ?>"> <?= Ctx::Sidebar($this) ?> <div id="content" class="col-lg-9"> <section class="post-ctx"> <?=Ctx::HeroTitleNoImg($this)?> <article id="post"> <?= Ctx::Post($this,$this->user->hasLogin()) ?> <main id="app"> <article class="message lan"><div class="message_body">共计发送 {{count}} 条说说</div></article> <div class="timenode" v-for="item in contents" v-cloak> <div class="meta"> <p><time v-bind:datetime="item.attributes.time">{{item.attributes.time}}</time></p> </div> <div class="body"> <p v-html='item.attributes.content'></p> </div> </div> <div class="load-ctn"> <a class="btn btn-success" role="button" v-on:click="loadMore" v-if="contents" v-cloak>再翻翻</a> <p class="tip" v-else>别急，加载呢</p> </div> </main> </article> <footer id="post-info"> </footer> </section> <style> @font-face { font-family: "iconfont"; src: url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.eot?t=1586882866168'); /* IE9 */ src: url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.eot?t=1586882866168#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAALcAAsAAAAAB2gAAAKPAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCCfgqCUII8ATYCJAMMCwgABCAFhG0HQBuEBsiuMRkynL4YFCHtLKs4b+k7/80U8DwHIB6+xtr7u3vniDZI6tmnkyDS8NC5iFgJlE7pTPcO8e5b+803aYQy8YtH1JPKyZzY3ttb1EonioVGSBAiRJp4JV9cFppCxLpe2z8sUs37O4QEDFRM0lFeAw4XN6bQPG06zTG8DRwHFOBeGEVWIjE+mP8wduVFPCbQNK4ktN8/OgFJhbEqEFemLkEyFVcUVqoL1ZKDRbyIqafb9AA8+9+PX41IklQyY+PBSZ8KnR+9iBx0OxZcp8PxvGDHyFgACnFY6j8QCfMLIppKPmoCrGtW8OG/y0eufLX/8AiJqDKa22AGWpMzUth6p6aARySQQRUUL4AnSBmuyvIwPdbz21OX5ybO5duOJifaLl6cvkrd1HR7kWEy6yikff29PvgO17V/Tf/9f/oN3PDqz22a719IYlZJHQetpLY08MV6fwFDrF0B6F4XyB3/FyEEnZnU2XGtVwHvpxtA1d6pftKB4AcoWo4U1QQbiiy35Xow27whbwK2NNFlhAc99zeOtM4S6ikFQ1IzhqxuglAoC6ho2UBV3Raa5g0cbxnCRURpYM4pQOh3h6TXG7J+j4RCeULFqFdU9UcETYfRdGHLVJjpHk6SIBXlTTQV5mmWS6SD1jHSVx2JJ1U+a4p4YKawvrSSLQ2QR3yMLcGa3hBCQ40zF/vBc+Q4DH3OLFJExRDCb64un5S9qaIwF9L2cEQiEBWSbUImBePR3PFCOvf5MUS3yiHhNR0VySmEC5jTo7qKWgvCgN5r1XEtrwTW6BoEQYM0HONC/cBLHDPPIL98noUohAqjR7uvWVV1HlVbfWV+o/t8J6DJOJ4jRY6idmVKnmVS1q8tK8zfBAAA') format('woff2'), url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.woff?t=1586882866168') format('woff'), url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.ttf?t=1586882866168') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */ url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.svg?t=1586882866168#iconfont') format('svg'); /* iOS 4.1- */ } #app img{display: block;} .iconfont { font-family: "iconfont" !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-lianjie:before { content: "\e6a3"; } .icon-lianjie-copy:before { content: "\e6a4"; }/* bb样式 */div.timenode { position: relative; } div.timenode:before, div.timenode:after { content: ''; z-index: 1; position: absolute; background: rgba(68,215,182,0.5); width: 2px; left: 7px; } div.timenode:before { top: 0px; height: 6px; } div.timenode:after { top: 26px; height: calc(100% - 26px); } div.timenode:last-child:after { height: calc(100% - 26px - 16px); border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; } div.timenode .meta, div.timenode .body { max-width: calc(100% - 24px); } div.timenode .meta { position: relative; color: var(--color-meta); font-size: 0.875rem; line-height: 32px; height: 32px; } div.timenode .meta:before, div.timenode .meta:after { content: ''; position: absolute; top: 8px; z-index: 2; } div.timenode .meta:before { background: rgba(68,215,182,0.5); width: 16px; height: 16px; border-radius: 8px; } div.timenode .meta:after { background: #44d7b6; margin-left: 2px; margin-top: 2px; width: 12px; height: 12px; border-radius: 6px; transform: scale(0.5); transition: all 0.28s ease; -moz-transition: all 0.28s ease; -webkit-transition: all 0.28s ease; -o-transition: all 0.28s ease; } div.timenode .meta p { font-weight: bold; margin: 0 0 0 24px; } div.timenode .body { margin: 4px 0 16px 24px; padding: 16px; border-radius: 8px; background: var(--color-block); display: inline-block; } div.timenode .body:empty { display: none; } div.timenode .body >*:first-child { margin-top: 0.25em; } div.timenode .body >*:last-child { margin-bottom: 0.25em; } div.timenode .body .highlight { border: 1px solid #e4e4e4; } div.timenode:hover .meta { color: var(--color-text); } div.timenode:hover .meta:before { background: rgba(255,87,34,0.5); } div.timenode:hover .meta:after { background: #ff5722; transform: scale(1); } div.timenode .body { margin: 0 0 0 24px; padding: 16px; border-radius: 8px; background: #f6f6f6; display: inline-block;}/*bb暗黑样式*/.dark-mode .timenode meta p{ color: #fff;}.dark-mode .timenode p,.dark-mode .timenode li{ color: #555;}.dark-mode .timenode blockquote p{ color:#cfcfcf}.dark-mode .timenode p a{ color: rgb(36, 122, 62);}.dark-mode .timenode .body { background: #c4c4c4;} </style><script src="https://cdn.bootcss.com/vue/2.6.11/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/av-min.js"></script><script src="<?= StaticPath . 'js/bb.js'; ?>"></script> <section id="comments" class="post-comment mt-4"> <header class="post-nav"> <span class="item"><svg class="icon mr-1" aria-hidden="true"><use xlink:href="#talk"></use></svg>页面评论</span> </header> <hr id="comment-hr"> <?php $this->need('base/comment.php'); ?> </section> </div></div><?php $this->need('base/footer.php'); ?></code></pre><h2 id="加入bb-js"><a href="#加入bb-js" class="headerlink" title="加入bb.js"></a>加入bb.js</h2><p>在主题目录下的<code>Static\Js</code>文件夹中新建<code>bb.js</code>文件，加入以下代码：</p><p>注意要修改自己的appid、appkey等参数</p><pre><code class="javascript">var { Query } = AV; AV.init({ appId: "0KzOX4vC7Jsk6vzUGNeEiUaI-gzGzoHsz", //修改leancloud appid appKey: "HwCiWuxfpvKiLm4teCUgTIba",//修改leancloud appkey serverURLs: 'https://bbapi.heson10.com' //修改api地址 https://开头 }); var query = new AV.Query('content'); var app = new Vue({ el: '#app', data: { page: 0, count: 0, contents: [] }, methods: { loadMore: function (event) { getData(++this.page); } } }) getData(0); query.count().then(function (count) { app.count = count; }, function (error) { }); //友好地显示时间 function timeago(dateTimeStamp) { var minute = 1000 * 60; //把分，时，天，周，半个月，一个月用毫秒表示 var hour = minute * 60; var day = hour * 24; var week = day * 7; var month = day * 30; var now = new Date().getTime(); //获取当前时间毫秒 var diffValue = now - dateTimeStamp; //时间差 if (diffValue < 0) { return; } var minC = diffValue / minute; //计算时间差的分，时，天，周，月 var hourC = diffValue / hour; var dayC = diffValue / day; var weekC = diffValue / week; var monthC = diffValue / month; if (monthC >= 1 && monthC <= 3) { result = " " + parseInt(monthC) + " 月前" } else if (weekC >= 1 && weekC <= 3) { result = " " + parseInt(weekC) + " 周前" } else if (dayC >= 1 && dayC <= 6) { result = " " + parseInt(dayC) + " 天前" } else if (hourC >= 1 && hourC <= 23) { result = " " + parseInt(hourC) + " 小时前" } else if (minC >= 1 && minC <= 59) { result = " " + parseInt(minC) + " 分钟前" } else if (diffValue >= 0 && diffValue <= minute) { result = "刚刚" } else { var datetime = new Date(); datetime.setTime(dateTimeStamp); var Nmonth = datetime.getMonth() + 1 < 10 ? "0" + (datetime.getMonth() + 1) : datetime.getMonth() + 1; var Ndate = datetime.getDate() < 10 ? "0" + datetime.getDate() : datetime.getDate(); result = Nmonth + "-" + Ndate } return result; }; function urlToLink(str) { // var re = /(http|ftp|https):\/\/[\w-]+(.[\w-]+)+([\w-.,@?^=%&:/~+#]*[\w-\@?^=%&/~+#])?/g; var re = /\bhttps?:\/\/(?!\S+(?:jpe?g|png|bmp|gif|webp|gif))\S+/g; var re_forpic = /\bhttps?:\/\/.*?(\.gif|\.jpeg|\.png|\.jpg|\.bmp|\.webp)/g; var re_forpic_vx = /^http:\/\/mmbiz\.qpic\.cn[^\s]*/g; str = str.replace(re, function (website) { return "<a href='" + website + "' target='_blank'> <i class='iconfont icon-lianjie-copy'></i>链接 </a>"; }); str = str.replace(re_forpic, function (imgurl) { return "<img src='" + imgurl + "' /> "; }); str = str.replace(re_forpic_vx, function (imgurl) { return "<img src='" + imgurl + "' /> "; }); return str; }; function getData(page = 0) { query.descending('createdAt').skip(page * 10).limit(10).find().then(function (results) { if (results.length == 0) { alert('之前没发表过说说了') } else { let resC = results; reqData = false; resC.forEach((i) => { let dateTmp = new Date(i.createdAt); i.attributes.time = timeago(dateTmp); i.attributes.content = urlToLink(i.attributes.content) ; app.contents.push(i); }) } }, function (error) { }); };</code></pre><h3 id="Typecho后台的设置"><a href="#Typecho后台的设置" class="headerlink" title="Typecho后台的设置"></a>Typecho后台的设置</h3><ul><li><p>新增一个哔哔页面</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201030230411049.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201030230411049.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="新增哔哔页面"></p></li><li><p>使用bb模板</p></li></ul><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201030230523121.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201030230523121.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="使用bb模板"></p><h2 id="开启了pjax的童鞋"><a href="#开启了pjax的童鞋" class="headerlink" title="开启了pjax的童鞋"></a>开启了pjax的童鞋</h2><p>请在<code>Base\footer.php</code>文件的这个地方：</p><p><img src="https://picup.heson10.com/img/upyun/2020/12/image-20201204201526004.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/12/image-20201204201526004.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="image-20201204201526004"></p><p>添加以下代码：</p><pre><code class="javascript"> getData(0); query.count().then(function (count) { app.count = count; }, function (error) { });</code></pre>]]></content>
<summary type="html"><article class="message lv"><div class="message_body"><p>喜大普奔，Cuteen4 于昨天上线了！今天有小伙伴留言说想适配哔哔。开整！</p></div></article>
<p>demo: <a href="http</summary>
<category term="typecho" scheme="https://www.heson10.com/categories/typecho/"/>
<category term="哔哔" scheme="https://www.heson10.com/tags/%E5%93%94%E5%93%94/"/>
<category term="cuteen" scheme="https://www.heson10.com/tags/cuteen/"/>
<category term="typecho" scheme="https://www.heson10.com/tags/typecho/"/>
</entry>
<entry>
<title>Hexo 博客配置 twikoo 评论系统，并调用最新评论</title>
<link href="https://www.heson10.com/posts/3217.html"/>
<id>https://www.heson10.com/posts/3217.html</id>
<published>2020-12-04T13:12:03.000Z</published>
<updated>2022-06-07T14:18:23.272Z</updated>
<content type="html"><![CDATA[<p>感谢 <a href="https://www.imaegoo.com/">iMaeGoo</a> 大佬的 <a href="https://twikoo.js.org/">Twikoo</a> 。</p><h2 id="Twikoo-评论系统是什么？"><a href="#Twikoo-评论系统是什么？" class="headerlink" title="Twikoo 评论系统是什么？"></a>Twikoo 评论系统是什么？</h2><p>Twikoo是基于腾讯云开发的一个简洁、安全、无后端的静态网站评论系统。具有免费搭建、注重隐私安全、支持邮箱和微信通知、支持反垃圾评论、支持调用最新评论、支持评论点赞等特点。</p><h2 id="我为什么选择从valine转为twikoo？"><a href="#我为什么选择从valine转为twikoo？" class="headerlink" title="我为什么选择从valine转为twikoo？"></a>我为什么选择从valine转为twikoo？</h2><p>解决了一个痛点：</p><article class="message zi"><div class="message_body"><p>在哔哔页面下实现了在线翻页</p></div></article><p>之前哔哔页面因为和valine的冲突导致不能在线翻页，现在换了twikoo之后，可以完美翻页了。</p><p>同时：</p><ul><li>搭建方便（官方文档写的很清楚，一步一步来即可）</li><li>后台配置简单（可以说把评论后台搬到了前端，不用像valine那样在leancloud里面部署valine-server）</li></ul><p>这两个特点使得配置 Twikoo 非常适合新手。</p><h2 id="最新评论的调用方法"><a href="#最新评论的调用方法" class="headerlink" title="最新评论的调用方法"></a>最新评论的调用方法</h2><p>基本的搭建官网已经讲解的很清楚了，在这里只记录twikoo最新评论的调用函数。</p><h3 id="更新"><a href="#更新" class="headerlink" title="更新"></a>更新</h3><ul><li>12月5日：（twikoo v0.2.9 新增了avatar和relativeTime相对评论时间）不用再调用友好地显示时间函数和头像获取函数</li></ul><h2 id="效果图"><a href="#效果图" class="headerlink" title="效果图"></a>效果图</h2><p><img src="https://picup.heson10.com/img/upyun/2020/12/image-20201204135615154.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/12/image-20201204135615154.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="twikoo最新评论效果图"></p><h3 id="核心js"><a href="#核心js" class="headerlink" title="核心js"></a>核心js</h3><pre><code class="javascript">//判断网址,防止访客网址不写http和https function wangzhi(e){ http = e.slice(0,4) https = e.slice(0,5) if (http == "http" || https == "https" ){ return e } else if (e == "" || e == null || e == undefined){ return e } else { e = 'http://'+ e return e } }//调用twikoo最新评论主函数function newcomment() { twikoo.getRecentComments({ envId: '你的腾讯云环境id', // 环境 ID pageSize: 7, // 获取多少条，默认：10，最大：100 includeReply: false // 是否包括最新回复，默认：false }).then(function (res) { console.log(res); var hotComments = $("#hot-comments"); for (var i = 0; i < res.length; i++) { if (i === 0) { console.log(res[0]); } var nick = res[i].nick;//访客姓名 var content = res[i].commentText;//评论内容 var newcontent = content.substring(0, 50); //字数截取后评论内容 var url = res[i].url;//文章链接 var avatar = res[i].avatar;//评论者头像 var link = wangzhi(res[i].link);//评论者网址 var updatedAt = res[i].relativeTime;//评论时间 var commentId = '#' + res[i].id;//评论id hotComments.append('<li class="px1 pb2 flex items-center"><img style="width: 40px;height:40px" class="circle mx1 listavatar" src="' + avatar + '"><div class="w100"><div class="flex justify-between"><div class="h6 listauthor overflow-hidden" title="' + nick + '"><a target="_blank" rel="noopener external nofollow noreferrer" href="' + link + '">' + nick + '</a></div><span class="h6 mr1 listdate wenzi hang1">' + updatedAt + '</span></div> <a href="' + url + commentId + '"><div class="h5 list-comcontent overflow-hidden">' + newcontent + '</div></a></div></li>'); } }).catch(function (err) { console.error(err); });}$(function () { newcomment();//调用newcomment});</code></pre><p>其中：</p><pre><code class="html"><li class="px1 pb2 flex items-center"><img style="width: 40px;height:40px" class="circle mx1 listavatar" src="' + mail + '"><div class="w100"><div class="flex justify-between"><div class="h6 listauthor overflow-hidden" title="' + nick + '"><a target="_blank" rel="noopener external nofollow noreferrer" href="' + link + '">' + nick + '</a></div><span class="h6 mr1 listdate wenzi hang1">' + updatedAt + '</span></div> <a href="' + url + commentId + '"><div class="h5 list-comcontent overflow-hidden">' + newcontent + '</div></a></div></li></code></pre><p>为每条评论的<code><li></code>代码，主要调用了<code>nick</code>、<code>mail</code>、<code>newcontent</code>、<code>link</code>、<code>updatedAt</code>、<code>commentId</code>等数据。</p><p>HTML和CSS样式可按需自行修改。</p><p>完毕！</p><h2 id="多说一句"><a href="#多说一句" class="headerlink" title="多说一句"></a>多说一句</h2><p>开启了pjax的小伙伴，在pjax回调函数里面记得加上<code>newcomment();</code>，防止最新评论刷不出来。</p>]]></content>
<summary type="html"><p>感谢 <a href="https://www.imaegoo.com/">iMaeGoo</a> 大佬的 <a href="https://twikoo.js.org/">Twikoo</a> 。</p>
<h2 id="Twikoo-评论系统是什么？"><a href=</summary>
<category term="hexo" scheme="https://www.heson10.com/categories/hexo/"/>
<category term="评论" scheme="https://www.heson10.com/categories/hexo/%E8%AF%84%E8%AE%BA/"/>
<category term="hexo" scheme="https://www.heson10.com/tags/hexo/"/>
<category term="评论" scheme="https://www.heson10.com/tags/%E8%AF%84%E8%AE%BA/"/>
<category term="twikoo" scheme="https://www.heson10.com/tags/twikoo/"/>
</entry>
<entry>
<title>Hexo-bb 插件，通过手机微信随时随地发表碎片化思想</title>
<link href="https://www.heson10.com/posts/25624.html"/>
<id>https://www.heson10.com/posts/25624.html</id>
<published>2020-11-30T15:11:34.000Z</published>
<updated>2022-06-07T14:18:23.272Z</updated>
<content type="html"><![CDATA[<p>这些天一直有小伙伴通过私信发我，想把哔哔适配到其他主题。</p><p>我想，是时候做个插件了。</p><rainbow-text>Hexo-bb</rainbow-text> 它来了。<h2 id="🚩安装"><a href="#🚩安装" class="headerlink" title="🚩安装"></a>🚩安装</h2><pre><code>npm install hexo-bb --save</code></pre><h2 id="🧻准备"><a href="#🧻准备" class="headerlink" title="🧻准备"></a>🧻准备</h2><ul><li><h4 id="Leancloud创建存储空间"><a href="#Leancloud创建存储空间" class="headerlink" title="Leancloud创建存储空间"></a>Leancloud创建存储空间</h4></li><li><h4 id="微信公众号绑定"><a href="#微信公众号绑定" class="headerlink" title="微信公众号绑定"></a>微信公众号绑定</h4></li></ul><p>以上准备工作详细步骤：<a href="/posts/58339.html#Leancloud%E5%88%9B%E5%BB%BA%E5%AD%98%E5%82%A8%E7%A9%BA%E9%97%B4">点我</a></p><h2 id="🕋配置"><a href="#🕋配置" class="headerlink" title="🕋配置"></a>🕋配置</h2><p>在根目录配置文件_config.yml中加入:</p><pre><code>## 哔哔功能配置## 关注公众号 "黑石哔哔"，发送: //bindCurrentUser:你的APPID,你的MASTERKEY,你的RESTAPI ## 可用leancloud国际版，国际版api为 https://appid前八位.api.lncldglobal.com bb: title: 哔哔 #页面title appId: 你的leancloud appId appKey: 你的leancloud appKey serverURLs: https://xxxxxx #你的api地址 limit: 10 #显示条数 path: bb #路径名称 例如：https://你的域名/bb content: '👉🏼此说说通过📱手机微信发出，主要记录黑石碎片化思考和动态。📑' #显示在哔哔上方,如不需要注释即可</code></pre><h2 id="🍳预览"><a href="#🍳预览" class="headerlink" title="🍳预览"></a>🍳预览</h2><pre><code>https://你的域名/bb/</code></pre><h2 id="💞更新记录"><a href="#💞更新记录" class="headerlink" title="💞更新记录"></a>💞更新记录</h2><p>v0.1.12（2020/12/02）</p><ul><li>外链图片增加对svg的支持</li></ul><p>v0.1.11（2020/12/01）</p><ul><li>增加哔哔上方内容简介配置(content)</li><li>增加显示数量配置(limit)</li><li>增加哔哔页面路径配置(path)</li></ul><p>v0.1.10（2020/11/30）</p><ul><li>哔哔样式细节优化</li></ul><p>v0.1.9</p><ul><li>更新readme</li></ul><p>v0.1.8</p><ul><li>ejs集成</li></ul><p>v0.1.2 </p><ul><li>修复图片宽度问题</li></ul><h2 id="🎃欢迎反馈"><a href="#🎃欢迎反馈" class="headerlink" title="🎃欢迎反馈"></a>🎃欢迎反馈</h2><p>当前只在最新的<code>landscape</code>、<code>fluid</code>、<code>volantis</code>、<code>next</code>、<code>matery</code>、<code>butterfly</code>主题上测试过。</p><article class="message zi"><div class="message_body"><p>issue地址： <a href="https://github.com/heson525/hexo-bb/issues">https://github.com/heson525/hexo-bb/issues</a></p></div></article><h2 id="🎈注意事项"><a href="#🎈注意事项" class="headerlink" title="🎈注意事项"></a>🎈注意事项</h2><article class="message lv"><div class="message_body"><p>之前手动增加bb页面的，请删掉source文件夹中的bb/index.md ，插件会自动生成。</p></div></article><h2 id="💖各主题截图"><a href="#💖各主题截图" class="headerlink" title="💖各主题截图"></a>💖各主题截图</h2><h3 id="Volantis"><a href="#Volantis" class="headerlink" title="Volantis"></a>Volantis</h3><p><img src="https://picup.heson10.com/img/upyun/2020/11/20201130221518.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/11/20201130221518.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII="></p><h3 id="Next"><a href="#Next" class="headerlink" title="Next"></a>Next</h3><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201019234407042.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201019234407042.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII="></p><h3 id="Matery"><a href="#Matery" class="headerlink" title="Matery"></a>Matery</h3><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201019184730558.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201019184730558.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII="></p><h3 id="Butterfly"><a href="#Butterfly" class="headerlink" title="Butterfly"></a>Butterfly</h3><p><img src="https://7.dusays.com/2020/10/21/fcdccfbc02860.png" class="lazyload" data-srcset="https://7.dusays.com/2020/10/21/fcdccfbc02860.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII="></p><h2 id="🎀系列文章"><a href="#🎀系列文章" class="headerlink" title="🎀系列文章"></a>🎀系列文章</h2><p>10月19日：<a href="/posts/22793.html">《BB短博文Hexo-Matery主题适配》</a></p><p>10月20日：<a href="/posts/26865.html">《BB短博文Hexo-Next主题(8.0+)适配》</a></p><p>10月21日：<a href="/posts/3510.html">《BB短博文Hexo-Butterfly主题适配》</a></p><p>10月30日：<a href="/posts/58339.html">《Typecho-Cuteen3主题哔哔适配》</a></p><p>11月30日：<a href="/posts/25624.html">《Hexo-bb 插件，通过手机微信随时随地发表碎片化思想》</a> 👍</p><p>12月04日：<a href="/posts/57231.html">《Typecho Cuteen4 哔哔页面适配》</a></p>]]></content>
<summary type="html"><p>这些天一直有小伙伴通过私信发我，想把哔哔适配到其他主题。</p>
<p>我想，是时候做个插件了。</p>
<rainbow-text>Hexo-bb</rainbow-text> 它来了。
<h2 id="🚩安装"><a href="#🚩安装" class="hea</summary>
<category term="hexo" scheme="https://www.heson10.com/categories/hexo/"/>
<category term="哔哔" scheme="https://www.heson10.com/categories/hexo/%E5%93%94%E5%93%94/"/>
<category term="插件" scheme="https://www.heson10.com/categories/hexo/%E6%8F%92%E4%BB%B6/"/>
<category term="hexo" scheme="https://www.heson10.com/tags/hexo/"/>
<category term="插件" scheme="https://www.heson10.com/tags/%E6%8F%92%E4%BB%B6/"/>
</entry>
<entry>
<title>利用Github Action实现hexo博客的自动部署</title>
<link href="https://www.heson10.com/posts/61031.html"/>
<id>https://www.heson10.com/posts/61031.html</id>
<published>2020-11-20T20:06:51.000Z</published>
<updated>2022-06-07T14:18:23.272Z</updated>
<content type="html"><![CDATA[<h2 id="Hexo-博客的Github-Action自动化部署是什么？"><a href="#Hexo-博客的Github-Action自动化部署是什么？" class="headerlink" title="Hexo 博客的Github Action自动化部署是什么？"></a>Hexo 博客的Github Action自动化部署是什么？</h2><p>简单说，就是把hexo博客的源代码上传到github代码仓库，github在代码发生变动的时候，自动通过安装一系列nodejs环境和相关依赖，生成html页面到github pages仓库。</p><p>再简单点说，就是把本地生成博客的工作，全部交给github执行。</p><h2 id="这样做好处是什么？"><a href="#这样做好处是什么？" class="headerlink" title="这样做好处是什么？"></a>这样做好处是什么？</h2><ul><li>省去生成html的时间</li><li>☆随时随地都能修改或增加博文（重点，可以看到我的导航栏页面里面有一个<code>撰写</code>栏目，如下图）</li></ul><p><img src="https://picup.heson10.com/img/upyun/2020/11/image-20201120201912173.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/11/image-20201120201912173.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="黑石博客撰写栏目"></p><ul><li>备份了你的源代码</li></ul><h2 id="前言"><a href="#前言" class="headerlink" title="前言"></a>前言</h2><p>网上这种教程一大堆，有的装了插件不一样（gulp等等），有的部署方法（ssh、令牌）不一样，以至于自动化部署的文件写法也不一样。</p><p>我这里尽量写一个适合小白和大多数hexo博客的一个自动化部署的教程。</p><p><strong>总体步骤</strong>：</p><ul><li>使用Github令牌部署hexo博客</li><li>Github新建一个私有仓库，并上传hexo博客源码</li><li>配置Github Action实现自动化部署</li></ul><h2 id="使用Github令牌部署hexo博客"><a href="#使用Github令牌部署hexo博客" class="headerlink" title="使用Github令牌部署hexo博客"></a>使用Github令牌部署hexo博客</h2><p>使用Github令牌部署的好处就是不用重复部署ssh密钥环境，换了电脑、电脑重装也不用重新配置。</p><h3 id="github令牌获取"><a href="#github令牌获取" class="headerlink" title="github令牌获取"></a>github令牌获取</h3><ul><li><p>登陆GitHub，右上角设置</p><p><img src="https://pic.heson10.com/img/image-20200727123742808.png" class="lazyload" data-srcset="https://pic.heson10.com/img/image-20200727123742808.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="image-20200727123742808"></p><p><img src="https://pic.heson10.com/img/image-20200727123819255.png" class="lazyload" data-srcset="https://pic.heson10.com/img/image-20200727123819255.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="image-20200727123819255"></p><p><img src="https://pic.heson10.com/img/image-20200727123858727.png" class="lazyload" data-srcset="https://pic.heson10.com/img/image-20200727123858727.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="image-20200727123858727"></p></li><li><p>输入密码后创建一个全权限的token，名称随意</p><p><img src="https://pic.heson10.com/img/image-20200727124017855.png" class="lazyload" data-srcset="https://pic.heson10.com/img/image-20200727124017855.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="image-20200727124017855"></p></li></ul><h3 id="更改根目录配置deploy的仓库地址"><a href="#更改根目录配置deploy的仓库地址" class="headerlink" title="更改根目录配置deploy的仓库地址"></a>更改根目录配置deploy的仓库地址</h3><p>记录好此token，后面放在配置文件里面GitHub的推送代码就是：</p><p><img src="https://pic.heson10.com/img/image-20200727124518685.png" class="lazyload" data-srcset="https://pic.heson10.com/img/image-20200727124518685.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="image-20200727124518685"></p><p>比如我的github pages仓库https地址是：</p><pre><code>https://github.com/heson10/heson10.github.io.git</code></pre><p>那么我在根目录配置文件中的<code>deploy</code>设置令牌部署地址则为：</p><pre><code>https://令牌@github.com/heson10/heson10.github.io.git</code></pre><h2 id="Github新建一个私有仓库，并上传hexo博客源码"><a href="#Github新建一个私有仓库，并上传hexo博客源码" class="headerlink" title="Github新建一个私有仓库，并上传hexo博客源码"></a>Github新建一个私有仓库，并上传hexo博客源码</h2><h3 id="新建一个仓库，如图"><a href="#新建一个仓库，如图" class="headerlink" title="新建一个仓库，如图"></a>新建一个仓库，如图</h3><p><img src="https://picup.heson10.com/img/upyun/2020/11/image-20201122000503211.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/11/image-20201122000503211.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="新建一个私有仓库"></p><h3 id="上传hexo博客源码"><a href="#上传hexo博客源码" class="headerlink" title="上传hexo博客源码"></a>上传hexo博客源码</h3><p>在博客源码中删除<code>.git</code>文件夹(隐藏文件夹)，删除主题目录<code>.git</code>文件夹</p><p><img src="https://picup.heson10.com/img/upyun/2020/11/image-20201122001214227.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/11/image-20201122001214227.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="删除git文件夹"></p><p>根目录输入以下命令</p><pre><code class="shell">git initgit add .git commit -m "first commit"git branch -M maingit remote add origin https://github.com/用户名/新建的私有仓库名.git（私有仓库的地址）git push -u origin main</code></pre><p>提交过程中会要求输入用户名和密码，输入即可。</p><p>提交完毕后，仓库代码如图：</p><p><img src="https://picup.heson10.com/img/upyun/2020/11/image-20201122001847923.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/11/image-20201122001847923.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="私有仓库上传后"></p><h2 id="配置Github-Action实现自动化部署"><a href="#配置Github-Action实现自动化部署" class="headerlink" title="配置Github Action实现自动化部署"></a>配置Github Action实现自动化部署</h2><h3 id="新建workflow"><a href="#新建workflow" class="headerlink" title="新建workflow"></a>新建workflow</h3><p>点击博客源码仓库的<code>Action</code></p><p><img src="https://picup.heson10.com/img/upyun/2020/11/image-20201122002117053.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/11/image-20201122002117053.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="image-20201122002117053"></p><h3 id="配置action"><a href="#配置action" class="headerlink" title="配置action"></a>配置action</h3><p><img src="https://picup.heson10.com/img/upyun/2020/11/image-20201122002425835.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/11/image-20201122002425835.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="image-20201122002425835"></p><p>代码如下（记得修改自己的地址）：</p><pre><code class="yaml">name: Deploy # 部署on: # 触发条件 push: branches: - main # 推送到 main 分支（这里的分支名很重要，不要弄错了） release: types: - published # 推送新版本号 workflow_dispatch: # 手动触发jobs: build: runs-on: ubuntu-latest steps: - name: Checkout # Checkout 仓库 uses: actions/checkout@v2 with: ref: main - name: Setup Node # 安装 Node.js uses: actions/setup-node@v1 with: node-version: "12.x" - name: Install Hexo # 安装 Hexo run: | npm install hexo-cli -g - name: Cache Modules # 缓存 Node 插件 uses: actions/cache@v1 id: cache-modules with: path: node_modules key: ${{runner.OS}}-${{hashFiles('**/package-lock.json')}} - name: Install Dependencies # 如果没有缓存或 插件有更新，则安装插件 if: steps.cache-modules.outputs.cache-hit != 'true' run: | # **如果仓库里没有 package-lock.json，上传一下，npm ci 必须要有 package-lock.json** npm ci - name: Generate # 生成 run: | hexo clean hexo generate - name: Deploy # 部署 run: | git config --global user.name "GitHub用户名" git config --global user.email "GitHub邮箱" git clone https://github.com/heson525/heson525.github.io.git（换成自己的GitHub pages地址） .deploy_git export TZ='Asia/Shanghai' hexo deploy</code></pre><h3 id="查看状态"><a href="#查看状态" class="headerlink" title="查看状态"></a>查看状态</h3><p>点击action即可看到部署状态</p><p><img src="https://picup.heson10.com/img/upyun/2020/11/image-20201122003418494.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/11/image-20201122003418494.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="image-20201122003418494"></p><p><img src="https://picup.heson10.com/img/upyun/2020/11/image-20201122003452614.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/11/image-20201122003452614.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="image-20201122003452614"></p><p>这样就代表自动部署成功了。</p><h2 id="如何使用"><a href="#如何使用" class="headerlink" title="如何使用"></a>如何使用</h2><p>平时我在自己的电脑里写了文章后，使用这三条命令，直接推送修改的文件到博客源码仓库，后面就会自动部署</p><pre><code>git add .git commit -m "增加博文"git push</code></pre><p>也可直接在源码仓库的<code>source/_post</code>文件夹里面直接添加<code>markdown</code>文件，进行写博文</p><h2 id="结束语"><a href="#结束语" class="headerlink" title="结束语"></a>结束语</h2><p>基本步骤就是这样，<strong>总体步骤</strong>：</p><ul><li>使用Github令牌部署hexo博客</li><li>Github新建一个私有仓库，并上传hexo博客源码</li><li>配置Github Action实现自动化部署</li></ul><p>有问题请留言。如有错误，欢迎指正。</p>]]></content>
<summary type="html"><h2 id="Hexo-博客的Github-Action自动化部署是什么？"><a href="#Hexo-博客的Github-Action自动化部署是什么？" class="headerlink" title="Hexo 博客的Github Action自动化部署是什么？"></summary>
<category term="hexo" scheme="https://www.heson10.com/categories/hexo/"/>
<category term="部署" scheme="https://www.heson10.com/categories/hexo/%E9%83%A8%E7%BD%B2/"/>
<category term="hexo" scheme="https://www.heson10.com/tags/hexo/"/>
<category term="自动部署" scheme="https://www.heson10.com/tags/%E8%87%AA%E5%8A%A8%E9%83%A8%E7%BD%B2/"/>
</entry>
<entry>
<title>一款清新萌系轻量的HEXO主题SweetCloud蜜云微主题</title>
<link href="https://www.heson10.com/posts/64095.html"/>
<id>https://www.heson10.com/posts/64095.html</id>
<published>2020-11-11T14:22:32.000Z</published>
<updated>2022-06-07T14:18:23.272Z</updated>
<content type="html"><![CDATA[<rainbow-text>各位光棍节快乐！</rainbow-text><article class="message zi"><div class="message_body"><p>踩着光棍节这个点，今天发一个虐狗hexo主题: Sweet-Cloud ，中文名：蜜云。</p></div></article><h2 id="💕Sweet-Cloud-蜜云微主题"><a href="#💕Sweet-Cloud-蜜云微主题" class="headerlink" title="💕Sweet-Cloud 蜜云微主题"></a>💕Sweet-Cloud 蜜云微主题</h2><p>一款hexo情侣<emp>微</emp>主题。后端为Leancloud。</p><p>为方便你的另一半操作博客，采用微信发文，暂支持文字和外链图片。</p><article class="message lan"><div class="message_body"><p>源码地址: <a href="https://github.com/heson525/hexo-theme-sweetcloud">https://github.com/heson525/hexo-theme-sweetcloud</a></p></div></article><p>演示站: <a href="https://www.heson10.com/lovebb">https://www.heson10.com/lovebb</a></p><p><img src="https://cdn.jsdelivr.net/gh/heson10/pic@master/pic/20201110231901.png" class="lazyload" data-srcset="https://cdn.jsdelivr.net/gh/heson10/pic@master/pic/20201110231901.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="SweetCloud蜜云，hexo微主题"></p><h2 id="🎁主题特点"><a href="#🎁主题特点" class="headerlink" title="🎁主题特点"></a>🎁主题特点</h2><ul><li><p>界面清新可爱</p></li><li><p>轻量（单页）</p></li><li><p>发文方便，适合另一半（微信发文）</p></li><li><p>方便配置</p></li><li><p>适合虐狗</p></li></ul><h2 id="🔧To-Do"><a href="#🔧To-Do" class="headerlink" title="🔧To Do"></a>🔧To Do</h2><ul><li>修改，界面样式微调</li><li>增加, 相恋时间</li><li>增加，首页cover</li><li>增加，发文timeline加头像</li><li>增加，恋爱清单</li><li><del>修改，因为萌系字体</del> （11/11 修改为站酷快乐字体）</li><li>增加，fancybox显示图片</li><li>增加，祝福墙（留言）</li></ul><article class="message moren"><div class="message_body"><p>还需要什么功能，欢迎各位来提。</p></div></article><h2 id="✍食用方法"><a href="#✍食用方法" class="headerlink" title="✍食用方法"></a>✍食用方法</h2><h3 id="下载主题"><a href="#下载主题" class="headerlink" title="下载主题"></a>下载主题</h3><p>修改根目录配置文件<code>theme: sweetcloud</code>，并下载主题：</p><pre><code>git clone https://github.com/heson525/hexo-theme-sweetcloud.git themes/sweetcloud</code></pre><h3 id="配置主题前准备"><a href="#配置主题前准备" class="headerlink" title="配置主题前准备"></a>配置主题前准备</h3><h4 id="Leancloud创建存储空间"><a href="#Leancloud创建存储空间" class="headerlink" title="Leancloud创建存储空间"></a>Leancloud创建存储空间</h4><ul><li><p>登陆leancloud创建应用（国区版本,绑定api的域名需备案 <a href="https://www.leancloud.cn/">https://www.leancloud.cn/</a> ，国际版本：<a href="https://leancloud.app/">https://leancloud.app/</a> 有共享api，不需要备案域名，效果一样 ）</p></li><li><p>进入应用后，点击<code>创建 Class</code></p></li><li><p>将「 Class 名称」命名为 content </p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201009145412738.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201009145412738.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="创建content的class"></p></li><li><p>点击刚刚创建的<code>content Class</code>，点击<code>添加列</code>并创建名称为<code>content</code>的<code>列</code>，类型为<code>String</code>，注意<code>列注释</code>也要填写（随意填）</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201009145636784.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201009145636784.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="创建列"></p></li><li><p>记录<code>appid</code>，<code>masterkey</code>，<code>api</code>域名</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201009145840298.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201009145840298.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="appid"></p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201009145912340.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201009145912340.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="绑定域名"></p><p>因为我用的是国区版本，api绑定域名需要备案域名。</p><p>国际版leancloud不需要绑定域名，api地址为：</p><pre><code class="html">https://appid前八位.api.lncldglobal.com</code></pre><h4 id="微信公众号绑定"><a href="#微信公众号绑定" class="headerlink" title="微信公众号绑定"></a>微信公众号绑定</h4><p>关注下面公众号（微信发文）：</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/bbbbb.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/bbbbb.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="绑定域名"></p><p>按照公众号的提示的命令进行绑定：</p><pre><code>//bindCurrentUser:你的AppID,你的MasterKey,https://你的api域名</code></pre><p>完成后会提示<code>绑定成功</code>。</p></li></ul><h3 id="配置主题"><a href="#配置主题" class="headerlink" title="配置主题"></a>配置主题</h3><p>最主要的是填下leancloud的一些参数，男生，女生可在同一leancloud账号下，建立2个应用（如下图）：</p><p><img src="https://picup.heson10.com/img/upyun/2020/11/image-20201114091245367.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/11/image-20201114091245367.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="image-20201114091245367"></p><article class="message zi"><div class="message_body"><p>意思是男生女生的appid、appkey要按照上面的方法，在Leancloud上创建2次存储空间</p></div></article><p>主题配置如图：</p><p><img src="https://picup.heson10.com/img/upyun/2020/11/image-20201114091200937.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/11/image-20201114091200937.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="sweetcloud微主题配置"></p><p>其他一些配置，参考注释。</p><h3 id="如有主站博客，建议把此页面作为分站"><a href="#如有主站博客，建议把此页面作为分站" class="headerlink" title="如有主站博客，建议把此页面作为分站"></a>如有主站博客，建议把此页面作为分站</h3><p>例如：</p><p><img src="https://picup.heson10.com/img/upyun/2020/11/image-20201114091457772.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/11/image-20201114091457772.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="分站情侣哔哔"></p><article class="message huang"><div class="message_body"><p>方法教程见：<a href="/posts/46324.html">https://www.heson10.com/posts/46324.html</a></p></div></article><h2 id="🎀用本主题的DEMO"><a href="#🎀用本主题的DEMO" class="headerlink" title="🎀用本主题的DEMO"></a>🎀用本主题的DEMO</h2><ul><li><a href="https://mylovelygirl.cn/">https://mylovelygirl.cn/</a> </li><li><a href="https://www.heson10.com/lovebb">https://www.heson10.com/lovebb</a></li></ul>]]></content>
<summary type="html"><rainbow-text>各位光棍节快乐！</rainbow-text>
<article class="message zi"><div class="message_body"><p>踩着光棍节这个点，今天发一个虐狗hexo主题: Sweet-Cloud ，中文名：蜜云。</summary>
<category term="hexo" scheme="https://www.heson10.com/categories/hexo/"/>
<category term="主题" scheme="https://www.heson10.com/categories/hexo/%E4%B8%BB%E9%A2%98/"/>
<category term="hexo" scheme="https://www.heson10.com/tags/hexo/"/>
<category term="哔哔" scheme="https://www.heson10.com/tags/%E5%93%94%E5%93%94/"/>
<category term="主题" scheme="https://www.heson10.com/tags/%E4%B8%BB%E9%A2%98/"/>
<category term="蜜云" scheme="https://www.heson10.com/tags/%E8%9C%9C%E4%BA%91/"/>
<category term="sweetcloud" scheme="https://www.heson10.com/tags/sweetcloud/"/>
<category term="情侣" scheme="https://www.heson10.com/tags/%E6%83%85%E4%BE%A3/"/>
</entry>
<entry>
<title>Volantis-heson Hexo主题懒人版</title>
<link href="https://www.heson10.com/posts/3882.html"/>
<id>https://www.heson10.com/posts/3882.html</id>
<published>2020-11-09T17:09:34.000Z</published>
<updated>2022-06-07T14:18:23.272Z</updated>
<content type="html"><![CDATA[<h2 id="鸣谢"><a href="#鸣谢" class="headerlink" title="鸣谢"></a>鸣谢</h2><p>A Wonderful Theme for Hexo ：<a href="https://github.com/volantis-x/hexo-theme-volantis/">https://github.com/volantis-x/hexo-theme-volantis/</a></p><article class="message zi"><div class="message_body"><p>本volantis懒人版基于volantis 4.0 魔改而成。</p></div></article><h2 id="演示站"><a href="#演示站" class="headerlink" title="演示站"></a>演示站</h2><article class="message huang"><div class="message_body"><p><a href="https://www.heson10.com/volantis">https://www.heson10.com/volantis</a></p></div></article><p>效果图：</p><p><img src="https://7.dusays.com/2020/11/04/a3a0a83094db6.png" class="lazyload" data-srcset="https://7.dusays.com/2020/11/04/a3a0a83094db6.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="volantis-heson魔改版"></p><h2 id="为什么创建这个？"><a href="#为什么创建这个？" class="headerlink" title="为什么创建这个？"></a>为什么创建这个？</h2><article class="message hong"><div class="message_body"><p>因为满足部分同志不愿修改主题的心愿，就把我之前用的魔改volantis放出来。</p></div></article><h2 id="相对于volantis修改的功能"><a href="#相对于volantis修改的功能" class="headerlink" title="相对于volantis修改的功能"></a>相对于volantis修改的功能</h2><ul><li>侧边栏左侧</li><li>上升气泡</li><li>热门文章（手动加）</li></ul><p><img src="https://7.dusays.com/2020/11/04/aee47db7cb65c.png" class="lazyload" data-srcset="https://7.dusays.com/2020/11/04/aee47db7cb65c.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII="></p><ul><li>商用版本fontawesome（很全）</li></ul><p><img src="https://7.dusays.com/2020/11/04/a8e55166f33dc.png" class="lazyload" data-srcset="https://7.dusays.com/2020/11/04/a8e55166f33dc.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII="></p><ul><li>集成手机微信发送短博文功能<strong>（独家适配）</strong>，效果如：<a href="https://www.heson10.com/volantis/bb">https://www.heson10.com/volantis/bb</a></li></ul><p><img src="https://7.dusays.com/2020/11/04/17a3553131fa7.png" class="lazyload" data-srcset="https://7.dusays.com/2020/11/04/17a3553131fa7.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII="></p><ul><li>github底部样式（默认关闭，配置文件可修改）<br><img src="https://7.dusays.com/2020/11/04/190b642b03cd4.png" class="lazyload" data-srcset="https://7.dusays.com/2020/11/04/190b642b03cd4.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="image-20201104133155951"></li><li>彩虹标签云</li></ul><p><img src="https://7.dusays.com/2020/11/04/f5b40162c7040.png" class="lazyload" data-srcset="https://7.dusays.com/2020/11/04/f5b40162c7040.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII="></p><ul><li>谷歌思源宋体字体（快速异步加载）</li></ul><h2 id="下载主题"><a href="#下载主题" class="headerlink" title="下载主题"></a>下载主题</h2><pre><code>git clone https://github.com/heson525/volantis-heson.git themes/volantis-heson</code></pre><h2 id="更换主题"><a href="#更换主题" class="headerlink" title="更换主题"></a>更换主题</h2><p>打开根目录<code>_config.yml</code>文件</p><pre><code>theme: volantis-heson</code></pre><h2 id="安装依赖"><a href="#安装依赖" class="headerlink" title="安装依赖"></a>安装依赖</h2><p>改根目录下的<code>package.json</code>文件</p><pre><code class="json">{ "name": "hexo-site", "version": "0.0.0", "private": true, "scripts": { "build": "hexo generate", "clean": "hexo clean", "deploy": "hexo deploy", "server": "hexo server" }, "hexo": { "version": "5.1.1" }, "dependencies": { "hexo": "^5.1.1", "hexo-abbrlink": "^2.2.1", "hexo-deployer-git": "^2.1.0", "hexo-generator-archive": "^1.0.0", "hexo-generator-category": "^1.0.0", "hexo-generator-feed": "^3.0.0", "hexo-generator-index": "^2.0.0", "hexo-generator-json-content": "^4.2.3", "hexo-generator-tag": "^1.0.0", "hexo-related-popular-posts": "^5.0.1", "hexo-renderer-ejs": "^1.0.0", "hexo-renderer-marked": "^3.0.0", "hexo-renderer-stylus": "^2.0.0", "hexo-server": "^2.0.0", "hexo-wordcount": "^6.0.1" }}</code></pre><p>然后输入下面命令，本地预览</p><pre><code>npm install && hexo cl && hexo g && hexo s</code></pre><h2 id="修改主题配置"><a href="#修改主题配置" class="headerlink" title="修改主题配置"></a>修改主题配置</h2><p>在主题目录的config.yml中找到<code>☆</code>符号</p><p>这些都是必须修改的项目，在修改的内容在里面已经说明</p><h2 id="FAQ"><a href="#FAQ" class="headerlink" title="FAQ"></a>FAQ</h2><p>Q1:首页文章的头图怎么添加？</p><p>A1:在md文章头部的<code>frontmater</code>里面添加<code>headimg: 链接地址</code></p><p>Q2:怎么添加<code>分类</code>、<code>标签</code>和<code>说说</code>页面？</p><p>A2:输入命令：</p><pre><code>hexo new page categorieshexo new page tagshexo new page bbhexo new page links hexo new page guestbook</code></pre><p>然后分别在生成的两个index.md里的<code>frontmater</code>里面添加<code>layout: category</code>和<code>layout: tag</code>和<code>layout: bb</code>和<code>layout: friends</code></p><table><thead><tr><th>命令</th><th>对应模板</th></tr></thead><tbody><tr><td>hexo new page categories</td><td>layout: category</td></tr><tr><td>hexo new page tags</td><td>layout: tag</td></tr><tr><td>hexo new page bb</td><td>layout: bb</td></tr><tr><td>hexo new page links</td><td>layout: friends</td></tr><tr><td>hexo new page guestbook</td><td>无</td></tr></tbody></table><p>Q3:怎么调用友情链接？</p><p>A3:我用的是gitee动态调用，这样的好处是：可以直接申请审核，不用动代码加友情链接。</p><p>我得调用代码：</p><pre><code>{% issues sites | api=https://gitee.com/api/v5/repos/heson525_admin/links/issues?sort=created&direction=asc&labels=active&state=open&page=1&per_page=100 | group=group:技术大佬,朋友们 %}</code></pre><p>其中api要换成自己的gitee链接，我这个链接中<code>heson525_admin</code>是我的用户名，<code>links</code>是仓库名后面的<code>group</code>是分组，<code>active</code>是判断是否显示的标签。</p><p>Q4:默认安装了<code>hexo-abbrlink</code>固定链接插件，怎么设置固定链接？</p><p>A4:在根目录配置文件中，加入以下代码(注意要删除之前的<code>permalink:xxxx </code>)：</p><pre><code>#设置永久链接permalink: posts/:abbrlink.html # 此处可以自己设置，也可以直接使用 :/abbrlinkabbrlink: alg: crc16 #算法： crc16(default) and crc32 rep: dec #进制： dec(default) and hex</code></pre><p><strong>待完善，不懂请留言</strong></p><h2 id="其他使用本主题的DEMO"><a href="#其他使用本主题的DEMO" class="headerlink" title="其他使用本主题的DEMO"></a>其他使用本主题的DEMO</h2><ul><li><a href="https://yyqx.xyz/">https://yyqx.xyz</a> 影视前线</li><li><a href="https://guzeng41.github.io/">https://guzeng41.github.io/</a> guzeng41的笔记</li><li>虚位以待（留言告知）</li></ul><h2 id="源码下载"><a href="#源码下载" class="headerlink" title="源码下载"></a>源码下载</h2><article class="message lan"><div class="message_body"><p><a href="https://github.com/heson525/volantis-heson">https://github.com/heson525/volantis-heson</a></p></div></article><article class="message lv"><div class="message_body"><p>有任何问题欢迎留言。</p></div></article>]]></content>
<summary type="html"><h2 id="鸣谢"><a href="#鸣谢" class="headerlink" title="鸣谢"></a>鸣谢</h2><p>A Wonderful Theme for Hexo ：<a href="https://github.com/volantis-x/he</summary>
<category term="hexo" scheme="https://www.heson10.com/categories/hexo/"/>
<category term="主题" scheme="https://www.heson10.com/categories/hexo/%E4%B8%BB%E9%A2%98/"/>
<category term="hexo" scheme="https://www.heson10.com/tags/hexo/"/>
<category term="主题" scheme="https://www.heson10.com/tags/%E4%B8%BB%E9%A2%98/"/>
</entry>
<entry>
<title>Typecho-Cuteen3 主题哔哔适配</title>
<link href="https://www.heson10.com/posts/58339.html"/>
<id>https://www.heson10.com/posts/58339.html</id>
<published>2020-10-30T22:43:29.000Z</published>
<updated>2022-06-07T14:18:23.272Z</updated>
<content type="html"><![CDATA[<p>近日，cuteen主题作者那有人留言：</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201030224519888.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201030224519888.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="cuteen求适配哔哔"></p><article class="message huang"><div class="message_body"><p>很好，又来活了。二话不说，开干😎</p></div></article><h2 id="Cuteen4-适配更新"><a href="#Cuteen4-适配更新" class="headerlink" title="Cuteen4 适配更新"></a>Cuteen4 适配更新</h2><p>12月4日：</p><p>支持Cuteen4。 <a href="/posts/57231.html">点我直达。</a></p><h2 id="关于Typecho适配哔哔"><a href="#关于Typecho适配哔哔" class="headerlink" title="关于Typecho适配哔哔"></a>关于Typecho适配哔哔</h2><p>今天（10月30日）完成基本功能适配，在hexo哔哔版本的基础上，<strong>新增了当前页面直接ajax加载未显示的哔哔</strong>。可能有小伙伴问了，为什么hexo不用这个功能？因为和valine评论系统的api冲突了，暂时没能找出初始两个AV的方法。😅</p><p>效果页面：<a href="https://typecho.heson10.com/index.php/9.html">https://typecho.heson10.com/index.php/9.html</a> （cuteen4 12月4日更新）</p><p>已知bug🎃：</p><del>在Typecho-Cuteen主题中开启了pjax功能的小伙伴，从其他页面进入bb会不显示。刷新后显示。</del><del>关掉pjax功能不存在这个情况。</del>（30日晚上加了个班，把bug修复了，下面会说）<h2 id="食用方法"><a href="#食用方法" class="headerlink" title="食用方法"></a>食用方法</h2><h3 id="准备工作"><a href="#准备工作" class="headerlink" title="准备工作"></a>准备工作</h3><h4 id="Leancloud创建存储空间"><a href="#Leancloud创建存储空间" class="headerlink" title="Leancloud创建存储空间"></a>Leancloud创建存储空间</h4><ul><li><p>登陆leancloud创建应用（国区版本,绑定api的域名需备案 <a href="https://www.leancloud.cn/">https://www.leancloud.cn/</a> ，国际版本：<a href="https://leancloud.app/">https://leancloud.app/</a> 有共享api，不需要备案域名，效果一样 ）</p></li><li><p>进入应用后，点击<code>创建 Class</code></p></li><li><p>将「 Class 名称」命名为 content </p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201009145412738.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201009145412738.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="创建content的class"></p></li><li><p>点击刚刚创建的content Class，点击<code>添加列</code>并创建名称为content的<code>列</code>，类型为<code>String</code>，注意<code>列注释</code>也要填写（随意填）</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201009145636784.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201009145636784.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="创建列"></p></li><li><p>记录appid，masterkey，api域名</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201009145840298.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201009145840298.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="appid"></p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201009145912340.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201009145912340.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="绑定域名"></p><p>因为我用的是国区版本，api绑定域名需要备案域名。</p><p>国际版leancloud不需要绑定域名，api地址为：</p><pre><code class="html">appid前八位.api.lncldglobal.com</code></pre><h4 id="微信公众号绑定"><a href="#微信公众号绑定" class="headerlink" title="微信公众号绑定"></a>微信公众号绑定</h4><p>关注下面公众号：</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/bbbbb.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/bbbbb.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="绑定域名"></p><p>按照公众号的提示的命令进行绑定：</p><pre><code>//bindCurrentUser:你的AppID,你的MasterKey,https://你的api域名</code></pre><p>完成后会提示<code>绑定成功</code>。</p></li></ul><h3 id="创建bb-php模板"><a href="#创建bb-php模板" class="headerlink" title="创建bb.php模板"></a>创建bb.php模板</h3><p>在主题目录<code>\usr\themes\Cuteen</code>下新建<code>bb.php</code>模板，加入以下代码：</p><pre><code class="php+HTML"><?php /** * 哔哔页面 * * @package custom * 黑石修改 * https://www.heson10.com */?><?php$this->need('Base/head.php');$this->need('Base/navbar.php');$this->need('Base/hero.php');?><div class="card-box clearfix <?php echo Helper::options()->indeximg ? '' : 'pt4' ?> mx-auto"> <div class="card-content mx-auto <?php echo Helper::options()->indeximg || $this->options->qjcbl ? '' : 'mt2' ?>" <?php echo $this->options->qjcbl && in_array('1', $this->options->cblxswz) ? "" : "style='max-width: 850px'" ?>> <?php if ($this->options->qjcbl && $this->options->qjcblfx == 0 && in_array('1', $this->options->cblxswz)) : ?> <div class="qjcbl md-hide lg-col lg-col-3 mt1"> <?php $this->need('Base/sidebar.php'); ?> </div> <?php endif ?> <div class="xs-col-12 cuteup lg-col <?php echo $this->options->qjcbl && in_array('1', $this->options->cblxswz) ? "lg-col-9" : "lg-col-12" ?> <?php echo Cuteen::isMobile() ? '' : 'mt1' ?>"> <div class="mybox m1 <?php echo Helper::options()->indeximg ? '' : 'mt2' ?>"> <div class="Post_content_box"> <?php if (!Helper::options()->indeximg) : ?> <div class="detail-title-wrap"> <div class="wznydbt mt1 mb3"><?php $this->title() ?></div> <div <?php echo Cuteen::isMobile() ? 'style="line-height:1.8"' : '' ?> class="flex justify-between <?php echo Cuteen::isMobile() ? 'flex-column' : 'pb2' ?>"> <nav class="breadcrumb h6"> <ul class="flex"> <li class="flex items-center pr1"> <svg class="icon" aria-hidden="true"> <use xlink:href="#icon-shouye"></use> </svg><a href="<?php $this->options->siteUrl(); ?>" title="<?php $this->options->title(); ?>">首页</a></li> <li class="flex items-center"> <svg class="icon" aria-hidden="true"> <use xlink:href="#icon-biaoqian1"></use> </svg>独立页面</li> </ul> </nav> <div class="flex flex-wrap"> <span class="h6 flex items-center mr1"> <svg class="icon" aria-hidden="true"> <use xlink:href="#icon-huo"></use> </svg> <?php Cuteen::getPostviews($this) ?> </span> <span class="h6 flex items-center mr1"> <svg class="icon" aria-hidden="true"> <use xlink:href="#icon-bidianliang"></use> </svg> <?php Cuteen::getWordCount($this->cid) ?> 字 </span> <span class="h6 flex items-center mr1"> <svg class="icon" aria-hidden="true"> <use xlink:href="#icon-pinglun"></use> </svg> <?php $this->commentsNum('暂无评论', '%d 条评论'); ?> </span> </div> </div> </div> <hr> <?php endif ?> <article id="Post_wysiwyg" class="duta"> <?php echo Cuteen::parseAll($this->content); ?> <main id="app"> <article class="message lan"><div class="message_body">共计发送 {{count}} 条说说</div></article> <div class="timenode" v-for="item in contents" v-cloak> <div class="meta"> <p><time v-bind:datetime="item.attributes.time">{{item.attributes.time}}</time></p> </div> <div class="body"> <p v-html='item.attributes.content'></p> </div> </div> <div class="load-ctn"> <a class="btn lv" v-on:click="loadMore" v-if="contents" v-cloak>再翻翻</a> <p class="tip" v-else>别急，加载呢</p> </div> </main> </article> </div> </div> <?php $this->need('Base/comment.php'); ?></div><?php if ($this->options->qjcbl && $this->options->qjcblfx == 1 && in_array('1', $this->options->cblxswz)) : ?> <div class="qjcbl md-hide lg-col lg-col-3 mt1"> <?php $this->need('Base/sidebar.php'); ?> </div> <?php endif ?><style> @font-face { font-family: "iconfont"; src: url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.eot?t=1586882866168'); /* IE9 */ src: url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.eot?t=1586882866168#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAALcAAsAAAAAB2gAAAKPAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCCfgqCUII8ATYCJAMMCwgABCAFhG0HQBuEBsiuMRkynL4YFCHtLKs4b+k7/80U8DwHIB6+xtr7u3vniDZI6tmnkyDS8NC5iFgJlE7pTPcO8e5b+803aYQy8YtH1JPKyZzY3ttb1EonioVGSBAiRJp4JV9cFppCxLpe2z8sUs37O4QEDFRM0lFeAw4XN6bQPG06zTG8DRwHFOBeGEVWIjE+mP8wduVFPCbQNK4ktN8/OgFJhbEqEFemLkEyFVcUVqoL1ZKDRbyIqafb9AA8+9+PX41IklQyY+PBSZ8KnR+9iBx0OxZcp8PxvGDHyFgACnFY6j8QCfMLIppKPmoCrGtW8OG/y0eufLX/8AiJqDKa22AGWpMzUth6p6aARySQQRUUL4AnSBmuyvIwPdbz21OX5ybO5duOJifaLl6cvkrd1HR7kWEy6yikff29PvgO17V/Tf/9f/oN3PDqz22a719IYlZJHQetpLY08MV6fwFDrF0B6F4XyB3/FyEEnZnU2XGtVwHvpxtA1d6pftKB4AcoWo4U1QQbiiy35Xow27whbwK2NNFlhAc99zeOtM4S6ikFQ1IzhqxuglAoC6ho2UBV3Raa5g0cbxnCRURpYM4pQOh3h6TXG7J+j4RCeULFqFdU9UcETYfRdGHLVJjpHk6SIBXlTTQV5mmWS6SD1jHSVx2JJ1U+a4p4YKawvrSSLQ2QR3yMLcGa3hBCQ40zF/vBc+Q4DH3OLFJExRDCb64un5S9qaIwF9L2cEQiEBWSbUImBePR3PFCOvf5MUS3yiHhNR0VySmEC5jTo7qKWgvCgN5r1XEtrwTW6BoEQYM0HONC/cBLHDPPIL98noUohAqjR7uvWVV1HlVbfWV+o/t8J6DJOJ4jRY6idmVKnmVS1q8tK8zfBAAA') format('woff2'), url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.woff?t=1586882866168') format('woff'), url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.ttf?t=1586882866168') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */ url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.svg?t=1586882866168#iconfont') format('svg'); /* iOS 4.1- */ } #app img{display: block;} .iconfont { font-family: "iconfont" !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-lianjie:before { content: "\e6a3"; } .icon-lianjie-copy:before { content: "\e6a4"; } </style><script src="https://cdn.bootcss.com/vue/2.6.11/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/av-min.js"></script><?php echo '<script src="' . CUTEEN_STATIC_PATH . '/Js/bb.js"></script>'; ?> </div> </div></div><?php $this->need('Base/footer.php'); ?></code></pre><h3 id="加入bb-js"><a href="#加入bb-js" class="headerlink" title="加入bb.js"></a>加入bb.js</h3><p>在主题目录下的<code>Static\Js</code>文件夹中新建<code>bb.js</code>文件，加入以下代码：</p><p>注意要修改自己的appid、appkey等参数</p><pre><code class="javascript">var { Query } = AV; AV.init({ appId: "xxxxxx", //修改leancloud appid appKey: "xxxxx",//修改leancloud appkey serverURLs: 'https://' //修改api地址 https://开头 }); var query = new AV.Query('content'); var app = new Vue({ el: '#app', data: { page: 0, count: 0, contents: [] }, methods: { loadMore: function (event) { getData(++this.page); } } }) getData(0); query.count().then(function (count) { app.count = count; }, function (error) { }); //友好地显示时间 function timeago(dateTimeStamp) { var minute = 1000 * 60; //把分，时，天，周，半个月，一个月用毫秒表示 var hour = minute * 60; var day = hour * 24; var week = day * 7; var month = day * 30; var now = new Date().getTime(); //获取当前时间毫秒 var diffValue = now - dateTimeStamp; //时间差 if (diffValue < 0) { return; } var minC = diffValue / minute; //计算时间差的分，时，天，周，月 var hourC = diffValue / hour; var dayC = diffValue / day; var weekC = diffValue / week; var monthC = diffValue / month; if (monthC >= 1 && monthC <= 3) { result = " " + parseInt(monthC) + " 月前" } else if (weekC >= 1 && weekC <= 3) { result = " " + parseInt(weekC) + " 周前" } else if (dayC >= 1 && dayC <= 6) { result = " " + parseInt(dayC) + " 天前" } else if (hourC >= 1 && hourC <= 23) { result = " " + parseInt(hourC) + " 小时前" } else if (minC >= 1 && minC <= 59) { result = " " + parseInt(minC) + " 分钟前" } else if (diffValue >= 0 && diffValue <= minute) { result = "刚刚" } else { var datetime = new Date(); datetime.setTime(dateTimeStamp); var Nmonth = datetime.getMonth() + 1 < 10 ? "0" + (datetime.getMonth() + 1) : datetime.getMonth() + 1; var Ndate = datetime.getDate() < 10 ? "0" + datetime.getDate() : datetime.getDate(); result = Nmonth + "-" + Ndate } return result; }; function urlToLink(str) { // var re = /(http|ftp|https):\/\/[\w-]+(.[\w-]+)+([\w-.,@?^=%&:/~+#]*[\w-\@?^=%&/~+#])?/g; var re = /\bhttps?:\/\/(?!\S+(?:jpe?g|png|bmp|gif|webp|gif))\S+/g; var re_forpic = /\bhttps?:\/\/.*?(\.gif|\.jpeg|\.png|\.jpg|\.bmp|\.webp)/g; var re_forpic_vx = /^http:\/\/mmbiz\.qpic\.cn[^\s]*/g; str = str.replace(re, function (website) { return "<a href='" + website + "' target='_blank'> <i class='iconfont icon-lianjie-copy'></i>链接 </a>"; }); str = str.replace(re_forpic, function (imgurl) { return "<img src='" + imgurl + "' /> "; }); str = str.replace(re_forpic_vx, function (imgurl) { return "<img src='" + imgurl + "' /> "; }); return str; }; function getData(page = 0) { query.descending('createdAt').skip(page * 10).limit(10).find().then(function (results) { if (results.length == 0) { alert('之前没发表过说说了') } else { let resC = results; reqData = false; resC.forEach((i) => { let dateTmp = new Date(i.createdAt); i.attributes.time = timeago(dateTmp); i.attributes.content = urlToLink(i.attributes.content) ; app.contents.push(i); }) } }, function (error) { }); };</code></pre><h3 id="增加css样式"><a href="#增加css样式" class="headerlink" title="增加css样式"></a>增加css样式</h3><p>在<code>Static\Css\Main.css</code>中加入：</p><pre><code class="css">/* bb样式 */div.timenode { position: relative; } div.timenode:before, div.timenode:after { content: ''; z-index: 1; position: absolute; background: rgba(68,215,182,0.5); width: 2px; left: 7px; } div.timenode:before { top: 0px; height: 6px; } div.timenode:after { top: 26px; height: calc(100% - 26px); } div.timenode:last-child:after { height: calc(100% - 26px - 16px); border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; } div.timenode .meta, div.timenode .body { max-width: calc(100% - 24px); } div.timenode .meta { position: relative; color: var(--color-meta); font-size: 0.875rem; line-height: 32px; height: 32px; } div.timenode .meta:before, div.timenode .meta:after { content: ''; position: absolute; top: 8px; z-index: 2; } div.timenode .meta:before { background: rgba(68,215,182,0.5); width: 16px; height: 16px; border-radius: 8px; } div.timenode .meta:after { background: #44d7b6; margin-left: 2px; margin-top: 2px; width: 12px; height: 12px; border-radius: 6px; transform: scale(0.5); transition: all 0.28s ease; -moz-transition: all 0.28s ease; -webkit-transition: all 0.28s ease; -o-transition: all 0.28s ease; } div.timenode .meta p { font-weight: bold; margin: 0 0 0 24px; } div.timenode .body { margin: 4px 0 16px 24px; padding: 16px; border-radius: 8px; background: var(--color-block); display: inline-block; } div.timenode .body:empty { display: none; } div.timenode .body >*:first-child { margin-top: 0.25em; } div.timenode .body >*:last-child { margin-bottom: 0.25em; } div.timenode .body .highlight { border: 1px solid #e4e4e4; } div.timenode:hover .meta { color: var(--color-text); } div.timenode:hover .meta:before { background: rgba(255,87,34,0.5); } div.timenode:hover .meta:after { background: #ff5722; transform: scale(1); } div.timenode .body { margin: 0 0 0 24px; padding: 16px; border-radius: 8px; background: #f6f6f6; display: inline-block;}/*bb暗黑样式*/.DarkMode .timenode meta p{ color: #fff;}.DarkMode .timenode p,.DarkMode .timenode li{ color: #555;}.DarkMode .timenode blockquote p{ color:#cfcfcf}.DarkMode .timenode p a{ color: rgb(36, 122, 62);}.DarkMode .timenode .body { background: #c4c4c4;}</code></pre><h3 id="Typecho后台的设置"><a href="#Typecho后台的设置" class="headerlink" title="Typecho后台的设置"></a>Typecho后台的设置</h3><ul><li><p>新增一个哔哔页面</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201030230411049.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201030230411049.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="新增哔哔页面"></p></li><li><p>使用bb模板</p></li></ul><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201030230523121.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201030230523121.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="使用bb模板"></p><h3 id="开启了pjax功能的小伙伴看这里"><a href="#开启了pjax功能的小伙伴看这里" class="headerlink" title="开启了pjax功能的小伙伴看这里"></a>开启了pjax功能的小伙伴看这里</h3><p>-如果后台开启了pjax的功能：</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201031000031833.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201031000031833.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="pjax功能开启"></p><p>请在<code>Base\footer.php</code>文件的这个地方：</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201031000156773.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201031000156773.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="pjax回调"></p><p>添加以下代码：</p><pre><code class="javascript"> getData(0); query.count().then(function (count) { app.count = count; }, function (error) { });</code></pre><p>修改后如图：</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201031000319602.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201031000319602.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="回调修改后代码"></p><h2 id="🎀系列文章"><a href="#🎀系列文章" class="headerlink" title="🎀系列文章"></a>🎀系列文章</h2><p>10月19日：<a href="/posts/22793.html">《BB短博文Hexo-Matery主题适配》</a></p><p>10月20日：<a href="/posts/26865.html">《BB短博文Hexo-Next主题(8.0+)适配》</a></p><p>10月21日：<a href="/posts/3510.html">《BB短博文Hexo-Butterfly主题适配》</a></p><p>10月30日：<a href="/posts/58339.html">《Typecho-Cuteen主题哔哔适配》</a></p>]]></content>
<summary type="html"><p>近日，cuteen主题作者那有人留言：</p>
<p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201030224519888.png" class="lazyload" data-srcse</summary>
<category term="typecho" scheme="https://www.heson10.com/categories/typecho/"/>
<category term="哔哔" scheme="https://www.heson10.com/tags/%E5%93%94%E5%93%94/"/>
<category term="cuteen" scheme="https://www.heson10.com/tags/cuteen/"/>
<category term="typecho" scheme="https://www.heson10.com/tags/typecho/"/>
</entry>
<entry>
<title>Hexo 新建文章自动打开编辑器</title>
<link href="https://www.heson10.com/posts/22932.html"/>
<id>https://www.heson10.com/posts/22932.html</id>
<published>2020-10-29T16:10:50.000Z</published>
<updated>2022-06-07T14:18:23.272Z</updated>
<content type="html"><![CDATA[<article class="message lv"><div class="message_body"><p>又一个懒癌患者诞生。新建文章后，不愿意去_post文件夹里去找。试试这个方法。</p></div></article><ul><li><p>在HEXO根目录下新建<code>scripts</code>文件夹</p></li><li><p>在<code>scripts</code>文件夹新建一个js文件，例如<code>new.js</code></p></li><li><p>在<code>new.js</code>中添加如下代码：</p></li></ul><pre><code class="javascript">var spawn = require('child_process').exechexo.on('new', function(data){ spawn('start "D:\Program Files\Typora\Typora.exe" ' + data.path)})</code></pre><p>其中<code>D:\Program Files\Typora\Typora.exe</code>改成你自己编辑器的绝对地址即可。</p><p><strong>预览效果：</strong></p><p><img src="https://picup.heson10.com/img/upyun/2020/10/fornewpost.gif" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/fornewpost.gif" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="新建文章打开编辑器"></p><article class="message zi"><div class="message_body"><p>如果是mac用户，试试下面代码（未测试）</p></div></article><pre><code class="javascript">var exec = require('child_process').exechexo.on('new', function(data){ exec('open -a "markdown编辑器绝对路径.app" ' + data.path)})</code></pre>]]></content>
<summary type="html"><article class="message lv"><div class="message_body"><p>又一个懒癌患者诞生。新建文章后，不愿意去_post文件夹里去找。试试这个方法。</p></div></article>
<ul>
<li><p>在HEXO根目录下新</summary>
<category term="hexo" scheme="https://www.heson10.com/categories/hexo/"/>
<category term="hexo" scheme="https://www.heson10.com/tags/hexo/"/>
<category term="编辑" scheme="https://www.heson10.com/tags/%E7%BC%96%E8%BE%91/"/>
</entry>
<entry>
<title>BB短博文Hexo-Butterfly主题适配</title>
<link href="https://www.heson10.com/posts/3510.html"/>
<id>https://www.heson10.com/posts/3510.html</id>
<published>2020-10-21T16:33:55.000Z</published>
<updated>2022-06-07T14:18:23.272Z</updated>
<content type="html"><![CDATA[<h2 id="🎀系列文章"><a href="#🎀系列文章" class="headerlink" title="🎀系列文章"></a>🎀系列文章</h2><p>10月19日：<a href="/posts/22793.html">《BB短博文Hexo-Matery主题适配》</a></p><p>10月20日：<a href="/posts/26865.html">《BB短博文Hexo-Next主题(8.0+)适配》</a></p><p>10月21日：<a href="/posts/3510.html">《BB短博文Hexo-Butterfly主题适配》</a></p><p>10月30日：<a href="/posts/58339.html">《Typecho-Cuteen3主题哔哔适配》</a></p><p>11月30日：<a href="/posts/25624.html">《Hexo-bb 插件，通过手机微信随时随地发表碎片化思想》</a> 👍</p><p>12月04日：<a href="/posts/57231.html">《Typecho Cuteen4 哔哔页面适配》</a></p><article class="message lan"><div class="message_body"><p>我又双叒叕来了！这次是Hexo-Butterfly主题的哔哔适配。</p></div></article><p>之前，哔哔功能已经适配了<code>Volantis</code>（ejs模板）、<code>Matery</code>（ejs模板）、<code>Next</code>（njk模板），越来越多的小伙伴已经用上了哔哔功能。</p><p>今天在NEXT主题群里，@bynote 小伙伴问道：</p><p><img src="https://7.dusays.com/2020/10/21/ee488a8230b03.png" class="lazyload" data-srcset="https://7.dusays.com/2020/10/21/ee488a8230b03.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="butterfly询问适配BB"></p><article class="message huang"><div class="message_body"><p>ok，没问题👌开整！</p></div></article><p><code>Butterfly</code>这款主题用的是<code>pug模板</code><darkb-text>（对代码缩进有极端的要求）</darkb-text>，跟之前适配工作的不太一样，代码需要调整很多。先上效果图：</p><p><img src="https://7.dusays.com/2020/10/21/fcdccfbc02860.png" class="lazyload" data-srcset="https://7.dusays.com/2020/10/21/fcdccfbc02860.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="butterfly哔哔效果图"></p><article class="message hong"><div class="message_body"><p>💛💛💛💛教程开始↓↓↓↓↓↓↓💛💛💛💛</p></div></article><h2 id="准备工作"><a href="#准备工作" class="headerlink" title="准备工作"></a>准备工作</h2><ul><li>leancloud创建存储空间</li><li>关注微信公众号，绑定api</li></ul><p>前面两篇文章都有介绍，这里不啰嗦。👉<a href="/posts/15701.html#Leancloud%E5%88%9B%E5%BB%BA%E5%AD%98%E5%82%A8%E7%A9%BA%E9%97%B4">点我</a></p><h2 id="创建bb-pug模板"><a href="#创建bb-pug模板" class="headerlink" title="创建bb.pug模板"></a>创建bb.pug模板</h2><p>在<code>themes\butterfly\layout\includes\page\</code>下创建<code>bb.pug</code>模板，填如下代码：</p><pre><code class="pug">if top_img === false h1.page-title= page.titlestyle(type="text/css"). @font-face { font-family: "iconfont"; src: url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.eot?t=1586882866168'); /* IE9 */ src: url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.eot?t=1586882866168#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAALcAAsAAAAAB2gAAAKPAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCCfgqCUII8ATYCJAMMCwgABCAFhG0HQBuEBsiuMRkynL4YFCHtLKs4b+k7/80U8DwHIB6+xtr7u3vniDZI6tmnkyDS8NC5iFgJlE7pTPcO8e5b+803aYQy8YtH1JPKyZzY3ttb1EonioVGSBAiRJp4JV9cFppCxLpe2z8sUs37O4QEDFRM0lFeAw4XN6bQPG06zTG8DRwHFOBeGEVWIjE+mP8wduVFPCbQNK4ktN8/OgFJhbEqEFemLkEyFVcUVqoL1ZKDRbyIqafb9AA8+9+PX41IklQyY+PBSZ8KnR+9iBx0OxZcp8PxvGDHyFgACnFY6j8QCfMLIppKPmoCrGtW8OG/y0eufLX/8AiJqDKa22AGWpMzUth6p6aARySQQRUUL4AnSBmuyvIwPdbz21OX5ybO5duOJifaLl6cvkrd1HR7kWEy6yikff29PvgO17V/Tf/9f/oN3PDqz22a719IYlZJHQetpLY08MV6fwFDrF0B6F4XyB3/FyEEnZnU2XGtVwHvpxtA1d6pftKB4AcoWo4U1QQbiiy35Xow27whbwK2NNFlhAc99zeOtM4S6ikFQ1IzhqxuglAoC6ho2UBV3Raa5g0cbxnCRURpYM4pQOh3h6TXG7J+j4RCeULFqFdU9UcETYfRdGHLVJjpHk6SIBXlTTQV5mmWS6SD1jHSVx2JJ1U+a4p4YKawvrSSLQ2QR3yMLcGa3hBCQ40zF/vBc+Q4DH3OLFJExRDCb64un5S9qaIwF9L2cEQiEBWSbUImBePR3PFCOvf5MUS3yiHhNR0VySmEC5jTo7qKWgvCgN5r1XEtrwTW6BoEQYM0HONC/cBLHDPPIL98noUohAqjR7uvWVV1HlVbfWV+o/t8J6DJOJ4jRY6idmVKnmVS1q8tK8zfBAAA') format('woff2'), url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.woff?t=1586882866168') format('woff'), url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.ttf?t=1586882866168') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */ url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.svg?t=1586882866168#iconfont') format('svg'); /* iOS 4.1- */ } .iconfont { font-family: "iconfont" !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-lianjie:before { content: "\e6a3"; } .icon-lianjie-copy:before { content: "\e6a4"; }!= page.contentmain#app p.tip 共计发送 {{count}} 条说说 .timenode(v-for="item in contents" v-cloak) .meta p time(v-bind:datetime="item.attributes.time") {{item.attributes.time}} .body p(v-html='item.attributes.content')script(src='https://cdn.bootcss.com/vue/2.6.11/vue.min.js')script(src='https://cdn.jsdelivr.net/npm/[email protected]/dist/av-min.js')script. var { Query } = AV; AV.init({ appId: "!{theme.bbtime.appId}", appKey: "!{theme.bbtime.appKey}", serverURLs: '!{theme.bbtime.serverURLs}' }); var query = new AV.Query('content'); var app = new Vue({ el: '#app', data: { page: 0, count: 0, contents: [] }, methods: { loadMore: function (event) { getData(++this.page); } } }) function urlToLink(str) { //增加发图片功能 var re = /\bhttps?:\/\/(?!\S+(?:jpe?g|png|bmp|gif|webp|gif))\S+/g; var re_forpic = /\bhttps?:\/\/.*?(\.gif|\.jpeg|\.png|\.jpg|\.bmp|\.webp)/g; str = str.replace(re, function (website) { return "<a href='" + website + "' target='_blank'> <i class='iconfont icon-lianjie-copy'></i>链接 </a>"; }); str = str.replace(re_forpic, function (imgurl) { return "<img src='" + imgurl + "' /> "; }); return str; } //友好地显示时间 function timeago(dateTimeStamp) { var minute = 1000 * 60; //把分，时，天，周，半个月，一个月用毫秒表示 var hour = minute * 60; var day = hour * 24; var week = day * 7; var month = day * 30; var now = new Date().getTime(); //获取当前时间毫秒 var diffValue = now - dateTimeStamp; //时间差 if (diffValue < 0) { return; } var minC = diffValue / minute; //计算时间差的分，时，天，周，月 var hourC = diffValue / hour; var dayC = diffValue / day; var weekC = diffValue / week; var monthC = diffValue / month; if (monthC >= 1 && monthC <= 3) { result = " " + parseInt(monthC) + " 月前" } else if (weekC >= 1 && weekC <= 3) { result = " " + parseInt(weekC) + " 周前" } else if (dayC >= 1 && dayC <= 6) { result = " " + parseInt(dayC) + " 天前" } else if (hourC >= 1 && hourC <= 23) { result = " " + parseInt(hourC) + " 小时前" } else if (minC >= 1 && minC <= 59) { result = " " + parseInt(minC) + " 分钟前" } else if (diffValue >= 0 && diffValue <= minute) { result = "刚刚" } else { var datetime = new Date(); datetime.setTime(dateTimeStamp); var Nmonth = datetime.getMonth() + 1 < 10 ? "0" + (datetime.getMonth() + 1) : datetime.getMonth() + 1; var Ndate = datetime.getDate() < 10 ? "0" + datetime.getDate() : datetime.getDate(); result = Nmonth + "-" + Ndate } return result; } function getData(page = 0) { query.descending('createdAt').skip(page * 10).limit(10).find().then(function (results) { if (results.length == 0) { alert('之前没发表过说说了') } else { let resC = results; reqData = false; resC.forEach((i) => { let dateTmp = new Date(i.createdAt); i.attributes.time = timeago(dateTmp); i.attributes.content = urlToLink(i.attributes.content); app.contents.push(i); }) } }, function (error) { }); } getData(0); query.count().then(function (count) { app.count = count; }, function (error) { });</code></pre><h2 id="修改page-pug"><a href="#修改page-pug" class="headerlink" title="修改page.pug"></a>修改page.pug</h2><p>在<code>themes\butterfly\layout\page.pug</code>中，如下位置</p><p><img src="https://7.dusays.com/2020/10/21/dcb245bc7b1f9.png" class="lazyload" data-srcset="https://7.dusays.com/2020/10/21/dcb245bc7b1f9.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="page.pug的修改"></p><p>加上如下代码**(注意代码缩进)**：</p><pre><code class="pug"> when 'bb' include includes/page/bb.pug</code></pre><h2 id="添加css样式"><a href="#添加css样式" class="headerlink" title="添加css样式"></a>添加css样式</h2><p>丢进<code>themes\butterfly\source\css\index.styl</code>里面</p><pre><code class="css">/* bb样式 */div.timenode { position: relative; } div.timenode:before, div.timenode:after { content: ''; z-index: 1; position: absolute; background: rgba(68,215,182,0.5); width: 2px; left: 7px; } div.timenode:before { top: 0px; height: 6px; } div.timenode:after { top: 26px; height: calc(100% - 26px); } div.timenode:last-child:after { height: calc(100% - 26px - 16px); border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; } div.timenode .meta, div.timenode .body { max-width: calc(100% - 24px); } div.timenode .meta { position: relative; color: var(--color-meta); font-size: 0.875rem; line-height: 32px; height: 32px; } div.timenode .meta:before, div.timenode .meta:after { content: ''; position: absolute; top: 8px; z-index: 2; } div.timenode .meta:before { background: rgba(68,215,182,0.5); width: 16px; height: 16px; border-radius: 8px; } div.timenode .meta:after { background: #44d7b6; margin-left: 2px; margin-top: 2px; width: 12px; height: 12px; border-radius: 6px; transform: scale(0.5); transition: all 0.28s ease; -moz-transition: all 0.28s ease; -webkit-transition: all 0.28s ease; -o-transition: all 0.28s ease; } div.timenode .meta p { font-weight: bold; margin: 0 0 0 24px; } div.timenode .body { margin: 4px 0 16px 24px; padding: 16px; border-radius: 8px; background: var(--color-block); display: inline-block; } div.timenode .body:empty { display: none; } div.timenode .body >*:first-child { margin-top: 0.25em; } div.timenode .body >*:last-child { margin-bottom: 0.25em; } div.timenode .body .highlight { border: 1px solid #e4e4e4; } div.timenode:hover .meta { color: var(--color-text); } div.timenode:hover .meta:before { background: rgba(255,87,34,0.5); } div.timenode:hover .meta:after { background: #ff5722; transform: scale(1); } div.timenode .body { margin: 0 0 0 24px; padding: 16px; border-radius: 8px; background: #f6f6f6; display: inline-block;}</code></pre><h2 id="修改主题配置-config-yml"><a href="#修改主题配置-config-yml" class="headerlink" title="修改主题配置_config.yml"></a>修改主题配置_config.yml</h2><p>在主题配置中加入（<strong>注意要顶格</strong>）：</p><pre><code class="yaml">## 哔哔功能配置## 关注公众号 "哔哔点啥"，发送: //bindCurrentUser:你的APPID,你的MASTERKEY,你的RESTAPI ## 可用leancloud国际版，国际版api为 https://appid前八位.api.lncldglobal.com bbtime: appId: 你的appId appKey: 你的appKey serverURLs: https://你的api</code></pre><h2 id="创建bb页面"><a href="#创建bb页面" class="headerlink" title="创建bb页面"></a>创建bb页面</h2><p>输入终端命令：</p><pre><code class="shell">hexo new page bb</code></pre><p><code>hexo</code>就在<code>source</code>文件夹下创建了<code>bb/index.md</code></p><p>修改<code>index.md</code>的<code>frontmater</code>下的<code>layout</code>为<code>bb</code>：</p><pre><code>---title: 黑石说type: bb---</code></pre><article class="message lv"><div class="message_body"><p>这个地方是tpye不是layout，跟之前的不一样，注意注意注意！</p></div></article><p>里面的文字可以自己随意加，会显示在<code>哔哔</code>的上方。</p><h2 id="开启了pjax功能的，请ban掉bb页面"><a href="#开启了pjax功能的，请ban掉bb页面" class="headerlink" title="开启了pjax功能的，请ban掉bb页面"></a>开启了pjax功能的，请ban掉bb页面</h2><p><img src="https://picup.heson10.com/img/upyun/2020/10/14.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/14.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="pjax下ban掉bb页面"></p><p>完毕！</p>]]></content>
<summary type="html"><h2 id="🎀系列文章"><a href="#🎀系列文章" class="headerlink" title="🎀系列文章"></a>🎀系列文章</h2><p>10月19日：<a href="/posts/22793.html">《BB短博文Hexo-Matery主题</summary>
<category term="hexo" scheme="https://www.heson10.com/categories/hexo/"/>
<category term="哔哔" scheme="https://www.heson10.com/categories/hexo/%E5%93%94%E5%93%94/"/>
<category term="hexo" scheme="https://www.heson10.com/tags/hexo/"/>
<category term="哔哔" scheme="https://www.heson10.com/tags/%E5%93%94%E5%93%94/"/>
<category term="说说" scheme="https://www.heson10.com/tags/%E8%AF%B4%E8%AF%B4/"/>
<category term="butterfly" scheme="https://www.heson10.com/tags/butterfly/"/>
</entry>
<entry>
<title>BB短博文Hexo-Next主题(8.0+)适配</title>
<link href="https://www.heson10.com/posts/26865.html"/>
<id>https://www.heson10.com/posts/26865.html</id>
<published>2020-10-20T11:33:55.000Z</published>
<updated>2022-06-07T14:18:23.272Z</updated>
<content type="html"><![CDATA[<article class="message zi"><div class="message_body"><p>大家好，我又来适配bb短博文功能了。😁</p></div></article><p>上次是适配Matery主题，这次适配的是最新版8.0以后的next主题（<strong>模板后缀为njk</strong>）。</p><darkb-text>性冷淡风格的</darkb-text>next效果图来了：<p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201019234407042.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201019234407042.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="黑石哔哔next主题效果图"></p><h2 id="🎀系列文章"><a href="#🎀系列文章" class="headerlink" title="🎀系列文章"></a>🎀系列文章</h2><p>10月19日：<a href="/posts/22793.html">《BB短博文Hexo-Matery主题适配》</a></p><p>10月20日：<a href="/posts/26865.html">《BB短博文Hexo-Next主题(8.0+)适配》</a></p><p>10月21日：<a href="/posts/3510.html">《BB短博文Hexo-Butterfly主题适配》</a></p><p>10月30日：<a href="/posts/58339.html">《Typecho-Cuteen3主题哔哔适配》</a></p><p>11月30日：<a href="/posts/25624.html">《Hexo-bb 插件，通过手机微信随时随地发表碎片化思想》</a> 👍</p><p>12月04日：<a href="/posts/57231.html">《Typecho Cuteen4 哔哔页面适配》</a></p><h2 id="🎪教程"><a href="#🎪教程" class="headerlink" title="🎪教程"></a>🎪教程</h2><h3 id="准备工作"><a href="#准备工作" class="headerlink" title="准备工作"></a>准备工作</h3><ul><li>leancloud创建存储空间</li><li>关注微信公众号，绑定api</li></ul><p>前面两篇文章都有介绍，这里不啰嗦。</p><h3 id="创建bb-njk模板"><a href="#创建bb-njk模板" class="headerlink" title="创建bb.njk模板"></a>创建bb.njk模板</h3><p>在<code>themes\next\layout</code>中创建<code>bb,njk</code>模板，填以下代码：</p><p><a href="https://github.com/heson525/heson-demo/blob/main/bbtime/bb.njk">https://github.com/heson525/heson-demo/blob/main/bbtime/bb.njk</a></p><p>因为转义问题，代码上传到<code>github</code>。</p><h3 id="增加CSS样式"><a href="#增加CSS样式" class="headerlink" title="增加CSS样式"></a>增加CSS样式</h3><p>丢在<code>themes\next\source\css\main.styl</code>里</p><pre><code class="css">/* bb样式 */div.timenode { position: relative; } div.timenode:before, div.timenode:after { content: ''; z-index: 1; position: absolute; background: rgb(167, 167, 167); width: 2px; left: 7px; } div.timenode:before { top: 0px; height: 6px; } div.timenode:after { top: 26px; height: calc(100% - 26px); } div.timenode:last-child:after { height: calc(100% - 26px - 16px); border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; } div.timenode .meta, div.timenode .body { max-width: calc(100% - 24px); } div.timenode .meta { position: relative; color: var(--color-meta); font-size: 0.875rem; line-height: 32px; height: 32px; } div.timenode .meta:before, div.timenode .meta:after { content: ''; position: absolute; top: 8px; z-index: 2; } div.timenode .meta:before { background: rgba(83, 83, 83, 0.5); width: 16px; height: 16px; border-radius: 8px; } div.timenode .meta:after { background: #111; margin-left: 2px; margin-top: 2px; width: 12px; height: 12px; border-radius: 6px; transform: scale(0.5); transition: all 0.28s ease; -moz-transition: all 0.28s ease; -webkit-transition: all 0.28s ease; -o-transition: all 0.28s ease; } div.timenode .meta p { font-weight: bold; margin: 0 0 0 24px; } div.timenode .body { margin: 4px 0 16px 24px; padding: 16px; border-radius: 8px; background: var(--color-block); display: inline-block; } div.timenode .body:empty { display: none; } div.timenode .body >*:first-child { margin-top: 0.25em; } div.timenode .body >*:last-child { margin-bottom: 0.25em; } div.timenode .body .highlight { border: 1px solid #e4e4e4; } div.timenode:hover .meta { color: var(--color-text); } div.timenode:hover .meta:before { background: rgba(255,87,34,0.5); } div.timenode:hover .meta:after { background: #ff5722; transform: scale(1); } div.timenode .body { margin: 0 0 0 24px; padding: 16px; border-radius: 8px; background: #f6f6f6; display: inline-block;}</code></pre><h3 id="修改主题配置-config-yml"><a href="#修改主题配置-config-yml" class="headerlink" title="修改主题配置_config.yml"></a>修改主题配置_config.yml</h3><p>在主题配置中加入（<strong>注意要顶格</strong>）：</p><pre><code class="yaml">## 哔哔功能配置## 关注公众号 "黑石哔哔"，发送: //bindCurrentUser:你的APPID,你的MASTERKEY,你的RESTAPI ## 可用leancloud国际版，国际版api为 https://appid前八位.api.lncldglobal.com bbtime: appId: 你的appId appKey: 你的appKey serverURLs: https://你的api</code></pre><h3 id="创建bb页面"><a href="#创建bb页面" class="headerlink" title="创建bb页面"></a>创建bb页面</h3><p>输入终端命令：</p><pre><code class="shell">hexo new page bb</code></pre><p><code>hexo</code>就在<code>source</code>文件夹下创建了<code>bb/index.md</code></p><p>修改<code>index.md</code>的<code>frontmater</code>下的<code>layout</code>为<code>bb</code>：</p><pre><code>---title: 黑石说layout: bb---</code></pre><p>里面的文字可以自己随意加，会显示在<code>哔哔</code>的上方。</p><p>完毕！</p><article class="message lv"><div class="message_body"><p>还需要什么主题的哔哔呢？留个言吧。</p></div></article>]]></content>
<summary type="html"><article class="message zi"><div class="message_body"><p>大家好，我又来适配bb短博文功能了。😁</p></div></article>
<p>上次是适配Matery主题，这次适配的是最新版8.0以后的next主题（<s</summary>
<category term="hexo" scheme="https://www.heson10.com/categories/hexo/"/>
<category term="哔哔" scheme="https://www.heson10.com/categories/hexo/%E5%93%94%E5%93%94/"/>
<category term="hexo" scheme="https://www.heson10.com/tags/hexo/"/>
<category term="哔哔" scheme="https://www.heson10.com/tags/%E5%93%94%E5%93%94/"/>
<category term="说说" scheme="https://www.heson10.com/tags/%E8%AF%B4%E8%AF%B4/"/>
<category term="next" scheme="https://www.heson10.com/tags/next/"/>
</entry>
<entry>
<title>BB短博文Hexo-Matery主题适配</title>
<link href="https://www.heson10.com/posts/22793.html"/>
<id>https://www.heson10.com/posts/22793.html</id>
<published>2020-10-19T18:39:22.000Z</published>
<updated>2022-06-07T14:18:23.272Z</updated>
<content type="html"><![CDATA[<p>之前哔哔短博文已经适配了<code>Volantis主题</code>。效果可见这篇文章：<a href="https://www.heson10.com/posts/15701.html">《哔哔！换个姿势在静态博客上发短博文》</a></p><p>我的哔哔页面：<a href="https://www.heson10.com/bb">https://www.heson10.com/bb</a></p><p>今天抽空把<code>Matery主题</code>也适配了，效果如下<strong>（支持发图片）</strong>：</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201019184730558.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201019184730558.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="黑石哔哔matery适配效果"></p><h2 id="🎀系列文章"><a href="#🎀系列文章" class="headerlink" title="🎀系列文章"></a>🎀系列文章</h2><p>10月19日：<a href="/posts/22793.html">《BB短博文Hexo-Matery主题适配》</a></p><p>10月20日：<a href="/posts/26865.html">《BB短博文Hexo-Next主题(8.0+)适配》</a></p><p>10月21日：<a href="/posts/3510.html">《BB短博文Hexo-Butterfly主题适配》</a></p><p>10月30日：<a href="/posts/58339.html">《Typecho-Cuteen3主题哔哔适配》</a></p><p>11月30日：<a href="/posts/25624.html">《Hexo-bb 插件，通过手机微信随时随地发表碎片化思想》</a> 👍</p><p>12月04日：<a href="/posts/57231.html">《Typecho Cuteen4 哔哔页面适配》</a></p><h2 id="Leancloud创建存储空间"><a href="#Leancloud创建存储空间" class="headerlink" title="Leancloud创建存储空间"></a>Leancloud创建存储空间</h2><p>之前文章已经写过👉<a href="https://www.heson10.com/posts/15701.html#Leancloud%E5%88%9B%E5%BB%BA%E5%AD%98%E5%82%A8%E7%A9%BA%E9%97%B4">点我</a></p><h3 id="微信公众号绑定"><a href="#微信公众号绑定" class="headerlink" title="微信公众号绑定"></a>微信公众号绑定</h3><p>关注下面公众号：</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/bbbbb.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/bbbbb.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="绑定域名"></p><p>按照公众号的提示的命令进行绑定：</p><pre><code>//bindCurrentUser:你的AppID,你的MasterKey,https://你的api域名</code></pre><p>完成后会提示<code>绑定成功</code>。</p><h2 id="Matery适配"><a href="#Matery适配" class="headerlink" title="Matery适配"></a>Matery适配</h2><h3 id="创建bb-ejs模板"><a href="#创建bb-ejs模板" class="headerlink" title="创建bb.ejs模板"></a>创建bb.ejs模板</h3><p>在<code>themes\matery\layout\</code>文件夹中新增<code>bb.ejs</code>模板，加上以下代码：</p><pre><code class="ejs"><% if (theme.verifyPassword.enable) { %><script src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.crypto) %>"></script><script> (function () { let pwd = '<%- page.password %>'; if (pwd && pwd.length > 0) { if (pwd !== CryptoJS.SHA256(prompt('<%- theme.verifyPassword.promptMessage %>')).toString(CryptoJS.enc.Hex)) { alert('<%- theme.verifyPassword.errorMessage %>'); location.href = '<%- url_for("/") %>'; } } })();</script><% } %><%- partial('_partial/post-cover') %><% var isTocEnable = theme.toc.enable && String(page.toc) !== 'false'; var containerClass = isTocEnable ? 'post-container' : 'container'; %><main class="<%- containerClass %> content"> <%- partial('_partial/post-detail.ejs') %></main><script src="https://cdn.bootcss.com/vue/2.6.11/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/av-min.js"></script><script type="text/javascript"> var { Query } = AV; AV.init({ appId: "<%= theme.bbtime.appId %>", appKey: "<%= theme.bbtime.appKey %>", serverURLs: '<%= theme.bbtime.serverURLs %>' }); var query = new AV.Query('content'); var app = new Vue({ el: '#app', data: { page: 0, count: 0, contents: [] }, methods: { loadMore: function (event) { getData(++this.page); } } }) function urlToLink(str) { //增加发图片功能 var re = /\bhttps?:\/\/(?!\S+(?:jpe?g|png|bmp|gif|webp|gif))\S+/g; var re_forpic = /\bhttps?:\/\/.*?(\.gif|\.jpeg|\.png|\.jpg|\.bmp|\.webp)/g; str = str.replace(re, function (website) { return "<a href='" + website + "' target='_blank'> <i class='iconfont icon-lianjie-copy'></i>链接 </a>"; }); str = str.replace(re_forpic, function (imgurl) { return "<img src='" + imgurl + "' /> "; }); return str; } //友好地显示时间 function timeago(dateTimeStamp) { var minute = 1000 * 60; //把分，时，天，周，半个月，一个月用毫秒表示 var hour = minute * 60; var day = hour * 24; var week = day * 7; var month = day * 30; var now = new Date().getTime(); //获取当前时间毫秒 var diffValue = now - dateTimeStamp; //时间差 if (diffValue < 0) { return; } var minC = diffValue / minute; //计算时间差的分，时，天，周，月 var hourC = diffValue / hour; var dayC = diffValue / day; var weekC = diffValue / week; var monthC = diffValue / month; if (monthC >= 1 && monthC <= 3) { result = " " + parseInt(monthC) + " 月前" } else if (weekC >= 1 && weekC <= 3) { result = " " + parseInt(weekC) + " 周前" } else if (dayC >= 1 && dayC <= 6) { result = " " + parseInt(dayC) + " 天前" } else if (hourC >= 1 && hourC <= 23) { result = " " + parseInt(hourC) + " 小时前" } else if (minC >= 1 && minC <= 59) { result = " " + parseInt(minC) + " 分钟前" } else if (diffValue >= 0 && diffValue <= minute) { result = "刚刚" } else { var datetime = new Date(); datetime.setTime(dateTimeStamp); var Nmonth = datetime.getMonth() + 1 < 10 ? "0" + (datetime.getMonth() + 1) : datetime.getMonth() + 1; var Ndate = datetime.getDate() < 10 ? "0" + datetime.getDate() : datetime.getDate(); result = Nmonth + "-" + Ndate } return result; } function getData(page = 0) { query.descending('createdAt').skip(page * 10).limit(10).find().then(function (results) { if (results.length == 0) { alert('之前没发表过说说了') } else { let resC = results; reqData = false; resC.forEach((i) => { let dateTmp = new Date(i.createdAt); i.attributes.time = timeago(dateTmp); i.attributes.content = urlToLink(i.attributes.content); app.contents.push(i); }) } }, function (error) { }); } getData(0); query.count().then(function (count) { app.count = count; }, function (error) { });</script><% if (theme.mathjax.enable && page.mathjax) { %><script src="<%- theme.mathjax.cdn %>"></script><script> MathJax.Hub.Config({ tex2jax: { inlineMath: [['$', '$'], ['\(', '\)']] } });</script><% } %></code></pre><h3 id="修改post-detail-ejs"><a href="#修改post-detail-ejs" class="headerlink" title="修改post-detail.ejs"></a>修改post-detail.ejs</h3><p>在<code>themes\matery\layout\_partial\post-detail.ejs</code>中，这个位置：</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201019190904474.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201019190904474.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="image-20201019190904474"></p><p>加上如下代码：</p><pre><code class="ejs"><% if (page.layout == 'bb') { %><style> @font-face { font-family: "iconfont"; src: url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.eot?t=1586882866168'); /* IE9 */ src: url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.eot?t=1586882866168#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAALcAAsAAAAAB2gAAAKPAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCCfgqCUII8ATYCJAMMCwgABCAFhG0HQBuEBsiuMRkynL4YFCHtLKs4b+k7/80U8DwHIB6+xtr7u3vniDZI6tmnkyDS8NC5iFgJlE7pTPcO8e5b+803aYQy8YtH1JPKyZzY3ttb1EonioVGSBAiRJp4JV9cFppCxLpe2z8sUs37O4QEDFRM0lFeAw4XN6bQPG06zTG8DRwHFOBeGEVWIjE+mP8wduVFPCbQNK4ktN8/OgFJhbEqEFemLkEyFVcUVqoL1ZKDRbyIqafb9AA8+9+PX41IklQyY+PBSZ8KnR+9iBx0OxZcp8PxvGDHyFgACnFY6j8QCfMLIppKPmoCrGtW8OG/y0eufLX/8AiJqDKa22AGWpMzUth6p6aARySQQRUUL4AnSBmuyvIwPdbz21OX5ybO5duOJifaLl6cvkrd1HR7kWEy6yikff29PvgO17V/Tf/9f/oN3PDqz22a719IYlZJHQetpLY08MV6fwFDrF0B6F4XyB3/FyEEnZnU2XGtVwHvpxtA1d6pftKB4AcoWo4U1QQbiiy35Xow27whbwK2NNFlhAc99zeOtM4S6ikFQ1IzhqxuglAoC6ho2UBV3Raa5g0cbxnCRURpYM4pQOh3h6TXG7J+j4RCeULFqFdU9UcETYfRdGHLVJjpHk6SIBXlTTQV5mmWS6SD1jHSVx2JJ1U+a4p4YKawvrSSLQ2QR3yMLcGa3hBCQ40zF/vBc+Q4DH3OLFJExRDCb64un5S9qaIwF9L2cEQiEBWSbUImBePR3PFCOvf5MUS3yiHhNR0VySmEC5jTo7qKWgvCgN5r1XEtrwTW6BoEQYM0HONC/cBLHDPPIL98noUohAqjR7uvWVV1HlVbfWV+o/t8J6DJOJ4jRY6idmVKnmVS1q8tK8zfBAAA') format('woff2'), url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.woff?t=1586882866168') format('woff'), url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.ttf?t=1586882866168') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */ url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.svg?t=1586882866168#iconfont') format('svg'); /* iOS 4.1- */ } .iconfont { font-family: "iconfont" !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-lianjie:before { content: "\e6a3"; } .icon-lianjie-copy:before { content: "\e6a4"; }</style><main id="app"> <p class="tip">共计发送 {{count}} 条说说</p> <div class="timenode" v-for="item in contents" v-cloak> <div class="meta"> <p><time v-bind:datetime="item.attributes.time">{{item.attributes.time}}</time></p> </div> <div class="body"> <p v-html='item.attributes.content'></p> </div> </div></main><% } %></code></pre><h3 id="加上CSS效果"><a href="#加上CSS效果" class="headerlink" title="加上CSS效果"></a>加上CSS效果</h3><p>css丢进<code>themes\matery\source\css\matery.css</code>里面</p><pre><code class="css">/* bb样式 */div.timenode { position: relative; } div.timenode:before, div.timenode:after { content: ''; z-index: 1; position: absolute; background: rgba(68,215,182,0.5); width: 2px; left: 7px; } div.timenode:before { top: 0px; height: 6px; } div.timenode:after { top: 26px; height: calc(100% - 26px); } div.timenode:last-child:after { height: calc(100% - 26px - 16px); border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; } div.timenode .meta, div.timenode .body { max-width: calc(100% - 24px); } div.timenode .meta { position: relative; color: var(--color-meta); font-size: 0.875rem; line-height: 32px; height: 32px; } div.timenode .meta:before, div.timenode .meta:after { content: ''; position: absolute; top: 8px; z-index: 2; } div.timenode .meta:before { background: rgba(68,215,182,0.5); width: 16px; height: 16px; border-radius: 8px; } div.timenode .meta:after { background: #44d7b6; margin-left: 2px; margin-top: 2px; width: 12px; height: 12px; border-radius: 6px; transform: scale(0.5); transition: all 0.28s ease; -moz-transition: all 0.28s ease; -webkit-transition: all 0.28s ease; -o-transition: all 0.28s ease; } div.timenode .meta p { font-weight: bold; margin: 0 0 0 24px; } div.timenode .body { margin: 4px 0 16px 24px; padding: 16px; border-radius: 8px; background: var(--color-block); display: inline-block; } div.timenode .body:empty { display: none; } div.timenode .body >*:first-child { margin-top: 0.25em; } div.timenode .body >*:last-child { margin-bottom: 0.25em; } div.timenode .body .highlight { border: 1px solid #e4e4e4; } div.timenode:hover .meta { color: var(--color-text); } div.timenode:hover .meta:before { background: rgba(255,87,34,0.5); } div.timenode:hover .meta:after { background: #ff5722; transform: scale(1); } div.timenode .body { margin: 0 0 0 24px; padding: 16px; border-radius: 8px; background: #f6f6f6; display: inline-block;}div.timenode time{ margin-left: 20px;}</code></pre><h3 id="修改主题配置-config-yml"><a href="#修改主题配置-config-yml" class="headerlink" title="修改主题配置_config.yml"></a>修改主题配置_config.yml</h3><p>在主题配置中加入（<strong>注意要顶格</strong>）：</p><pre><code class="yaml">## 哔哔功能配置## 关注公众号 "黑石哔哔"，发送: //bindCurrentUser:你的APPID,你的MASTERKEY,你的RESTAPI ## 可用leancloud国际版，国际版api为 https://appid前八位.api.lncldglobal.com bbtime: appId: 你的appId appKey: 你的appKey serverURLs: https://你的api</code></pre><h3 id="创建bb页面"><a href="#创建bb页面" class="headerlink" title="创建bb页面"></a>创建bb页面</h3><p>输入终端命令：</p><pre><code class="shell">hexo new page bb</code></pre><p><code>hexo</code>就在<code>source</code>文件夹下创建了<code>bb/index.md</code></p><p>修改<code>index.md</code>的<code>frontmater</code>下的<code>layout</code>为<code>bb</code>：</p><pre><code>---title: 黑石说layout: bb---</code></pre><p>里面的文字可以自己随意加，会显示在<code>哔哔</code>的上方。</p><p>完毕！</p>]]></content>
<summary type="html"><p>之前哔哔短博文已经适配了<code>Volantis主题</code>。效果可见这篇文章：<a href="https://www.heson10.com/posts/15701.html">《哔哔！换个姿势在静态博客上发短博文》</a></p>
<p>我的哔哔页面：<a </summary>
<category term="hexo" scheme="https://www.heson10.com/categories/hexo/"/>
<category term="哔哔" scheme="https://www.heson10.com/categories/hexo/%E5%93%94%E5%93%94/"/>
<category term="hexo" scheme="https://www.heson10.com/tags/hexo/"/>
<category term="哔哔" scheme="https://www.heson10.com/tags/%E5%93%94%E5%93%94/"/>
<category term="说说" scheme="https://www.heson10.com/tags/%E8%AF%B4%E8%AF%B4/"/>
<category term="微信" scheme="https://www.heson10.com/tags/%E5%BE%AE%E4%BF%A1/"/>
</entry>
<entry>
<title>Office 16 在线激活简单方法</title>
<link href="https://www.heson10.com/posts/7597.html"/>
<id>https://www.heson10.com/posts/7597.html</id>
<published>2020-10-18T11:05:52.000Z</published>
<updated>2022-06-07T14:18:23.272Z</updated>
<content type="html"><![CDATA[<article class="message lv"><div class="message_body"><p>媳妇办公室电脑换新了，帮她把office16激活的过程中，发现一个非常好用的激活方法，不用下载任何软件。</p></div></article><h2 id="激活方法"><a href="#激活方法" class="headerlink" title="激活方法"></a>激活方法</h2><p>将以下内容复制粘贴到记事本，另存为bat文件，双击即可激活。原理，利用网络上的kms激活服务器激活。</p><pre><code class="shell">@echo off%1 %2mshta vbscript:createobject("shell.application").shellexecute("%~s0","goto :runas","","runas",1)(window.close)&goto :eof:runasif exist "%ProgramFiles%\Microsoft Office\Office16\ospp.vbs" cd /d "%ProgramFiles%\Microsoft Office\Office16"if exist "%ProgramFiles(x86)%\Microsoft Office\Office16\ospp.vbs" cd /d "%ProgramFiles(x86)%\Microsoft Office\Office16"for /f %%x in ('dir /b ..\root\Licenses16\proplusvl*.xrm-ms') do cscript ospp.vbs /inslic:"..\root\Licenses16\%%x" >nulcscript //nologo ospp.vbs /inpkey:XQNVK-8JYDB-WJ9W3-YJ8YR-WFG99cscript //nologo ospp.vbs /sethst:kms.03k.orgcscript //nologo ospp.vbs /actpause</code></pre><rainbow-text>亲测成功！</rainbow-text><p>在此记录，以便不时之需。不知道小伙伴们有什么其他的好办法？欢迎留言评论。</p>]]></content>
<summary type="html"><article class="message lv"><div class="message_body"><p>媳妇办公室电脑换新了，帮她把office16激活的过程中，发现一个非常好用的激活方法，不用下载任何软件。</p></div></article>
<h2 id="激</summary>
<category term="技术交流" scheme="https://www.heson10.com/categories/%E6%8A%80%E6%9C%AF%E4%BA%A4%E6%B5%81/"/>
<category term="激活" scheme="https://www.heson10.com/tags/%E6%BF%80%E6%B4%BB/"/>
<category term="office" scheme="https://www.heson10.com/tags/office/"/>
</entry>
<entry>
<title>《灌篮高手》开播27年，168男孩迎来了春天</title>
<link href="https://www.heson10.com/posts/47462.html"/>
<id>https://www.heson10.com/posts/47462.html</id>
<published>2020-10-16T13:15:00.000Z</published>
<updated>2022-06-07T14:18:23.272Z</updated>
<content type="html"><![CDATA[<article class="message lan"><div class="message_body"><p>今天是10月16日，《灌篮高手》开播27年纪念日。从我头像也能看出，这部动画对我影响很大。接下来，和大家分享一篇文章，能引起80、90年代的朋友共鸣的美文。文章写得不错，欢迎阅读。</p></div></article><p><img src="https://picup.heson10.com/img/upyun/2020/10/image_picker4527845269871850709.jpg" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image_picker4527845269871850709.jpg" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="宫城良田"></p><p>今天是个很特殊的日子</p><p><strong>《灌篮高手》开播27周年。</strong></p><p>毫不夸张地说，这届90后，一半男生因《灌篮高手》爱上打球，一半女生第一任虚拟老公是流川枫。</p><p>当年百度贴吧尚辉煌，樱木粉和流川粉大战一千楼，就为证明谁是人气王。</p><p>最后吵得两败俱伤，化敌为友磕cp，你好我也好。</p><p><strong>但这些爱恨都不属于年幼的我，因为我爱的是宫城良田——主角团里最不耀眼的那个。</strong></p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image_picker433243806975383628.jpg" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image_picker433243806975383628.jpg" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="宫城良田头像"></p><p>至今记得，sd五周年人气排名，他竟然都没有能比过翔阳的藤真健司，人气只排第五，给弱小的我重重一击。</p><p>直到前段时间，看到某扑最喜欢的角色投票，宫城良田居然位于高赞第一。</p><p>底下有评论说：<strong>长大后重温灌篮，才发现宫城才是最打动人心的角色。</strong></p><p>因为他是个没有主角光环的普通人，那种在合影里只会露出二分之一脸的背景板。</p><p>这样的男孩，是我们现实生活里的99%，却在《灌篮高手》里，拥有不输给主角的努力和可爱。</p><h2 id="为单恋燃烧的普通男孩"><a href="#为单恋燃烧的普通男孩" class="headerlink" title="为单恋燃烧的普通男孩"></a>为单恋燃烧的普通男孩</h2><p>宫城良田在《灌篮高手》里，是唯二拥有感情线的男孩。</p><p>另一个樱木花道，巧的是，两个人对待爱情如出一辙。</p><p>宫城的人设是什么？</p><p><strong>超级问题儿童，热爱打架斗殴，带着一只耳钉，性格倔强认死理。</strong></p><p>有一次被三井团伙围殴，他只暴揍三井寿一人，根本不管落在身上的其他拳头。</p><p>等他被打到站不起来的时候，三井寿已经晕过去了。</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image_picker293188829263002836.jpg" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image_picker293188829263002836.jpg" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="宫城良田三井寿打架斗殴"></p><p>不知道你们上学时有没有这种男孩，外人面前臭屁又自信，一见到喜欢的女孩，连话都说不完整。</p><p><strong>这可能就是所有的少年共通的软肋，宫城也不意外，他的软肋是篮球部经理彩子。</strong></p><p>刚上高中，宫城看到球场旁明艳的彩子，一见钟情，毅然加入篮球队。</p><p>有一段时间球队状态不好，屡战屡败，他一度想退出。</p><p>但不管球队输多少分，彩子都在旁边拼命地呐喊助威。</p><p><strong>那一瞬间宫城良田决定，一定要让球队变强，打赢比赛，只有这样，才对得起这个女孩。</strong></p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image_picker205064755700851075.jpg" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image_picker205064755700851075.jpg" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="宫城良田受彩子激励"></p><p><strong>为了这个目标，宫城良田硬是把自己修炼成神奈川第一后卫。</strong></p><p>传闻中的宫城良田是不良混混、二年级刺头、问题儿童。</p><p>在彩子面前的他会打翻醋坛子，会没尊严地落泪，被拒绝后还要围着她转。</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image_picker7706192602554047813.jpg" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image_picker7706192602554047813.jpg" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="哭"></p><p>动漫里，我印象最深刻的一幕是有一场湘北军心不稳，几近崩溃。</p><p>这时，彩子非常郑重地在良田手上写下“神奈川第一后卫”几个字，良田上场，重新点燃湘北节奏，拿下比赛。</p><p>看起来是闪瞎眼的主角光环，但井上雄彦想告诉我们这样一个道理：</p><p><strong>在少年人心里，爱就是宇宙间最难以抗衡的力量。</strong></p><p><strong>因为深爱着你，所以我变得更优秀，把最完美的品质赋予你，就算最后没有在一起，很多年后都不会有任何遗憾吧？</strong></p><p>那句“包在我身上，阿彩”，是我在《灌篮高手》里听过最美的情话。</p><h2 id="不可或缺的那个同伴"><a href="#不可或缺的那个同伴" class="headerlink" title="不可或缺的那个同伴"></a>不可或缺的那个同伴</h2><p>上次采访马赛克，高欣很羡慕湘北球队的友情，大家都是独立的个体，却会为目标成为一个整体。 </p><p><strong>但最难的也是相互适应、相互磨合的过程。</strong></p><p>以前看《灌篮高手》，感慨刺头主角们顺利磨合，全靠缘分。</p><p><strong>最近才发现，哪有那么多缘，不过是有人在默默发力。</strong></p><p>这个人是宫城良田。</p><p><strong>他是控球后卫，得控制球队进攻节奏，串联球队，相当于赛场上的教练，就必须了解大家的性格、优势、能力。</strong></p><p>这也是为什么，他和大家相处模式都不一样。</p><p>樱木永远一根筋，流川永远冷着脸，三井永远有距离感。</p><p><strong>宫城良田见人说人话见鬼说鬼话，褒义的那种，游走于团队，堪称湘北社交名媛。</strong></p><p>和樱木相处时，他臭屁又自信，假装嫌弃樱木的技术，激发他的逆反心理，达到好好练习的效果。</p><p>偶尔也很温情，两人在秋千上互诉衷肠、抱头痛哭，像极了大学熄灯后彻夜卧谈交付真心的兄弟。</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image_picker6876708537436752500.jpg" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image_picker6876708537436752500.jpg" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="宫城樱木秋千谈心"></p><p>和高冷男神三井寿相处，宫城会释放大量善意和理解。</p><p>尽管开始两人死对头，但宫城察觉到三井对篮球复杂情感后，抛弃了私人恩怨，让三井迷途知返。</p><p>这份独属于两个男孩的惺惺相惜，我看一次哭一次。</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image_picker356497911176161828.jpg" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image_picker356497911176161828.jpg" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="宫城流鼻血"></p><p>队长赤木一直想称霸全国，压力特别大，只是不会表露出来。</p><p>宫城替他承担着副队长的角色，在球场上从不掉链子，私底下尊重赤木每一个决定。</p><p>所以你看，在湘北球队里，最容易被人忽略的宫城，拥有最细腻的情感和最高的情商。</p><p><strong>其他几个人过于独立和个性，宫城充当起湘北的胶水，悄然游走其间，把大家凝聚在一起。</strong></p><p>只是，他的力量就相当于他的球位——控球后卫，人们只看到耀眼的灌篮，忽略掉微小却不可或缺的后方支援。</p><p>这是独属于宫城的温柔与沉默。</p><h2 id="挺住就是一切的配角光环"><a href="#挺住就是一切的配角光环" class="headerlink" title="挺住就是一切的配角光环"></a>挺住就是一切的配角光环</h2><p>十七年后，灌篮迷一听到主题曲，就能回想到对篮球的爱不亚于生命的热血笨蛋们。 </p><p>那些经典台词我至今都记得——</p><p><strong>樱木花道：我要打篮球。</strong></p><p><strong>三井寿：安西教练，我想打篮球。</strong></p><p><strong>赤木刚宪：一定要称霸全国。</strong></p><p>比起来，宫城似乎没有什么标志性的爱球宣言。</p><p><strong>十年后回看，才发现他对篮球的热爱和他的凝聚力一样，隐藏在小细节里，不易被发现，但爱得深沉。</strong></p><p>有一集，不良团伙砸场子，宫城被打到鲜血横流也不还手。因为一旦还手，球队犯规，不能参加全国大赛。</p><p>那么骄傲的他，半跪着道歉求饶，说“我错了”。</p><p>那一瞬间我真的泪崩，为了梦想可以这么卑微和忍耐，甚至可以抛弃掉自尊。</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image_picker1271619634581755991.jpg" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image_picker1271619634581755991.jpg" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="忍辱负重"></p><p><strong>热爱归热爱，球场上实力说话。</strong></p><p>作为后卫，宫城的短板再明显不过：身高太低，体型过瘦，在对抗性激烈的篮球运动里，毫无优势。</p><p>尤其还要面对其他大魔王后卫：仙道彰、牧绅一、藤真。</p><p>要是搁现在的影视剧，面对这么帅气多金技术好的对手，有短板的小人物会变成个炮灰，衬托别人身姿。</p><p><strong>但168的小个子宫城，硬是凭借卓越的技术，在湘北内外都拥有姓名。</strong></p><p>好几次比赛里，湘北前期处于下风，直到宫城反攻，局势才扭转。</p><p>身高受限？那就着力速度，发挥小身板的机动灵活，叫人防不胜防。</p><p>湘北的战术是快攻，而宫城一定是湘北的速度引擎。</p><p>一个网友曾说：从翔阳到山王，从藤真到阿牧，他遇上的都是最好的控卫，但对手有多强，他就有多强。 </p><p><strong>神奈川后卫No.1，宫城名副其实。</strong> </p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image_picker6264211195379069589.jpg" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image_picker6264211195379069589.jpg" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="宫城良田海报"></p><p><strong>除了热爱和实力，宫城的球商也很高，在比赛里无论困境还是顺境，他都能保持理智和清醒。</strong></p><p>仔细回忆的话，樱木容易犯规，流川偶尔体力不支，三井常常自我怀疑，就连队长赤木也曾受伤下场。</p><p>只有宫城，保持着从未被罚下场的记录，<strong>既是体能好，又是心态优。</strong></p><p>用中国老话说是“胜不骄败不馁”，比赛里需要这样没感情的得分机器。</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image_picker2111859122408468756.jpg" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image_picker2111859122408468756.jpg" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="再来一球"></p><p>其实宫城良田这样的人设不讨喜。</p><p>毕竟美强惨才最惹人怜爱，谁不喜欢看主角被虐然后逆袭，多有张力和泪点啊。</p><p>然而称霸全国不是热血口号，每一次失误都很致命，每一个犹疑都将斩断后路。</p><p><strong>所有人都曾在球场溃败，只有宫城良田卯着劲往前冲。</strong></p><p><strong>就凭这一份韧性，他也是主角团里必不可少的一员，哪有胜利可言，挺住意味着一切。</strong></p><h2 id="结束语"><a href="#结束语" class="headerlink" title="结束语"></a>结束语</h2><p>多年后回看《灌篮高手》，才发现，宫城才是那个最后的人生赢家。</p><p>接任赤木，成为湘北的新队长，带领着湘北继续向着全国大赛冲击；</p><p>彩子也在他身边，继续做着球队助理。</p><p><strong>爱情友情事业，一个都没落下，宫城良田把普普通通的一把牌，都打出花了。</strong></p><p>他没有流川的得天独厚，没有樱木的天赋异禀，绝非一路坦途。</p><p>但“神奈川第一后卫”和“风驰电掣的男子”，都是宫城实打实靠自己努力出来的。</p><p>只要他说一句：“稳住，再进一球”，在屏幕外的我，就知道这场湘北稳了。</p><p>宫城凭借自己站在聚光灯下，让全世界为自己做一次配角。</p><rainbow-text>普通也可以不平凡，这是宫城式的人生信条</rainbow-text><p>而我们这些喜欢宫城的人，也是因为他才懂得，普通人也可以拥有高光时刻。</p><h4 id="转载于-ONE文艺生活-公众号"><a href="#转载于-ONE文艺生活-公众号" class="headerlink" title="转载于 ONE文艺生活 公众号"></a>转载于 ONE文艺生活 公众号</h4>]]></content>
<summary type="html"><article class="message lan"><div class="message_body"><p>今天是10月16日，《灌篮高手》开播27年纪念日。从我头像也能看出，这部动画对我影响很大。接下来，和大家分享一篇文章，能引起80、90年代的朋友共鸣的美文。文章写得</summary>
<category term="生活随笔" scheme="https://www.heson10.com/categories/%E7%94%9F%E6%B4%BB%E9%9A%8F%E7%AC%94/"/>
<category term="纪念" scheme="https://www.heson10.com/tags/%E7%BA%AA%E5%BF%B5/"/>
<category term="灌篮高手" scheme="https://www.heson10.com/tags/%E7%81%8C%E7%AF%AE%E9%AB%98%E6%89%8B/"/>
<category term="动画" scheme="https://www.heson10.com/tags/%E5%8A%A8%E7%94%BB/"/>
</entry>
<entry>
<title>博客成立100天</title>
<link href="https://www.heson10.com/posts/16197.html"/>
<id>https://www.heson10.com/posts/16197.html</id>
<published>2020-10-14T11:02:59.000Z</published>
<updated>2022-06-07T14:18:23.272Z</updated>
<content type="html"><![CDATA[<rainbow-text>100天前，小站诞生了。</rainbow-text><p>在这三个多月的时间里，认识了许多小伙伴，还找到了当年失散的伙伴(<darkb-text>原来玩博客认识的小伙伴</darkb-text>)。博客就像一条纽带，把我们连系在一起。100天的时间说多不多，说少也不少，在这100天里，对于这个博客来说，我还是做了不少工作的。借这个机会，简要记录这100天里，我做的工作和小站发生的一些事情：</p><h2 id="关于博客建设的投入"><a href="#关于博客建设的投入" class="headerlink" title="关于博客建设的投入"></a>关于博客建设的投入</h2><p>因为原来整过wp的博客，对建站还是很清楚的。建立这个hexo博客，就花了10分钟，但从建立之初到现在三个多月的时间，耗在博客上折腾的时间，我敢说绝对不少于<strong>300个小时</strong>。</p><h2 id="折腾之路"><a href="#折腾之路" class="headerlink" title="折腾之路"></a>折腾之路</h2><p>主要是对小站的一些页面美化、博客SEO优化和访问速度提升，前前后后整了3个主题，<a href="https://www.heson10.com/next">Next</a>、<a href="https://www.heson10.com/volantis">Volantis</a>和现在的Cuteen(本人移植hexo版)。博客Archive页面也记录着一些我曾经折腾过的玩意，有兴趣的小伙伴可以看看。<br>现在看到之前写过的文章，就能一下子想到折腾这些的意义和方法。这也确实验证了那句老话：</p><article class="message lv"><div class="message_body"><p>🙇好记性不如烂笔头。✍</p></div></article><p>每次记录折腾的过程，也是对这些知识点的再回顾、再学习。正如我博客第一篇文章最后所说，“对任何渴望进步的人来说，写博客/文章/回答对自己的成长帮助都是巨大的。频率和数量不必过分强求，有话要说就写写，没事就歇歇，随意点。<rainbow-text>因为坚持写作的那一刻起，你就已经开始受益。</rainbow-text>”<br>正因为如此，我会一如既往的坚持下去。</p><h2 id="粗略统计"><a href="#粗略统计" class="headerlink" title="粗略统计"></a>粗略统计</h2><p>100天里：</p><ul><li>加了15个群（真没想到有这么多），其中3个受到群主宠信，成为管理员👮。</li><li>认识小伙伴48个(qq好友45人，微信3人)</li><li>共计收到打赏￥748<darkb-text>含帮助别人建站收入</darkb-text></li><li>折腾了2个hexo主题</li><li>移植了一款typecho付费主题cuteen</li><li>总访问量:9626人，22816次(从8月12日换域名后统计)</li><li>注册域名5个，备案4个</li><li>站点建立5个，其中1个主站，2个分站，1个宝盒，1个要饭。</li><li>共写了42篇文章</li></ul><h2 id="结束语"><a href="#结束语" class="headerlink" title="结束语"></a>结束语</h2><p>是时候考虑我在关于里写的<strong>小目标</strong>了。<br>还在筹划当中。<br>尽量在下一个100天时完工。<br>就酱，啰嗦了一大堆，over。</p>]]></content>
<summary type="html"><rainbow-text>100天前，小站诞生了。</rainbow-text>
<p>在这三个多月的时间里，认识了许多小伙伴，还找到了当年失散的伙伴(<darkb-text>原来玩博客认识的小伙伴</darkb-text>)。博客就像一条纽带，把我们连系在一起。100天的时间</summary>
<category term="生活随笔" scheme="https://www.heson10.com/categories/%E7%94%9F%E6%B4%BB%E9%9A%8F%E7%AC%94/"/>
<category term="纪念" scheme="https://www.heson10.com/tags/%E7%BA%AA%E5%BF%B5/"/>
</entry>
<entry>
<title>哔哔！换个姿势在静态博客上发短博文（Hexo-Volantis适配）</title>
<link href="https://www.heson10.com/posts/15701.html"/>
<id>https://www.heson10.com/posts/15701.html</id>
<published>2020-10-09T14:02:59.000Z</published>
<updated>2022-06-07T14:18:23.272Z</updated>
<content type="html"><![CDATA[<p>要在静态博客上发送短博文，不像wordpress和typecho新建个栏目那么简单。</p><p>之前博客整的是artitalk（说说，想进一步了解，<a href="https://artitalk.js.org/">点我</a>），已经有短博文的那种体验了，而且还能支持发送markdown、图片、音乐等等功能。感觉唯一的缺点就是：<strong>发文不是很方便，需要在博客上登陆。</strong>(至少我觉得很麻烦)</p><p>后来看到 @<a href="https://bearye.cn/archives/488">熊野</a> 的那篇<strong>《哔哔点啥，换个舒服的姿势》</strong>，顿时感觉爱了，<u>这就是我梦寐以求发送短博文的姿势</u>。</p><h2 id="🎀系列文章"><a href="#🎀系列文章" class="headerlink" title="🎀系列文章"></a>🎀系列文章</h2><p>10月19日：<a href="/posts/22793.html">《BB短博文Hexo-Matery主题适配》</a></p><p>10月20日：<a href="/posts/26865.html">《BB短博文Hexo-Next主题(8.0+)适配》</a></p><p>10月21日：<a href="/posts/3510.html">《BB短博文Hexo-Butterfly主题适配》</a></p><p>10月30日：<a href="/posts/58339.html">《Typecho-Cuteen3主题哔哔适配》</a></p><p>11月30日：<a href="/posts/25624.html">《Hexo-bb 插件，通过手机微信随时随地发表碎片化思想》</a> 👍</p><p>12月04日：<a href="/posts/57231.html">《Typecho Cuteen4 哔哔页面适配》</a></p><h2 id="💖效果图"><a href="#💖效果图" class="headerlink" title="💖效果图"></a>💖效果图</h2><ul><li><p>发文效果图，引用熊野大佬的图</p><p><img src="https://upimage.alexhchu.com/2020/05/09/a3d10c630a08f.gif" class="lazyload" data-srcset="https://upimage.alexhchu.com/2020/05/09/a3d10c630a08f.gif" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="微信发送短博文"></p></li><li><p>黑石博客融合效果图：</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201009144958085.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201009144958085.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="黑石博客说说页面"></p></li></ul><h2 id="🍔食用方法"><a href="#🍔食用方法" class="headerlink" title="🍔食用方法"></a>🍔食用方法</h2><h3 id="Leancloud创建存储空间"><a href="#Leancloud创建存储空间" class="headerlink" title="Leancloud创建存储空间"></a>Leancloud创建存储空间</h3><ul><li><p>登陆leancloud创建应用</p></li><li><p>进入应用后，点击<code>创建 Class</code></p></li><li><p>将「 Class 名称」命名为 content </p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201009145412738.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201009145412738.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="创建content的class"></p></li><li><p>点击刚刚创建的content Class，点击<code>添加列</code>并创建名称为content的<code>列</code>，类型为<code>String</code>，注意<code>列注释</code>也要填写（随意填）</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201009145636784.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201009145636784.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="创建列"></p></li><li><p>记录appid，masterkey，api域名</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201009145840298.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201009145840298.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="appid"></p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201009145912340.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201009145912340.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="绑定域名"></p><p>因为我用的是国区版本，api绑定域名需要备案域名。</p><p>国际版leancloud不需要绑定域名，api地址为：</p><pre><code class="html">appid前八位.api.lncldglobal.com</code></pre></li></ul><h3 id="微信公众号绑定"><a href="#微信公众号绑定" class="headerlink" title="微信公众号绑定"></a>微信公众号绑定</h3><p>由 @<a href="https://immmmm.com/">林帅</a> 给的leancloud对接公众号的源码，我搭建在自己公众号上了。 </p><p>关注下面公众号：</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/bbbbb.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/bbbbb.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="绑定域名"></p><p>按照公众号的提示的命令进行绑定：</p><pre><code>//bindCurrentUser:你的AppID,你的MasterKey,https://你的api域名</code></pre><p>完成后会提示<code>绑定成功</code>。</p><h3 id="Hexo博客适配"><a href="#Hexo博客适配" class="headerlink" title="Hexo博客适配"></a>Hexo博客适配</h3><p>这里主要介绍volantis主题（4.0版本已测试）的适配。我这里的代码是在 @熊野 的基础上，<strong>增加了图片发文功能</strong>（直接发送图片外链地址即可）</p><h4 id="新建bb-ejs模板"><a href="#新建bb-ejs模板" class="headerlink" title="新建bb.ejs模板"></a>新建bb.ejs模板</h4><p>在<code>themes\volantis\layout</code>中新建<code>bb.ejs</code>，代码如下：</p><pre><code class="ejs"><%- partial('_pre') %><%- partial('_partial/side') %><div class='l_main<%- page.sidebar == false ? ' no_sidebar' : '' %>'> <%- partial('_partial/article', {post: page, index: false}) %></div><script src="https://cdn.bootcss.com/vue/2.6.11/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/av-min.js"></script><script type="text/javascript"> var { Query } = AV; AV.init({ appId: "<%= theme.plugins.bbtime.appId %>", appKey: "<%= theme.plugins.bbtime.appKey %>", serverURLs: '<%= theme.plugins.bbtime.serverURLs %>' }); var query = new AV.Query('content'); var app = new Vue({ el: '#app', data: { page: 0, count: 0, contents: [] }, methods: { loadMore: function (event) { getData(++this.page); } } }) //友好地显示时间，如果主题开启了theme.lastupd.friendlyShow: true ，则删掉以下 timeago 函数 function timeago(dateTimeStamp) { var minute = 1000 * 60; //把分，时，天，周，半个月，一个月用毫秒表示 var hour = minute * 60; var day = hour * 24; var week = day * 7; var month = day * 30; var now = new Date().getTime(); //获取当前时间毫秒 var diffValue = now - dateTimeStamp; //时间差 if (diffValue < 0) { return; } var minC = diffValue / minute; //计算时间差的分，时，天，周，月 var hourC = diffValue / hour; var dayC = diffValue / day; var weekC = diffValue / week; var monthC = diffValue / month; if (monthC >= 1 && monthC <= 3) { result = " " + parseInt(monthC) + " 月前" } else if (weekC >= 1 && weekC <= 3) { result = " " + parseInt(weekC) + " 周前" } else if (dayC >= 1 && dayC <= 6) { result = " " + parseInt(dayC) + " 天前" } else if (hourC >= 1 && hourC <= 23) { result = " " + parseInt(hourC) + " 小时前" } else if (minC >= 1 && minC <= 59) { result = " " + parseInt(minC) + " 分钟前" } else if (diffValue >= 0 && diffValue <= minute) { result = "刚刚" } else { var datetime = new Date(); datetime.setTime(dateTimeStamp); var Nmonth = datetime.getMonth() + 1 < 10 ? "0" + (datetime.getMonth() + 1) : datetime.getMonth() + 1; var Ndate = datetime.getDate() < 10 ? "0" + datetime.getDate() : datetime.getDate(); result = Nmonth + "-" + Ndate } return result; } function urlToLink(str) { //增加发图片功能 var re = /\bhttps?:\/\/(?!\S+(?:jpe?g|png|bmp|gif|webp|gif))\S+/g; var re_forpic = /\bhttps?:\/\/.*?(\.gif|\.jpeg|\.png|\.jpg|\.bmp|\.webp)/g; str = str.replace(re, function (website) { return "<a href='" + website + "' target='_blank'> <i class='iconfont icon-lianjie-copy'></i>链接 </a>"; }); str = str.replace(re_forpic, function (imgurl) { return "<img src='" + imgurl + "' /> "; }); return str; } function getData(page = 0) { query.descending('createdAt').skip(page * 10).limit(10).find().then(function (results) { if (results.length == 0) { alert('之前没发表过说说了') } else { let resC = results; reqData = false; resC.forEach((i) => { let dateTmp = new Date(i.createdAt); i.attributes.time = timeago(dateTmp); i.attributes.content = urlToLink(i.attributes.content); app.contents.push(i); }) } }, function (error) { }); } getData(0); query.count().then(function (count) { app.count = count; }, function (error) { });</script></code></pre><h4 id="修改article-ejs"><a href="#修改article-ejs" class="headerlink" title="修改article.ejs"></a>修改article.ejs</h4><p>找到<code>themes\volantis\layout\_partial\article.ejs</code>如下图位置所示：</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201009152247251.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201009152247251.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="article修改"></p><p>加上如下代码：</p><pre><code class="ejs"><% if (page.layout == 'bb') { %> <style> @font-face { font-family: "iconfont"; src: url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.eot?t=1586882866168'); /* IE9 */ src: url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.eot?t=1586882866168#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAALcAAsAAAAAB2gAAAKPAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCCfgqCUII8ATYCJAMMCwgABCAFhG0HQBuEBsiuMRkynL4YFCHtLKs4b+k7/80U8DwHIB6+xtr7u3vniDZI6tmnkyDS8NC5iFgJlE7pTPcO8e5b+803aYQy8YtH1JPKyZzY3ttb1EonioVGSBAiRJp4JV9cFppCxLpe2z8sUs37O4QEDFRM0lFeAw4XN6bQPG06zTG8DRwHFOBeGEVWIjE+mP8wduVFPCbQNK4ktN8/OgFJhbEqEFemLkEyFVcUVqoL1ZKDRbyIqafb9AA8+9+PX41IklQyY+PBSZ8KnR+9iBx0OxZcp8PxvGDHyFgACnFY6j8QCfMLIppKPmoCrGtW8OG/y0eufLX/8AiJqDKa22AGWpMzUth6p6aARySQQRUUL4AnSBmuyvIwPdbz21OX5ybO5duOJifaLl6cvkrd1HR7kWEy6yikff29PvgO17V/Tf/9f/oN3PDqz22a719IYlZJHQetpLY08MV6fwFDrF0B6F4XyB3/FyEEnZnU2XGtVwHvpxtA1d6pftKB4AcoWo4U1QQbiiy35Xow27whbwK2NNFlhAc99zeOtM4S6ikFQ1IzhqxuglAoC6ho2UBV3Raa5g0cbxnCRURpYM4pQOh3h6TXG7J+j4RCeULFqFdU9UcETYfRdGHLVJjpHk6SIBXlTTQV5mmWS6SD1jHSVx2JJ1U+a4p4YKawvrSSLQ2QR3yMLcGa3hBCQ40zF/vBc+Q4DH3OLFJExRDCb64un5S9qaIwF9L2cEQiEBWSbUImBePR3PFCOvf5MUS3yiHhNR0VySmEC5jTo7qKWgvCgN5r1XEtrwTW6BoEQYM0HONC/cBLHDPPIL98noUohAqjR7uvWVV1HlVbfWV+o/t8J6DJOJ4jRY6idmVKnmVS1q8tK8zfBAAA') format('woff2'), url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.woff?t=1586882866168') format('woff'), url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.ttf?t=1586882866168') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */ url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.svg?t=1586882866168#iconfont') format('svg'); /* iOS 4.1- */ } .iconfont { font-family: "iconfont" !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-lianjie:before { content: "\e6a3"; } .icon-lianjie-copy:before { content: "\e6a4"; } </style> <main id="app"> <p class="tip">共计发送 {{count}} 条说说</p> <div class="timenode" v-for="item in contents" v-cloak> <div class="meta"> <p><time v-bind:datetime="item.attributes.time">{{item.attributes.time}}</time></p> </div> <div class="body"> <p v-html='item.attributes.content'></p> </div> </div> </main> <% } %></code></pre><h4 id="修改主题配置-config-yml"><a href="#修改主题配置-config-yml" class="headerlink" title="修改主题配置_config.yml"></a>修改主题配置_config.yml</h4><p>找到主题配置的<code>plugins：</code>，在下面加入：</p><pre><code class="yaml"> ## 哔哔功能配置 ## 关注公众号 "黑石哔哔"，发送: //bindCurrentUser:你的APPID,你的MASTERKEY,你的RESTAPI ## 可用leancloud国际版，国际版api为 https://appid前八位.api.lncldglobal.com bbtime: appId: 你的appId appKey: 你的appKey serverURLs: https://你的api</code></pre><h4 id="创建bb页面"><a href="#创建bb页面" class="headerlink" title="创建bb页面"></a>创建bb页面</h4><p>输入终端命令：</p><pre><code class="shell">hexo new page bb</code></pre><p><code>hexo</code>就在<code>source</code>文件夹下创建了<code>bb/index.md</code></p><p>修改<code>index.md</code>的<code>frontmater</code>下的<code>layout</code>为<code>bb</code>：</p><pre><code>---title: 黑石说layout: bb---</code></pre><h4 id="开启了pjax的博客请ban掉bb"><a href="#开启了pjax的博客请ban掉bb" class="headerlink" title="开启了pjax的博客请ban掉bb"></a>开启了pjax的博客请ban掉bb</h4><pre><code> pjax: enable: true timeout: 5000 # The timeout in milliseconds for the XHR requests. Set to 0 to disable the timeout. cacheBust: false # When set to true, Pjax appends a timestamp to skip the browser cache. animation: nprogress # nprogress, circle banUrl: # 被屏蔽的 url 地址将不启用 pjax 跳转，可以在控制台下使用 window.location.pathname 获取 # - /artitalk/ # artitalk 不支持 pjax - /bb/ # bb 不支持 pjax</code></pre><p>完成修改！请享用！</p><p>volantis哔哔演示地址：<a href="https://www.heson10.com/volantis/bb/">https://www.heson10.com/volantis/bb/</a></p><p>独立页面制作源码：<a href="https://github.com/ibearye/talk/tree/master/hosting">https://github.com/ibearye/talk/tree/master/hosting</a></p><p>独立页面演示地址：<a href="https://bb.heson10.com/">https://bb.heson10.com</a></p><h2 id="🎁鸣谢"><a href="#🎁鸣谢" class="headerlink" title="🎁鸣谢"></a>🎁鸣谢</h2><p>感谢 @<a href="https://bearye.cn/archives/488">熊野大佬</a> 的哔哔源码，让我换了个姿势发送短博文。</p><p>感谢 @<a href="https://immmmm.com/">林大帅</a> 发给我的leancloud对接公众号的源码，让我又能开心的折腾。（顺便帮你分流😁）</p><h2 id="更新代码"><a href="#更新代码" class="headerlink" title="更新代码"></a>更新代码</h2><p>10月18日：</p><p>网友 @北海轻歌 反馈加在其他主题的时候，只显示条数，不显示内容。</p><p>原因是没有加上<code>timeago()</code>函数，部分volantis主题没开启友好显示时间功能时也会出现这个情况</p><p>解决方法为：在<code>getData()</code>函数前加上如下代码：</p><pre><code class="js">//友好地显示时间function timeago(dateTimeStamp) { var minute = 1000 * 60; //把分，时，天，周，半个月，一个月用毫秒表示 var hour = minute * 60; var day = hour * 24; var week = day * 7; var month = day * 30; var now = new Date().getTime(); //获取当前时间毫秒 var diffValue = now - dateTimeStamp; //时间差 if (diffValue < 0) { return; } var minC = diffValue / minute; //计算时间差的分，时，天，周，月 var hourC = diffValue / hour; var dayC = diffValue / day; var weekC = diffValue / week; var monthC = diffValue / month; if (monthC >= 1 && monthC <= 3) { result = " " + parseInt(monthC) + " 月前" } else if (weekC >= 1 && weekC <= 3) { result = " " + parseInt(weekC) + " 周前" } else if (dayC >= 1 && dayC <= 6) { result = " " + parseInt(dayC) + " 天前" } else if (hourC >= 1 && hourC <= 23) { result = " " + parseInt(hourC) + " 小时前" } else if (minC >= 1 && minC <= 59) { result = " " + parseInt(minC) + " 分钟前" } else if (diffValue >= 0 && diffValue <= minute) { result = "刚刚" } else { var datetime = new Date(); datetime.setTime(dateTimeStamp); var Nmonth = datetime.getMonth() + 1 < 10 ? "0" + (datetime.getMonth() + 1) : datetime.getMonth() + 1; var Ndate = datetime.getDate() < 10 ? "0" + datetime.getDate() : datetime.getDate(); result = Nmonth + "-" + Ndate } return result; } </code></pre><p>10月19日：</p><p>新增Matery版本适配：<a href="/posts/22793.html">点我传送</a></p><p>新增next和butterfly主题，见系列文章。</p><p>10月27日：</p><p>更改友好显示时间代码：见下方评论区。</p>]]></content>
<summary type="html"><p>要在静态博客上发送短博文，不像wordpress和typecho新建个栏目那么简单。</p>
<p>之前博客整的是artitalk（说说，想进一步了解，<a href="https://artitalk.js.org/">点我</a>），已经有短博文的那种体验了，而且还能支</summary>
<category term="技术交流" scheme="https://www.heson10.com/categories/%E6%8A%80%E6%9C%AF%E4%BA%A4%E6%B5%81/"/>
<category term="hexo" scheme="https://www.heson10.com/categories/hexo/"/>
<category term="哔哔" scheme="https://www.heson10.com/categories/hexo/%E5%93%94%E5%93%94/"/>
<category term="哔哔" scheme="https://www.heson10.com/tags/%E5%93%94%E5%93%94/"/>
<category term="说说" scheme="https://www.heson10.com/tags/%E8%AF%B4%E8%AF%B4/"/>
<category term="微信" scheme="https://www.heson10.com/tags/%E5%BE%AE%E4%BF%A1/"/>
</entry>
<entry>
<title>为Hexo博客建立其他主题分站</title>
<link href="https://www.heson10.com/posts/46324.html"/>
<id>https://www.heson10.com/posts/46324.html</id>
<published>2020-10-09T12:20:01.000Z</published>
<updated>2022-06-07T14:18:23.272Z</updated>
<content type="html"><![CDATA[<p>换了hexo主题后，之前魔改的主题又舍不得删，索性就把他们做成了分站，跟主站一起托管在github平台了。</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201009122853516.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201009122853516.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="黑石hexo分站"></p><p>hexo静态博客这点不错，生成的页面全是html静态页面，直接拖入分站文件夹就ok了。</p><p>有几个地方要注意的是：</p><ul><li>分站域名和url的设置</li><li>主站跳过渲染文件夹的设置</li></ul><h2 id="设置教程"><a href="#设置教程" class="headerlink" title="设置教程"></a>设置教程</h2><h3 id="根目录config-yml设置"><a href="#根目录config-yml设置" class="headerlink" title="根目录config.yml设置"></a>根目录config.yml设置</h3><ul><li><p>切换到分站主题，如volantis主题</p><pre><code class="yaml">theme: volantis</code></pre></li><li><p>url和root设置</p><pre><code class="yaml">url: https://你的域名/volantisroot: /volantis/</code></pre></li></ul><p>设置好之后<code>hexo g</code>生成volantis分站public文件夹下的的html的文件，复制后放入主站的<code>source/volantis</code>文件夹 </p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201009125756974.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201009125756974.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="分站复制到主站"></p><h3 id="主站跳过渲染设置"><a href="#主站跳过渲染设置" class="headerlink" title="主站跳过渲染设置"></a>主站跳过渲染设置</h3><p>在主站的根目录设置里面，找到<code>skip_render</code> 我的设置如下：</p><pre><code class="yaml">skip_render: - 'volantis/**' - 'next/**'</code></pre><p>而后主站<code>hexo cl && hexo g -d</code>就可以了。</p><h2 id="分站效果"><a href="#分站效果" class="headerlink" title="分站效果"></a>分站效果</h2><p>volantis分站：<a href="https://www.heson10.com/volantis/">https://www.heson10.com/volantis/</a></p><p>next分站: <a href="https://www.heson10.com/next/">https://www.heson10.com/next/</a></p>]]></content>
<summary type="html"><p>换了hexo主题后，之前魔改的主题又舍不得删，索性就把他们做成了分站，跟主站一起托管在github平台了。</p>
<p><img src="https://picup.heson10.com/img/upyun/2020/10/image-2020100912285351</summary>
<category term="hexo" scheme="https://www.heson10.com/categories/hexo/"/>
<category term="技巧" scheme="https://www.heson10.com/categories/hexo/%E6%8A%80%E5%B7%A7/"/>
<category term="hexo" scheme="https://www.heson10.com/tags/hexo/"/>
<category term="博客" scheme="https://www.heson10.com/tags/%E5%8D%9A%E5%AE%A2/"/>
<category term="分站" scheme="https://www.heson10.com/tags/%E5%88%86%E7%AB%99/"/>
<category term="主题" scheme="https://www.heson10.com/tags/%E4%B8%BB%E9%A2%98/"/>
</entry>
<entry>
<title>Hexo博客实现随机文章功能</title>
<link href="https://www.heson10.com/posts/31514.html"/>
<id>https://www.heson10.com/posts/31514.html</id>
<published>2020-10-05T22:52:26.000Z</published>
<updated>2022-06-07T14:18:23.272Z</updated>
<content type="html"><![CDATA[<h2 id="写在前面"><a href="#写在前面" class="headerlink" title="写在前面"></a>写在前面</h2><p>动态博客程序提高内链数量必备功能之随机文章。随机文章这个功能旨在增加一定数量的文章内链，往往对增加访客黏性有着很大的帮助。</p><p>当然，静态博客也能实现（<strong>只不过在生成之后就固定了</strong>）。效果：</p><p><img src="https://picup.heson10.com/img/upyun/2020/10/image-20201005230607926.png" class="lazyload" data-srcset="https://picup.heson10.com/img/upyun/2020/10/image-20201005230607926.png" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" alt="黑石博客随机文章功能"></p><h2 id="关键函数"><a href="#关键函数" class="headerlink" title="关键函数"></a>关键函数</h2><pre><code class="ejs">//打乱顺序function shuffle(a) { for (let i = a.length; i; i--) { let j = Math.floor(Math.random() * i); [a[i - 1], a[j]] = [a[j], a[i - 1]]; } return a;}//随机文章函数，根据标签实现相关性function recommended_posts(page, site, limit = 5) { page.tags = page.tags || [] if (page.tags.length == 0) return []; let pageTags = page.tags.map(x => x.name); let sitePosts = site.posts.toArray().map(x => { return { tags: x.tags.toArray().map(y => y.name), title: x.title, permalink: x.permalink, date: x.date, img: x.headimg } }); let relatedPosts = pageTags.map(x => sitePosts.filter(y => y.title != page.title && (y.tags.indexOf(x) != -1 || y.date.format('MM/DD') == page.date.format('MM/DD') || y.headimg == page.headimg))).reduce((prev, next) => { return prev.concat(next); }, []); return shuffle(Array.from(new Set(relatedPosts))).slice(0, limit);}//随机头图，根据标题link.title生成固定的随机头图var hashCode = function (str) { if (!str && str.length === 0) { return 0; } var hash = 0; for (var i = 0, len = str.length; i < len; i++) { hash = ((hash << 5) - hash) + str.charCodeAt(i); hash |= 0; } return hash;}; var featureimg = 'https://picup.heson10.com/img/upyun/home_top_bg.webp'; var featureImages = theme.featureImages;featureimg = featureImages[Math.abs(hashCode(link.title) % featureImages.length)];//把绝对链接改为相对链接，下面的30代表从30个字符开始截取//取值要自己去试试，改为相对链接的好处就是可用pjax var lianjie = function (e){ return e.substr(30)}</code></pre><p>加上随机头图的调用，ejs模板可写成以下形式（根据主题需要，自行修改以下模板）：</p><pre><code class="ejs"><% var post_list = recommended_posts(page, site, theme.recommended_posts.limit) %><% if(post_list.length > 0 && theme.recommended_posts.enable) { %>//此处放侧边栏外框 <% post_list.forEach(function(link) { %> //以下开始文章循环 <% var hashCode = function (str) { if (!str && str.length === 0) { return 0; } var hash = 0; for (var i = 0, len = str.length; i < len; i++) { hash = ((hash << 5) - hash) + str.charCodeAt(i); hash |= 0; } return hash; }; var featureimg = 'https://picup.heson10.com/img/upyun/home_top_bg.webp'; var featureImages = theme.featureImages; featureimg = featureImages[Math.abs(hashCode(link.title) % featureImages.length)]; var lianjie = function (e){ return e.substr(30) } %> //以下参数调用 <%= link.permalink %>//文章绝对链接 <%= lianjie(link.permalink) %> //文章相对链接 <%- link.img %>//文章头图 <%- url_for(featureimg) %>//随机头图地址 <%= date(link.date, config.date_format) %>//日期 <%= link.title %>//文章标题 <% }) %>//此处放侧边栏外框（对应） <% } %></code></pre><p>配置文件如下：</p><pre><code class="yaml"># 随机文章模块recommended_posts: enable: true title: '随便看看' limit: 3# 随机图片featureImages: - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/001.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/002.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/003.jpg - https://cdn.jsdelivr.net/gh/volantis-x/cdn-wallpaper-minimalist/2020/004.jpg - 自己加图片。。。。</code></pre><article class="message hong"><div class="message_body"><p>模板html和CSS样式根据博客需要自行修改</p></div></article><h2 id="鸣谢"><a href="#鸣谢" class="headerlink" title="鸣谢"></a>鸣谢</h2><p>感谢<a href="https://shoka.lostyu.me/">Ruri Shimotsuki</a>（Shoka主题作者）随机文章提供的shuffle思路。</p><p>感谢<a href="https://xaoxuu.com/">xaoxuu</a>（Volantis主题作者）在调用文章头图时提供的查错思路。</p>]]></content>
<summary type="html"><h2 id="写在前面"><a href="#写在前面" class="headerlink" title="写在前面"></a>写在前面</h2><p>动态博客程序提高内链数量必备功能之随机文章。随机文章这个功能旨在增加一定数量的文章内链，往往对增加访客黏性有着很大的帮助。<</summary>
<category term="hexo" scheme="https://www.heson10.com/categories/hexo/"/>
<category term="技巧" scheme="https://www.heson10.com/categories/hexo/%E6%8A%80%E5%B7%A7/"/>
<category term="hexo" scheme="https://www.heson10.com/tags/hexo/"/>
<category term="随机" scheme="https://www.heson10.com/tags/%E9%9A%8F%E6%9C%BA/"/>
<category term="文章" scheme="https://www.heson10.com/tags/%E6%96%87%E7%AB%A0/"/>
<category term="功能" scheme="https://www.heson10.com/tags/%E5%8A%9F%E8%83%BD/"/>
</entry>
</feed>