zoukankan      html  css  js  c++  java
  • hexo干货系列:(五)hexo添加站内搜索

    前言

    本来想用百度站内搜索,但是没成功,所以改用swiftype,用起来还是很棒的,这里分享一下我的安装步骤

    正文

    注册

    去swiftype官网注册个账号,然后登陆,对了不要去在意30天试用,30天过了还能继续使用,网站给的是30天高级账户的使用(那种有可以建立多个搜索引擎、多账户共同管理、一个引擎index多个域名的功能的账户),降级成为免费的账户类型,但是还能使用。

    Create an engine

    登陆后选择开始开干,步骤大概如下

    1. 点击Create an engine
    2. 给你的网站建立一个索引
    3. 输入你的网址
    4. 起个名字



    3

    上面配置好后开始抓取你网站的数据,大概等了几分钟后,查看Manage下面的Content,就能看到抓取的一些目录和tag数据过来,如果你不想要的话可以手动删除。

    接下来就是重头戏,如何安装插件,首先点击左下方的install Search,就会弹出插件的代码,先复制一下。这个就是一会要用到的插件代码。

    说明一下,swiftype提供两种方式,一种是弹出的方式,一种是新开一个页面的方式。前者默认就行,后者还要配置另外一推东西。我之前也按照网上别人帖子参考的写,结果一直不行。干脆不用了,用默认简单方便。

    hexo的Pacman主题配置

    接下来都是hexo这边配置,首先打开pacman主题下的_config.yml文件在末尾添加如下代码

    swift_search:
    enable:  true
    

    然后再切换的到 hemesjacmanlayout_partial目录下,最后需要做的收尾工作全部都在这个目录下。
    先打开header.ejs,找到

    <%  }  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


    更多教程可以来我嘟嘟独立博客里面看到

    欢迎来访:嘟嘟独立博客


    最近撸了个java的公众号,学习资源超级多,视频,电子书,最新开发工具一个都不能少,已全部分享到百度云盘,求资源共享,打造一个学习方便,工作方便的java公众号,开源开源,有需求的可以关注~撒花

  • 相关阅读:
    eclipse maven Errors while generating javadoc on java8
    log4j升级到logback
    httpclient新旧版本分割点4.3
    javadoc中{@link}与@see的简单使用以及区别
    maven-shade-plugin插件
    jar中META-INF
    dubbo环境搭建与tomcat集成、DEMO示例、常见问题(最完整版本、带管理控制台、监控中心、zookeeper)
    叶亚明:合格CTO的六要素(转)
    rocketmq安装与基本操作
    当我们在谈论技术时,技术的本质和价值究竟是什么?
  • 原文地址:https://www.cnblogs.com/tengj/p/5353897.html
Copyright © 2011-2022 走看看