kk Blog —— 通用基础

date [-d @int|str] [+%s|"+%F %T"]

octopress 加站长统计和站内搜索

站长统计

国内使用很广的CNZZ了,注册后,添加并验证你的网站就可以添加统计代码了,选好自己喜欢的样式,获得代码,可添加到source/_includes/custom/footer.html中。即可查看每天你的博客的流量

1
<script type="text/javascript">var cnzz_protocol = (("https:" == document.location.protocol) ? " https://" : " http://");document.write(unescape("%3Cspan id='cnzz_stat_icon_1253604690'%3E%3C/span%3E%3Cscript src='" + cnzz_protocol + "s95.cnzz.com/z_stat.php%3Fid%3D1253604690' type='text/javascript'%3E%3C/script%3E"));</script>

站内搜索

tapirgo 停止服务了, 换成 https://www.sitesearch360.com

修改:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
diff --git a/sass/partials/_navigation.scss b/sass/partials/_navigation.scss
index d9614e3c5..4f57afaa1 100644
--- a/sass/partials/_navigation.scss
+++ b/sass/partials/_navigation.scss
@@ -59,6 +59,8 @@ cursor: pointer;
     ul.subscription {
       margin-left: .8em;
       float: right;
+      width: 100px;
+      margin-right: -47%;
       li:last-child a { padding-right: 0; }
     }
     ul li {
@@ -102,7 +104,8 @@ cursor: pointer;
   }
   @media only screen and (min-width: 992px) {
     form {
-      width: $sidebar-width-wide - $pad-wide - $sidebar-pad-wide*2 + 10px;
+      width: $sidebar-width-wide - $pad-wide - $sidebar-pad-wide*2 + 210px;
+      margin-right: 50px;
     }
     ul[data-subscription$=email] + form {
       width: $sidebar-width-wide - $pad-wide - $sidebar-pad-wide*2 - 58px;
@@ -116,7 +119,7 @@ cursor: pointer;
   }
 }
 @mixin mask-subscription-nav($feed: 'rss.png'){
-  position: relative; top: 3px;
+  position: relative; top: 6px;
   text-indent: -999999em;
   background-color: $nav-border-right;
   border: 0;
diff --git a/source/_includes/navigation.html b/source/_includes/navigation.html
index cdec89642..5c226aab4 100644
--- a/source/_includes/navigation.html
+++ b/source/_includes/navigation.html
@@ -1,5 +1,3 @@
-<ul class="subscription" data-subscription="rss">
-<li>
 <form action="/search" method="get">
     <input class="search" name="query" id="query" type="text" placeholder="search...">
     <input id="btnSubmit" value="search" type="submit">
@@ -10,6 +8,22 @@ if (query != null) {
  document.getElementById("query").value = query;
 }
 </script>
+
+<!-- Start of Site Search 360 Scripts -->
+<script type="text/javascript">
+var ss360Config = {
+    siteId: "abcdxyzk.github.io",
+    searchBox: {
+        selector: "input#query",
+        searchButton: "input#query+input[type='submit']"
+    }
+}
+</script>
+<script src="https://cdn.sitesearch360.com/v13/sitesearch360-v13.min.js" async></script>
+<!-- End of Site Search 360 Scripts -->
+
+<ul class="subscription" data-subscription="rss">
+<li>
 </li>
   <li><a href="/atom.xml" rel="subscribe-rss">RSS</a></li>

为了实现站内搜索(页面不跳转),

需要到tapirgo.com注册你的站点,填入atom.xml的url和邮箱地址,tapirgo会生成一对token,我们只使用public token就够了。
打开_config.yml文件,加入tapir_token: your_token
修改simple_search为你的站点域名simple_search: your_domain
在source/javascripts/新建jquery-tapir.js,内容为
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
(function($){
  var el;
  var settings = {};

  var methods = {
    init: function(options) {
      el = this;

      settings = {
	           token: false,
	           query_param: 'query'
	         };

      if (options) {
	$.extend(settings, options);
      }

      if (!settings.token || settings.query_param == '') {
	return this;
      }

      $.getJSON(
	'http://tapirgo.com/api/1/search.json?token=' + settings.token + '&query=' + paramValue(settings.query_param) + '&callback=?', function(data){
	  if(settings['complete']) { settings.complete() }
	  $.each(data, function(key, val) {
	  document.getElementById('search_results').style.display="block";
	  document.getElementById('search_results').style.height="100%";
	  document.getElementById('search_results').style.overflow="hidden";
	      var str1 = val.content;
	      var str2 = str1.substr(1, 250);
	      str2 = str2.substr(0, Math.min(str2.length, str2.lastIndexOf(" ")));
	    el.append('<div id="content" class="inner"><article class="post"><h2 class="title"><a href="' + val.link + '">' + val.title + '</a></h2><div class="entry-content"><div class="date">Published on: ' + (val.published_on).substr(0,10) + '</div></div><br><p>' + str2 + '...</p><br><a href="' + val.link +'">Read on →</a></article></div>');
	    if(key >= (data.length-1)){
	        el.append('<div id="content" class="inner"><center><h2 style="border-bottom: 1px solid #ddd;">Result ends</h2></center><br><br></div>');
	    }
	  });
	}
      );

      return this;
    }
  };

  // Extract the param value from the URL.
  function paramValue(query_param) {
    var results = new RegExp('[\\?&]' + query_param + '=([^&#]*)').exec(window.location.href);
    return results ? results[1] : false;
  }

  $.fn.tapir = function(method) {
    if (methods[method]) {
      return methods[ method ].apply(this, Array.prototype.slice.call(arguments, 1));
    } else if (typeof method === 'object' || ! method) {
      return methods.init.apply(this, arguments);
    } else {
      $.error('Method ' +  method + ' does not exist on jQuery.tapir');
    }
  };

})( jQuery );
然后在source/search/index.html中
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
---
layout: default
---
<h1 class="entry-title"><center>Search Results</center></h1>
<div id="search_loading" style="margin: 40px 0">
    <center><img src="/images/loading.gif"></center>
</div>

<script type="text/javascript" src="/javascripts/jquery-tapir.js"></script>
<div id="search_results" style="display:none">
<br>
</div>
<script>
	 $('#search_results').tapir({
	     'token': 'your_token',
	     'complete' : function() { document.getElementById('search_loading').style.display="none"; }
	 });
</script>
更新source/_includes/navigation.html

将原来的google搜索

1
2
<input type="hidden" name="q" value="site:smarterhjw.com" />
<input class="search" type="text" name="q" results="0" placeholder="Search"/>

更改为

1
<input class="search" name="query" type="text" placeholder="Search..." x-webkit-speech />

最后rake generate,就可以了。 此时进行搜索,就不会再跳转到站外去了。

可以修改一下搜索框展示
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
--- a/sass/partials/_navigation.scss
+++ b/sass/partials/_navigation.scss
@@ -74,6 +74,7 @@ body > nav {
       float: right;
       text-align: left;
       padding-left: .8em;
+      padding-top: .35em;
       width: $sidebar-width-medium - $pad-medium*2 - $sidebar-pad-medium + 20px;
       .search {
	 width: 93%;
@@ -86,7 +87,7 @@ body > nav {
       .search { width: 91%; }
     }
     fieldset.mobile-nav { display: none; }
-    fieldset[role=search]{ width: 99%; }
+    fieldset[role=search]{ width: 80%; }
   }
   @media only screen and (min-width: 992px) {
     form {