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 {

markdown部分语法

贴自http://wowubuntu.com/markdown/index.html

段落和换行

一个 Markdown 段落是由一个或多个连续的文本行组成,它的前后要有一个以上的空行。普通段落不该用空格或制表符来缩进。
如果你确实想要依赖 Markdown 来插入 <br /> 标签的话,在插入处先按入两个以上的空格然后回车。

标题

Markdown 支持两种标题的语法,类 Setext 和类 atx 形式。
类 Setext 形式是用底线的形式,利用 = (最高阶标题)和 - (第二阶标题),例如:

1
2
3
4
This is an H1
=============
This is an H2
-------------

任何数量的 = 和 - 都可以有效果。
类 Atx 形式则是在行首插入 1 到 6 个 # ,对应到标题 1 到 6 阶,例如:

1
2
3
# 这是 H1
## 这是 H2
###### 这是 H6

你可以选择性地「闭合」类 atx 样式的标题,这纯粹只是美观用的,若是觉得这样看起来比较舒适,你就可以在行尾加上 #,而行尾的 # 数量也不用和开头一样(行首的井字符数量决定标题的阶数):

1
2
3
# 这是 H1 #
## 这是 H2 ##
### 这是 H3 ######

树状数组

大体上可以分为两种:

每次修改的是一个点,所求的是关于某段区间;
这种情况最好办;比如说poj2352 stars;求每个点前面比他小的点的个数;
只用设置数组a[],先全是0,然后有某个点就依次修改,并以此统计;
这一种是最基本的向上修改,向下统计;

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
int lowbit(int x) {
	return x&(-x);
}
void update(int x,int num) {
	while(x<=N) {
		 d[x]+=num;
		 x+=lowbit(x);
	 }
}
int getSum(int x) {
	int s=0;
	while(x>0) {
		 s+=d[x];
		 x-=lowbit(x);
	 }
	return s;
}

octopress分类中使用二级目录

1.修改plugins/category_list_tag.rb为

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
# encoding: UTF-8
module Jekyll
	class CategoryListTag < Liquid::Tag
		def render(context)
			html = ""
			pre = ""
			divout = 0
			categories = context.registers[:site].categories.keys
			categories.sort.each do |category|
				posts_in_category = context.registers[:site].categories[category].size
				category_dir = context.registers[:site].config['category_dir']
				cats = category.split(/~/)
				if cats.size > 1 and cats[0] == pre
					if divout == 0
						html << "<div id='#{pre}' class='divclass'>"
						divout = 1
					end
					html << "<li><a href='/#{category_dir}/#{category.to_url}/?opendiv=#{pre}'>#{cats[1]} (#{posts_in_category})</a></li>\n"
				else
					pre = cats[0]
					if divout > 0
						html << "</div>"
						divout = 0
					end
					html << "<li class='category'><a href='##' onmousedown=showDiv('#{pre}')>#{category} </a><a href='/#{category_dir}/#{category.to_url}/'>(#{posts_in_category})</a></li>\n"
				end
			end
			if divout > 0
				html << "</div>"
				divout = 0
			end
			html
		end
	end
end

Liquid::Template.register_tag('category_list', Jekyll::CategoryListTag)

octopress侧边栏添加内容

1.添加about页面

rake new_page[about]
会生成 source/about/index.markdown 文件。
编辑该文件的内容。
然后在头部导航菜单中添加页面的超链接。具体做法是编辑 /source/_includes/custom/navigation.html 文件。

2.增加链接

在source/_includes/custom/asides创建blog_link.html,代码如下:

1
2
3
4
5
6
7
8
<section>
<h1>link</h1>
<ul>
  <li>
      <a href=http://hi.baidu.com/abcdxyzk target=_blank>My</a>
  </li>
</ul>
</section>

然后修改_config.yml文件在default_asides中加入custom/asides/blog_link.html。