Hexo-Icarus主题改造:默认开启目录(toc)功能

关于icarus主题的toc功能

默认情况下,我们可以在文章的头部加上“toc: true”,来显示目录结构的。实际写博客的场景是,我希望大多数情况下,都可以显示目录,那就就产生这样一个需求:当我不需要显示目录的时候,只需要在头部输入“toc: false”,就可以了,不写就显示。

如何实现

找到toc组件的js,位置是“themes/icarus/layout/widget/toc.locals.js”,内容如下:

1
2
3
4
5
6
7
8
9
10
module.exports = (ctx, locals) => {
const { layout, content } = ctx.page;
const { get_config } = ctx;
//这里我补上的原有逻辑的注释说明
//如果toc的配置不是true,或者不是page和post布局,就不处理
if (get_config('toc') !== true || (layout !== 'page' && layout !== 'post')) {
return null;
}
return Object.assign(locals, { content });
}

现在修改为下面的:

1
2
3
4
5
6
7
8
9
10
module.exports = (ctx, locals) => {
const { layout, content } = ctx.page;
const { get_config } = ctx;
//调整后的逻辑,默认开启配置
var tocConfig = get_config('toc');
if (tocConfig === false || (layout !== 'page' && layout !== 'post')) {
return null;
}
return Object.assign(locals, { content });
}

以本文的测试为例,本文的头部配置是:

1
2
3
4
5
6
---
title: 默认开启hexo-icarus主题的目录功能
abbrlink: d61f8acb
date: 2020-04-07 10:38:31
tags:
---

现在本地测试效果如下,显示了目录

现在加上“toc: false”在试一下

1
2
3
4
5
6
7
---
title: 默认开启hexo-icarus主题的目录功能
abbrlink: d61f8acb
date: 2020-04-07 10:38:31
toc: false
tags:
---

再次预览会发现,目录已经不显示了。

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×