为Hexo博客添加全文搜索

2017-06-15Frontend

本文介绍如何利用hexo-generator-search插件为 Hexo 博客添加本地全文搜索

原理

hexo-generator-search实际上是根据网页内容生成了一个数据文件,格式是XML或者JSON。然后通过 JS 代码去匹配这个文件的内容,从而达到搜索的目的。

最终效果

最终效果
最终效果
查看全文...

自定义Hexo主题

2017-06-15Frontend
Hexo
Hexo

刚刚完成了Hexo博客主题的自定义,现在总结如下,让我们一起来看看如何打造一款属于自己的Hexo主题。

如何创建一个新主题以及如何切换主题在官网的doc中有说明,这里我们只讨论如何打造一个新的属于自己的模版。

方法

Hexo使用了模版进行渲染的方式来实现网页风格的自定义。其核心是一种嵌套、引用的风格实现对网页内容模块化管理。所以我也采取从外向里,抽丝剥茧,剥洋葱式的一层层展开来看其中的原理及如何去自定义。此文需要基本的HTML知识。

查看全文...

为HTML中的代码添加语法高亮

2017-06-14Frontend
highlight.js
highlight.js

Hexo 默认对于代码高亮的处理过于粗暴,改变了其原有的<pre><code>标签形式,而且并没有达到良好的效果,所以尝试自己添加语法高亮功能。此文档也适用于其它HTML文档中代码的语法高亮显示。

我这里使用highlight.js进行添加语法高亮

查看全文...