hexo[Matery] 添加自定义404页面
虽然 Hexo-Matery 主题自带有一个 404 页面,但是不得不说这个页面真的不是很好看,而且在渲染的时候使用的和主题是几乎一模一样的样式,显得很单调而且没有新意。所以,自己研究了一下怎么添加一个自定义的 404 页面。
一、编写 404 页面
因为是自定义的 404 页面,大家可以发挥自己的创造力或者借鉴大佬的作品(我就不重复造轮子了,我挑了个自己喜欢的模板,嘿嘿~)。
- 首先,在根目录的
source
文件夹下新建一个404.html
文件(当然你也可以hexo new page 404
,但是本篇将不会针对此操作进行讲解,可以自行研究 <因为那样无法本地预览> )。 - 然后把准备好的代码复制进刚刚新建的
404.html
文件,保存即可。
后面会给大家几个比较好看的 404 页面,大家可以直接拿去用哦~
详情请见补充!
二、排除 404 页面的渲染
排除 404 页面的渲染有两种方法:
2.1 全局配置
这个比较适合排除大量文件的渲染,一般用于文件较多的时候。但是啊,我是一个有一丢丢强迫症的孩子啊,所我果断选择把所有的需要排除渲染的文件都在全局配置里声明,哪怕目前只有一个这样的文件。
- 打开根目录下的
_config.yml
文件,找到skip_render:
配置项(大概在30行左右)。 - 然后加上
[404.html]
即可(可使用正则表达式)。
注意:Hexo 会渲染所有在 source
文件夹里的文件,在根目录下的 _config.yml
文件里的 skip_render
配置项可指定跳过渲染的文件。并且,该配置项支持正则表达式。详情见以下代码。
1 | skip_render: [ |
还有一点也非常重要:如果你选择用全局配置来忽略某些文件的渲染的话,请务必在本地预览前执行 hexo cl && hexo g
重新生成静态文件,以保证你的修改生效。
2.2 单页面配置
- 打开编写好的
404.html
文件。 - 在顶行添加代码
layout: false
即可:
1 | layout: false |
三、部署
最后,一键三连即可(hexo cl && hexo g && hexo d
)。
前面提过,如果是新建 404.html
文件的话,是可以进行本地预览的。但是这个预览不能使用 http://localhost:4000/任意字符
来查看,必须使用 http://localhost:4000/404
来进行本地预览。
四、404 页面模板
预览如下:
本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 SeaEpoch!
评论