如何在个人博客引擎 Hexo 中添加 Swiftype 搜索组件

简介: 在您现在看到的我的博客站点,后台使用的是 Hexo 作为博客引擎,但是默认集成的搜索组件是进行 form 提交到 Google 进行搜索的,为了更好地体验,本文介绍如何在 Hexo 博客中集成 Swiftype 搜索组件。

在您现在看到的我的博客站点,后台使用的是 Hexo 作为博客引擎,但是默认集成的搜索组件是进行 form 提交到 Google 进行搜索的,为了更好地体验,本文介绍如何在 Hexo 博客中集成 Swiftype 搜索组件。
更好的阅读体验在我的博客原文地址:http://blog.parryqiu.com/2016/02/03/how_to_add_swiftype_search_to_hexo/

1. 关于搜索组件

站点中集成搜索组件,可以很大地方便用户进行快速查找博客内容,但是 Hexo 处理搜索默认的逻辑是:输入关键字后模拟 form 提交到 Google 进行搜索的。但是在「某些」开放的国家,Google 是不可以访问的。你可能想到可以模拟提交到贵国「高端搜索引擎」百度进行搜索啊,恩,我想了想,我还是告诉你如何接入更加方便的 Swiftype 比较好。
其实接入 Google 等搜索引擎,也是在 Google 收录了你站点的内容后才能搜索到的,用的其实就是 site: 语法搜索。

2. 效果预览

本站 接入 Swiftype 搜索组件后的效果如图所示。

截图

3. Swiftype 搜索组件介绍

Swiftype 搜索组件的原理就是你提交站点给它,它立即对内容进行索引抓取,之后提供给你类似 JS SDK 一样的东西给你使用即可,设计的非常灵活、方便。

截图

4. Hexo 接入步骤

4.1 注册账号

注册页面 注册一个账号。

4.2 添加站点

添加站点的 URL 或者站点的 SiteMap 给 Swiftype 以便它进行抓取,SiteMap 可以提交多个,如我站点的 SiteMap ,我都拆分进行了提交。
关于 Hexo 博客引擎如何生成站点的 SiteMap,请参见 hexo-generator-sitemap 插件或 hexo-generator-seo-friendly-sitemap 插件。

4.3 站点接入

Hexo 的接入非常方便,按照如下代码修改搜索模块即可。

<div class="search">
<input type="search" class="st-default-search-input" placeholder="<%= __('search') %>">
</div>
AI 代码解读

然后在页脚引入对应的 JS 代码即可,国内网络加载没有问题。

4.4 其他可配置项

可以通过 Swiftype 的控制面板修改如搜索结果、智能提示样式等,可定制化的地方很多;
Swiftype 还可以手动干预搜索结果以及对搜索结果进行强制分组等。
Swiftype 的控制面板中也提供了供您分析用户搜索的分析报表。

5. 结语

Swiftype 有一个试用期,到期后只会限制一些高级功能的使用,不影响搜索组件的试用。
总之,这应该是 Hexo 博客引擎一个比较优雅的搜索组件解决方案。


作者:Parry
出处:http://www.cnblogs.com/parry/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。

目录
打赏
0
0
0
0
1
分享
相关文章
百度搜索:蓝易云【ubuntu系统部署dzzoffice及安装onlyoffice插件教程。】
请注意,本教程提供了基本的部署和安装步骤,并且可以根据实际需求进行定制和扩展。如果需要更深入的了解和配置,请参考DzzOffice和OnlyOffice的官方文档或其他权威资源。
706 3
百度搜索:蓝易云【蓝易云搭建RUOYI系统教程。】
至此,你已成功搭建RUOYI系统。你可以根据需要进行进一步的定制和配置,添加自定义模块和功能。请注意,以上仅为简要搭建教程,具体的配置和定制过程可能因实际需求而有所不同,建议参考RUOYI系统的官方文档和指南进行更详细的配置和使用说明。
174 0
百度搜索:蓝易云【Redash可视化BI系统部署安装及简单使用】
通过以上步骤,你将成功部署和安装Redash,并可以开始使用它进行数据可视化和BI分析。请注意,上述步骤只是一个简单的示例,实际的部署和配置可能需要更多的步骤和注意事项。你可以参考Redash官方文档以获取更详细的信息和最佳实践。
393 0
插件开发最佳实践:以必应(Bing)搜索插件开发为例
插件是Botnow中增强Bot功能的关键工具,可通过添加各类插件如新闻阅读、效率工具等,扩展Bot的知识与技能。本文以开发“必应搜索”插件为例,详细介绍从登录控制台开始,经过创建插件、定义接口、设置认证信息直至在Bot中实际运用插件的全过程。遵循最佳实践,开发者能构建高质量插件,显著提升Bot的服务能力。
165 0
百度搜索:蓝易云【LNMP网站框架搭建(编译安装)】
现在,你已经成功搭建了LNMP网站框架。你可以将你的网站文件放置在指定的网站根目录中,并访问你的域名或IP地址来查看网站。记得根据你的实际需求进行进一步的配置和安全性调整。
274 4
【 uniapp - 黑马优购 | 搜索框 】如何实现自定义搜索组件、搜索建议、搜索历史
【 uniapp - 黑马优购 | 搜索框 】如何实现自定义搜索组件、搜索建议、搜索历史
742 0
百度搜索:蓝易云【laravel最常见的问题】
这些是在Laravel开发中常见的一些问题,解决它们需要一定的经验和技巧。如果遇到问题,可以通过查阅Laravel文档、搜索相关论坛或社区中的解决方案,或向其他开发者寻求帮助来解决问题。
84 1
百度搜索:蓝易云【【k8s系列】搭建MicroK8s Dashboard教程。】
完成以上步骤后,你就成功搭建了MicroK8s Dashboard,并可以通过Web界面管理和监控你的MicroK8s集群。请确保根据实际需求进行适当的安全配置和访问控制,以保护你的集群和数据安全。
145 2
百度搜索:蓝易云【Ubuntu系统搭建K8s集群教程】
现在,你已经在Ubuntu系统上成功搭建了一个Kubernetes集群。记得保留好Kubernetes配置文件以便后续管理。
91 0
百度搜索:蓝易云【Yocto环境搭建教程】
这是一个简单的Yocto环境搭建教程的概述。请注意,Yocto具有强大的自定义和配置选项,您可以根据特定的项目需求进行更深入的配置和扩展。建议在开始之前阅读Yocto文档以获取更详细的指导和了解。
98 0
AI助理

你好,我是AI助理

可以解答问题、推荐解决方案等