很多个人站长分享技术文章的时候都是在自己搭建的博客上,但是也有一部分人不喜欢维护服务器或者不想花费这个钱去买服务器,所以就选择了在git上写博客,hexo因为简单方便被很多博主所选择,同时就出现了一个问题,要么不想自己去写一个自己想要的主题模板,要么就是选择了一个喜欢的主题模板,但是对于提供的功能总有那么一点不满意,这篇文章呢,我就介绍一个博文本地搜索的插件使用。
hexo-search-plugin
这个插件是针对那些主题没有集成搜索功能的,我们喜欢这些主题但是又想用搜索功能,除了那些百度站内搜索以外,我们还可以本地搜索,使用hexo-generator-search插件生成搜索文档,然后自己写ccs、js来进行本地搜索。
插件效果图:
1.png
配置教程
- 下载一个自己喜欢的主题
- 安装hexo-generator-search插件
- 配置项目的_config.yml在最后添加如下(详细配置可以去npm商店或者git仓库看文档)
search:
path: search.xml
field: post
content: true
- 切换到自己喜欢的主题
- 把search.js和load.js放到主题下的source文件夹下的js目录下
- 然后找个公共文件,引入这俩个js(如果不会找公共的文件,可以随便搜索一个js目录下有的js文件,根据文件名字判断哪个是公共的,一般符合开发规范的都是在footer.ejs中引入)
- 把search.styl放到主题下的source文件夹下的css目录下
- 然后在style.styl中引入
- 把search.ejs放到layout中
- 然后在一个公共文件引入,可以和上面引入js的是同一个页面
- 配置主题下的_config.yml
local_search:
enable: true #搜索开关
location: "right: 50px;top: 30px;" #搜索框位置top/left/bottom/right
facade: "" #搜索框样式
有疑问可联系QQ305530751
梦中程序员系列教程