1 2022

1.1 2022.04

一些 TODO 项,也许可以趁五一假期的时候完成:

  1. 图片放大查看;
  2. 自动生成子目录结构;

1.2 2022.02

也许可以解决暗主体的闪屏问题:Fix the White Flash on Page Load When Using a Dark Theme on a Static Site

2 2021

2.1 2021.07

  • 添加了基于 Algolia 的搜索功能。

2.2 2021.06

  • 服务器利用 Adobe TypeKit 提供思源宋体
  • 提升渲染服务器的核心数
  • 实现了延时载入评论模块
  • 仿照 zhaoo 主题给文章内容加上阴影;
  • 修改了 Weekly 栏目中新闻源地址的显示方式,由外链图标改成脚注;
  • 在首页导航栏按钮上添加文章数字;
  • 修改了“前一页”,“后一页”按钮的实现方式,改善了视觉实现;
  • 放弃使用 NexT 主题,现在基于 Chic 主题,做深度定制改造;
  • 将博客代码搬上服务器;
  • hexo s 的命令用 Supervisor 托管,配置如下:
    1
    2
    3
    4
    5
    6
    7
    8
    [program:blog]
    command=hexo s -i 192.168.220.1 -p 4000
    user=lena
    autostart=true
    autorestart=true
    redirect_stderr=true
    stdout_logfile=/home/lena/projects/blog/log.txt
    directory=/home/lena/projects/blog

3 2020

3.1 2020.08

调整网页打印出来的格式,隐藏一些不必要的内容。通过在 custom.styl 文件中添加对应的样式来实现。

1
2
3
@media print {
// ...
}

3.2 2020.04

  • 更改部署方式,从 Github Pages 迁移到了自己的服务器上,并引入了权限控制。
  • 字体修改成思源宋体,并实现从 Typekit 上动态载入字体。
  • eng-origin类的span表现添加一个 hover 效果。当鼠标悬停时,英文原文内容的颜色变成深灰色,且字体放大。
  • 修改了正文字体,为宋体思源宋体
  • 禁用「汉字标准格式」,乱改字体太难控制了

3.3 2020.03

处理search.xml的格式问题。这个比较蛋疼,是编辑器 vscode 有时候会很诡异地在文档中插入\x08这个 ASCII 字符,这个字符表示的是 backspace 操作。这对于正文影响不大,但是生成search.xml时会导致 UTF-8 的格式问题。我写了一个脚本来搜索替换这个字符:

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
#!/usr/bin/env python3

import os

replace_t = [chr(8)]


def replace_all(a):
replaced = False
for t in replace_t:
replaced = replaced or (t in a)
a = a.replace(t, '')
return a, replaced


def process_directory(d):
for pname in os.listdir(d):
pname = os.path.join(d, pname)
if os.path.isdir(pname):
process_directory(pname)
continue
elif not pname.endswith('.md'):
continue

with open(pname) as f:
data = f.read()
data, replaced = replace_all(data)
if replaced:
with open(pname, 'w') as f:
f.write(data)


process_directory('./source')

改由 pandoc 来处理 Heading 编号的问题。Next 主体的编号只对侧栏有效,无法为正文的标题添加编号。

修改方法是在_config.ymlpandoc设置加上

1
2
3
4
pandoc:
extra:
- shift-heading-level-by: -1
- number-sections: null

上面的shift-heading-level-by是因为之前我在写文章的时候首级 Heading 使用的##,pandoc 编号会出现0.1的现象,即 pandoc 是从h1开始编号的。加上shift-heading-level-by之后##会被渲染成h1

同时还需要禁用 Next 主题的编号功能。方法是修改theme/next/_config.yml,设置

1
2
toc:
number: false

同时,为了让一些特殊的文档的要求,需要支持通过 front-matter 关闭编号功能。这需要我们修改 pandoc 的逻辑。让 hexo-render-pandoc 检查输入文件的 front-matter,如果发现有unnumbered就不添加number-sections的渲染选项。按照如下内容修改node_modules/hexo-renderer-pandoc/index.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
if (config.extra) {
for (var e in config.extra) {
var eoption = config.extra[e];
for (var key in eoption) {
if (key === "number-sections" && "unnumbered" in options) {
continue;
}
extra.push("--" + key);
if (eoption[key] != null) {
extra.push(eoption[key]);
}
}
}
}

注意在迁移的时候这部分代码会无法同步,需要再次手工修改

不过有一个问题,那就是在渲染器中是看不到 front-matter 的。渲染的调用方式是(见node_modules/hexo/lib/hexo/post.jsPost.prototype.render函数):

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
const options = data.markdown || {};
// ...
return ctx.render.render(
{
text: data.content,
path: source,
engine: data.engine,
toString: true,
onRenderEnd(content) {
if (disableNunjucks) return content;
// Replace cache data with real contents
data.content = cacheObj.loadContent(content);

// Render with Nunjucks
return tag.render(data.content, data);
},
},
options
);

