站内搜索配置

设置方法:
首先安装hexo-generator-searchdb插件

npm install hexo-generator-searchdb --save

编辑博客根目录下的博客本地目录/_config.yml站点配置文件,新增以下内容到任意位置,search顶格放否则可能没效果:

search:
path: search.xml
field: post
format: html
limit: 10000

编辑博客本地目录/themes/next/_config.yml 主题配置文件,启用本地搜索功能,将local_search:下面的enable:的值,改成truelocal_search顶格放置。

local_search:
enable: true
# if auto, trigger search by changing input
# if manual, trigger search by pressing enter key or search button
trigger: auto
# show top n results per article, show all results by setting to -1
top_n_per_article: 1
# unescape html strings to the readable one
unescape: false

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ZRUfVNJD-1617112883771)(https://img-blog.nos-eastchina1.126.net/blog/hexo_search_config2.png)]

可以输入以下命令,先清理缓存,然后本地部署调试

hexo clean
hexo s

命令输入完成,提示:Hexo is running at http://localhost:4000/,可以把网址复制到浏览器上,查看本地生成的博客搜索功能


搜索无效、一直loading的问题

根据以上配置出的搜索框有可能出现无法加载,搜索无效,动画一直loading的问题,如下图:

按F12可以查看请求命令的状态,状态码200表示请求成功。但是搜索动画还是一直在转。


解决方案

为了解决以上问题,也是花了很多时间在寻找办法,找个几个办法,终于解决了我的问题。

国光的博客地址

Linchao的博客地址

现给出比较详细的解决方法,如果搜索不成功,可能是以下原因之一

1、搜索插件没有配置好

配置就按照文章前面配置的步骤走就行了

2、文章中包含特殊字符,文件编码时出错

一般情况下,博客部署到网上想要进行本地调试,输入以下命令

hexo clean
hexo s

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-jCkhxlbL-1617112883779)(https://img-blog.nos-eastchina1.126.net/blog/hhexo_search_local1.png)]

报错先不用管,命令输入完成,提示:Hexo is running at http://localhost:4000/。可以把网址复制到浏览器上,查看本地生成的博客,体验跟网站版的差不多,不出所料搜索框的动画还是会一直loading。

现在就要检查search.xml 文件,复制以下网址到浏览器,查看search.xml文件内容,是否报错。

localhost:4000/search.xml

效果图如下:

可以看到,有报错,报错内容就是说search.xml 文件有一些不能读取的内容,因为xml文件是有特殊符号不能使用。如果报错,浏览器右侧滑条拉到底,看看是哪里的文章出现问题。

效果图如下:

从最后的文字中找到一些信息,打开博客根目录下的search.xml文件

打开search.xml文件,找到包含那一些信息的那篇文章,最好是能开MarkDown在线编辑,也可以把有问题的.md文件拿出来,重新部署博客。

修改完成后,照平时那样部署博客就行。如果还有错,继续排查。

我的个人博客主页,欢迎访问

我的CSDN主页,欢迎访问

我的GitHub主页,欢迎访问

Hexo博客Next主题站内搜索模块相关,解决搜索无效、一直loading的问题的更多相关文章

  1. hexo博客yili主题个性化自定义教程(1) ——借鉴中学习,初认yili主题

    文章转载于:hexo博客yili主题个性化自定义教程(1) --借鉴中学习,初认yili主题 这个博客跌跌撞撞也弄了好多天了,由于Next主题不知道什么情况,被我玩坏了.所以换了一个主题. 大名鼎鼎的 ...

  2. Hexo博客maupassant主题添加Google Adsense广告

    自从在 Github Page 落户以后,很长一段时间使用的是极简且有点艺术范儿的 fexo 主题,而不是大名鼎鼎的 next 主题.后来偶然发现了符合我审美的Hexo博客 maupassant 主题 ...

  3. 关于Hexo博客NEXT主题(Gmini)站点图标不显示,显示错误的解决办法

    关于Hexo博客NEXT主题(Gmini)站点图标不显示,显示错误的解决办法   最近闲着没事自己利用Hexo和Github搭了个博客,但是在NEXT(Gmini)主题优化时,出了很多错误,图标不显示 ...

  4. hexo博客更换主题

    前边我们已经学会了博客的搭建了,这次我们来看看怎么样让我们的博客更漂亮,更个性化.那就是来更换博客的主题,让我们的博客与众不同起来.我们可以去hexo的主题官网去挑选你自己喜欢的主题风格.里边收录了很 ...

  5. hexo博客yilia主题深度设置

    转载:Shuyan http://dongshuyan.com/2019/05/24/hexo博客注意事项/ 1.微信分享异常 这里是themes\yilia\layout\ _partial\pos ...

  6. hexo博客pure主题解决不蒜子计数不显示的问题

    最近在建个人博客网站,想统计自己的博客页面访问量,就用到了不蒜子页面访问统计.可是遇到了糟心事,居然不显示!!! 不蒜子官网示例:两行代码,搞定计数 <script async src=&quo ...

  7. Hexo博客skapp主题部署填坑指南

    相信大家都很喜欢 hexo skapp 的主题,由于作者采用结巴分词,加上需要依赖各种各样的环境 所以可能大家踩过很多坑,也许每个人踩得坑不一样,这里使用 Docker 容器 centos 来部署, ...

  8. Hexo博客NexT主题美化之评论系统

    前言 更多效果展示,请访问我的博客 https://kangmingxian.github.io/ 效果图:   image Valine 诞生于2017年8月7日,是一款基于Leancloud的快速 ...

  9. Hexo博客yilia主题添加Gitment评论系统

    一开始搭建hexo+yilia博客使用的评论功能是通过来必力实现的.来必力免费,功能多,一开始的体验效果很好,但是后来打开网站发现来必力加载的越来越慢(来必力是韩国的公司,可能是国内限制),遂打算换一 ...

  10. hexo博客更新主题后上传Git操作

    克隆主题: git clone https://github.com/SuperKieran/TKL.git _config.yml文件中主题改为新增主题 # Extensions ## Plugin ...

随机推荐

  1. 用 Gaussian Process 建模 state-action 空间相关性,加速 Multi-Fidelity RL

    目录 全文快读 1 intro 3 背景 4 method 4.1 model-based 算法:GP-VI-MFRL 4.2 model-free 算法:GPQ-MFRL 5 experiment ...

  2. Nacos注册中心

    介绍 Nacos是SpringCloudAlibaba的组件,而SpringCloudAlibaba也遵循SpringCloud中定义的服务注册.服务发现规范.因此使用Nacos和使用Eureka对于 ...

  3. VUE3企业级项目基础框架搭建流程(3)

    VUE-Router npm install vue-router@4 安装完成后,在项目目录里新建一个router文件,我这里的用的是typeScript,所以建立的是router.ts, 该文件是 ...

  4. Docker的实际应用

    一. 数据持久化 我们什么情况下要做数据持久化呢? 一定是在做容器之前先预判好哪些文件是要永久存储的, 而不会跟着它容器的一个生命周期而消失. 比如说配置文件. 日志文件. 缓存文件或者应用数据等等. ...

  5. 高阶组件——withRouter的原理和用法

    作用: 高阶组件中的withRouter, 作用是将一个组件包裹进Route里面, 然后react-router的三个对象history, location, match就会被放进这个组件的props ...

  6. Centos7.x 更换Jenkins构建目录

    原由:最近因为原来的Jenkins构建目录,已经要满了,想着更换下构建目录,此篇文件简单介绍下更换过程. 注:此文章可能仅适用于我个人,仅供参考.如有其他办法,欢迎评论指教. 查了几种方法,最终选为使 ...

  7. 2021-01-06:mysql中,我存十亿个手机号码,考虑存储空间和查询效率,用什么类型的字段去存?

    福哥答案2021-01-06: [答案来自此链接:](https://www.zhihu.com/question/438078173)首先提出假设:考虑一下这几个问题:手机号码都是数字吗?都是中国的 ...

  8. IBM小型机 - 检测码:B150B10C,设备卡住不运行

    检测码:B150B10C 问题 开机后,出现检测码:B150B10C,然后就卡在这里不动,无法进行下一步: 这里的错误码表示--机器的内存控制模块被deconfig(取消配置): 解决方法 登录cel ...

  9. VB.NET 截取字符串

    在VB.NET中,您可以使用Substring方法或Split方法来截取字符串. Substring方法允许您从字符串中提取一个子字符串,该子字符串从指定的起始索引开始,并继续到字符串的末尾或指定的长 ...

  10. uni-app介绍

    "优你"框架 uni-app 是一个使用 Vue.js 开发所有前端应用的框架,开发者编写一套代码,可发布到iOS.Android.Web(响应式).以及各种小程序(微信/支付宝/ ...