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.yml的pandoc设置加上

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.js的Post.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.xml和search.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>