因此我们可以通过options这个渲染器的输入参数获取 front-matter 中的markdown关键字下的内容,也就是说我们在文章的开头加入

1
2
3
4
5
---
# ...
markdown:
unnumbered: true
---

不过这个写法比较麻烦,我们注册一个before-post-render的过滤器来处理

1
2
3
4
5
6
7
8
hexo.extend.filter.register('before_post_render', function (data) {
if ('unnumbered' in data) {
let config = data.markdown || {}
config.unnumbered = data.unnumbered
data.markdown = config
}
return data
}

这样可以自动检测unnumbered并加入到markdown关键字下面。


挖掘 pandoc 的扩展 markdown 功能


为 pages 自动添加创建日期。方法为修改scripts/utils.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
hexo.extend.filter.register("before_post_render", function (data) {
var log = this.log;
// before_post_render之前hexo会给data默认添加上date,所以我们要重新解析front-matter
var tmpPost = front.parse(data.raw);
if (!tmpPost.date && !data.skipAutoDateGenerate) {
if (/.*\.org/.test(data.source)) return data;
//add new generated link
tmpPost.date = data.date.format("YYYY-MM-DD hh:mm:ss");
data.skipAutoDateGenerate = true;
//process post
let postStr = front.stringify(tmpPost);
postStr = "---\n" + postStr;
fs.writeFileSync(data.full_source, postStr, "utf-8");
log.i("Add creation date for " + data.source);
return data;
}
});

在 pages 中现实卜算子阅读计数。修改方法为修改主题中的themes/next/layout/_partials/page/page-header.swig文件,修改后的内容为

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
<div class="post-meta">
{% if page.description %}
<div class="post-description">{{ page.description }}</div>
{% endif %} {% include 'breadcrumb.swig' %}
<!--下面的这个div为添加的内容-->
<div>
{% if not is_index and theme.busuanzi_count.enable and
theme.busuanzi_count.post_views %}
<span class="post-meta-divider">|</span>
<span
class="post-meta-item-icon"
{%
if
not
theme.post_meta.item_text
%}
title="{{ __('post.views') }}"
{%
endif
%}
>
<i class="fa fa-{{ theme.busuanzi_count.post_views_icon }}"></i>
{% if theme.post_meta.item_text %} {{ __('post.views') +
__('symbol.colon') }} {% endif %}
<span class="busuanzi-value" id="busuanzi_value_page_pv"></span>
</span>
{% endif %}
</div>
</div>

4 2019

4.1 2019.12

在根目录下面创建了一个 shell 脚本文件link_posts.sh,用于创建从 pages 发布到 posts 的链接。测试发现 Hexo 不能识别软链接,所以这里创建的都是硬链接。 按照原理来说 git 应该不能管理硬链接。所以这里我们创建一个 shell 脚本,用于将来出现问题之后批量恢复这些链接。

4.2 2019.09

将展示的代码的字体从 14pt 降低到 13pt。

添加了一种增加脚注的方法,表现形式为:

脚注字体较小,为红色。通过自定义脚本(根目录下scripts文件夹下utils.js文件)实现:

1
2
3
4
5
6
7
8
9
10
11
hexo.extend.filter.register("before_post_render", function (data) {
var config = this.config;
if (data.footnote !== true) {
return data;
}
data.content = data.content.replace(
/【~([^】]+)】/g,
'<span class="foot-note-span">【$1】</span>'
);
return data;
});

4.3 2019.08

Reference 部分文字渲染时不使用标准汉字标准格式的em渲染样式。方法为在_layout.swig中运行

1
document.getElementById("refs").setAttribute("lang", "en_US");

4.4 2019.06

  • 在标题前方添加 Emoji

  • 修改了内容宽度

    具体方法为修改文件themes/next/source/css/_variables/Pisces.styl

    1
    2
    3
    4
    // $content-desktop-large        = 1160px
    $content-desktop-large = 960px
    // $content-desktop-largest = 73%
    $content-desktop-largest = 960px
  • 启用了 Han Support

  • 在 menu 中添加 update 项目

  • 字体修改为思源宋体:关于如何在网页中引入思源字体:漫谈 Typekit

    思源宋体

4.5 2019.05

  • 困扰很久的 VS Code 引入莫名其妙添加的不可见 和 等控制字符的问题,最后可以通过“Remove backspace control character”这个插件解决。在 VS Code 的设置中将editor.formatOnSave设置为 true 来自动处理文件。

  • 修复了搜索和 Feed 的问题:文章中存在不可见字符,导致atom.xmlsearch.xml的格式出错

  • 替换了字体服务器的 CDN,从//fonts.googleapis.com修改为//fonts.css.network

  • 修改了 Reference 的样式。方法是在themes/next/source/css/_custom/custom.styl文件中添加如下内容:

    1
    2
    3
    4
    5
    6
    7
    8
    div#refs {
    font-size: 13px;
    line-height: 1.1;
    }

    div#refs p {
    margin: 0;
    }
  • 通过上标提供短的参考信息的方法:

    1
    <sup title="Hover Text">?</sup>