hexo乾貨系列:(五)hexo添加站內搜索

前言


原本想用百度站內搜索,可是沒成功,因此改用swiftype,用起來仍是很棒的,這裏分享一下個人安裝步驟javascript

正文


註冊


去swiftype官網註冊個帳號,而後登錄,對了不要去在乎30天試用,30天過了還能繼續使用,網站給的是30天高級帳戶的使用(那種有能夠創建多個搜索引擎、多帳戶共同管理、一個引擎index多個域名的功能的帳戶),降級成爲免費的帳戶類型,可是還能使用。html

Create an engine

登錄後選擇開始開幹,步驟大概以下java

  1. 點擊Create an engine
  2. 給你的網站創建一個索引
  3. 輸入你的網址
  4. 起個名字

3

上面配置好後開始抓取你網站的數據,大概等了幾分鐘後,查看Manage下面的Content,就能看到抓取的一些目錄和tag數據過來,若是你不想要的話能夠手動刪除。
swift

install Search


接下來就是重頭戲,如何安裝插件,首先點擊左下方的install Search,就會彈出插件的代碼,先複製一下。這個就是一會要用到的插件代碼。bash

說明一下,swiftype提供兩種方式,一種是彈出的方式,一種是新開一個頁面的方式。前者默認就行,後者還要配置另一推東西。我以前也按照網上別人帖子參考的寫,結果一直不行。乾脆不用了,用默認簡單方便。hexo

hexo的Pacman主題配置


接下來都是hexo這邊配置,首先打開pacman主題下的_config.yml文件在末尾添加以下代碼async

swift_search:
enable:  true

而後再切換的到\themes\jacman\layout_partial目錄下,最後須要作的收尾工做所有都在這個目錄下。
先打開header.ejs,找到post

<%  }  else  if(theme.baidu_search.enable){ %>
    <form class="search" action="<%- theme.baidu_search.site %>" target="_blank">
<label>Search</label>
    <input name="s" type="hidden" value= <%= theme.baidu_search.id %> ><input type="text" name="q" size="30" placeholder="<%= __('search') %>"><br>
</form>

直接替換成網站

<% } else if(theme.swift_search.enable){ %>
	<form class="search" action="<%- config.root %>search/index.html" method="get" accept-charset="utf-8">
	<label>Search</label>
	<input type="text" id="search" class="st-default-search-input" maxlength="20" placeholder="Search" />
	</form>

反正我也不會用baidu_search,因此直接替換無所謂,你要是還想保留,就直接添加else判斷吧。 最後打開footer.ejs(其實header也行,隨便你),在最後一個div標籤以前添加一開始拷貝的那段js代碼,個人是:搜索引擎

<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','Ts_hz24x26ZaNWfhsYwW','2.0.0');
</script>

大功告成,來看看什麼效果吧,本身發佈後打開博客,查詢一個博客文章中出現的內容,效果以下:

上面查詢的列表實際上是以前在swiftype那邊解析的文章列表,若是Content那邊沒有東西。那你這邊查詢不會有用的。

總結


好了,站內搜索搞定了,要不要使用大家本身決定。但願這篇文章對你有幫助~下篇計劃寫個網站統計插件的教程,我用的CNZZ。寫完這篇已經凌晨1點了,明天還要上班,洗洗睡。

參考


利用swiftype爲hexo添加站內搜索v2.0

我是嘟嘟MD,我爲這篇文章代言。

歡迎轉載,但但願您能註明出處,畢竟沒啥人氣囧


最後,厚顏無恥的求打賞..若是您認爲博主的教程幫助到了你~ 你懂的o(^▽^)o (/▽\=)  

相關文章
相關標籤/搜索