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.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 {