文章目录

开始使用Hexo以后就一直为站内搜索头疼,毕竟静态博客要自建搜索引擎就是吃饱了撑的,肯定需要用到第三方搜索引擎。

Google就不用想了,原因大家都懂。百度站内搜索一直没能成功实现,原因不明,也懒得找明,只有指定域的方法可行。

一早听说了Swfitype这枚神器,但是始终没腾出来时间研究。随便百度时无意找到了这篇文章(http://www.jerryfu.net/post/search-engine-for-hexo-with-swiftype.html),才好好研究了一下。

原文引导作用很好,就是有若干处错误,所以在下干脆就重新整理了(图均借用了原文)。

虽然本文是基于自己的主题Gacman(当然,也完全适用于JacmanPacman),但是其实各个主题都大同小异。先展示一下效果吧:我要搜索“装甲纵队”

首先前往Swiftype的官网https://swiftype.com注册一个账号,然后根据指引建立好自己网站对应的索引。

然后切换到install面板,如下图:

install 面板

进入安装面板后需要先配置一下自己的站点,按照下图的配置来操作:

站点配置

其中的网址注意把www.jerryfu.net部分替换成自己的网址。

然后点击配置界面左侧的“SWIFTYPE INSTALL CODE”来获取所需要的js代码,获取类似下边的代码:

1
2
3
4
5
6
7
<script type="text/javascript">
(function(w,d,t,u,n,s,e){w['SwiftypeObject']=n;w[n]=w[n]||function(){
(w[n].q=w[n].q||[]).push(arguments);};s=d.createElement(t);
e=d.getElementsByTagName(t)[0];s.async=1;s.src=u;e.parentNode.insertBefore(s,e);
})(window,document,'script','//s.swiftypecdn.com/install/v1/st.js','_st');
_st('install','your install code'); //每个网址的install code都不同
</script>

直接把这段代码拷贝到主题目录中layout_partial的footer.js或者header.js中,以保证每个页面都运行了Swiftype代码。可以考虑加上判断条件,比如下文的if(theme.swiftype.enable)

在主题下的_config.yml文件中添加如下代码(注意不要打断其它配置,可以考虑加在自定义搜索附近或干脆文件最后),增加一个swiftype的配置选项:

1
2
swiftype:
enable: true

然后到Hexo根目录中的source目录下建立一个search文件夹,再在其下建立一个index.md,index.md中写入如下代码:

1
2
3
layout: search
title: search
----

然后到主题目录中layout_partial目录下打开header.ejs,在搜索模块的各条件之间添加一个条件(这里的class样式是Gacman特定的,各个主题都应该用自己的):

1
2
3
4
5
6
7
<% } else if(theme.swiftype.enable){ %>
<form class="search" action="<%- config.root %>search/index.html" method="get" accept-charset="utf-8">
<label>Search</label>
<input type="text" id="st-search-input searchbox" class="text-input" placeholder="" />
<input type="submit" class="search-btn" value="SEARCH">
</form>
<% } else { %>

还是layout_partial目录,打开search.ejs,同样是为Swiftype增加一个条件:

1
2
3
4
5
<% } else if(theme.swiftype.enable) { %>
<div class="container">
<div id="st-results-container">正在加载搜索结果,请稍后...</div>
</div>
<% } %>

嗯,这样就完成了。hexo ghexo d,all done~


♦ 本文固定连接:https://www.gsgundam.com/archive/2015-03-03-swiftype-professional-search-tool/

♦ 转载请注明:GSGundam 2015年03月03日发布于 GSGUNDAM砍柴工

♦ 本文版权归作者,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文链接。

♦ 原创不易,如果页面上有适合你的广告,不妨点击一下看看,支持作者。(广告来源:Google Adsense)

♦ 本文总阅读量