给博客添加 swiftype 站内搜索
前言
站内搜索顾名思义就是将范围限定在你的网站内,以此范围进行关键字搜索。
正文
- 到
swiftype
官网进行注册 swiftype注册 - 登陆
swiftype
后,点击CREATE SEARCH ENGINE
,之后填入自己的网址等等几个操作。 - 进入
install
页面,左边有4个大的选项,分别为:外观、安装代码、搜索框、起动。 - 在
appearance
一项,建议使用默认,一直NEXT
,最后SAVA&PREVIEW
- 进入安装代码
install code
一项,将生成的代码复制一份,后面用到 - 进入最后一项
activate
,找到右下角的ACTIVATE SWIFTYPE
按钮,点击即可,此时你已经完成了swiftype
网站上的所有配置。 打开
hexo\themes\jacman\_config.yml
文件,在末尾添加1
2swiftype: ## https://swiftype.com/
enable: true先打开
hexo\themes\jacman\layout\_partial\header.ejs
文件,然后在这段代码中间1
2
3
4
5
6
7
8
9
10
11
12<% } else if(theme.tinysou_search.enable){ %>
<form class="search">
<label>Search</label>
<input type="text" id="ts-search-input" name="q" size="30" placeholder="<%= __('search') %>"><br>
</form>
<% } else { %>
<form class="search" action="//google.com/search" method="get" accept-charset="utf-8">
<label>Search</label>
<input type="search" id="search" name="q" autocomplete="off" maxlength="20" placeholder="<%= __('search') %>" />
<input type="hidden" name="q" value="site:<%- config.url.replace(/^https?:\/\//, '') %>">
</form>
<% } %>加入如下代码
1
2
3
4
5<% } else if(theme.swiftype&&theme.swiftype.enable){ %>
<form class="search">
<label>Search</label>
<input type="text" id="search" class="st-default-search-input" maxlength="20" placeholder="<%= __('search') %>" />
</form>最后打开
hexo\themes\jacman\layout\_partial\footer.ejs
,在最后一个标签之前添加一开始拷贝的那段js
代码,我的是:1
2
3
4
5
6
7
8<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/v2/st.js','_st');
_st('install','xPCQc1ATWL1kZyN4MRh-','2.0.0');
</script>