Post

第一篇博文

安装 Ruby 环境和 DevKit

首先到 rubyInstaller 官网下载,目前最新的版本分别是 Ruby 2.0.0-p451 和 DevKit-mingw64-32-4.7.2-20130224-1151-sfx.exe

双击打开 Ruby 进行安装,选择你所喜欢的安装位置进行安装,我选择的是 C:\Ruby200。

然后安装 DevKit ,将其解压到你所喜欢的位置,我选择的是 C:\Ruby200\devkit\ 。

DevKit 安装

1
2
3
cd C:\Ruby200\devkit\
ruby dk.rb init
ruby dk.rb install

更换 gem 的源

1
2
3
4
 gem sources -l
 gem sources --remove https://rubygems.org/
 gem sources -a https://ruby.taobao.org/
 gem update

完成之后安装 jekyll :

1
gem install jekyll

安装rdiscount,这个是用来解析Markdown标记的解析包。

1
gem install rdiscount

开始 Jekyll 旅程

1
2
3
4
5
6
7
8
git clone https://github.com/plusjade/jekyll-bootstrap.git USERNAME.github.io
cd USERNAME.github.io
rm .git -fr
git init
git remote add origin git@github.io:USERNAME/USERNAME.github.io.git
git add -A
git commit -m "first commit"
git push origin master

注意:不要 fork 别人的分支,这样会对主线开发者造成困扰, rm .git 文件夹是为了清除git记录。

开启 Jekyll

注意现在的命令是这样的,不要搞混了

1
jekyll server

然后在浏览器打开https://localhost:4000预览你的页面

我的一些修改

中文编码问题

修改文件 C:\Ruby200\lib\ruby\gems\2.0.0\gems\jekyll-2.0.2\lib\jekyll\convertible.rb 第46行

1
2
self.content = File.read(File.join(base, name),
		merged_file_read_opts(opts))

1
2
self.content = File.read(File.join(base, name), :encoding => "utf-8")
#		merged_file_read_opts(opts))

修改 _config.yml

由于运行时系统提示我

1
Deprecation: The 'pygments' configuration option has been renamed to 'highlighter', Please update your config file accordingly. The allowed values are 'rouge', 'pygments' or null

所以我修改了 _config.yml

1
pygments: true

1
highlighter: true

使用 hooligan 主题

1
2
rake theme:install git="https://github.com/dhulihan/hooligan.git"
rake theme:switch name="hooligan"

加入公式支持

修改 _includes/themes/hooligan/default.html 文件,在head里加入

1
2
3
4
5
6
7
<script type="text/javascript" src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
tex2jax: { inlineMath: [['$','$'], ['\\(','\\)']] }
});
</script>

使用方法和 LaTeX 中使用方法类似

注意,行间公式前后应该都留空行,使得公式能够居中显示。

另外,kramdown的latex语法行内和行间公式都是$$符号作为分隔符。虽然和一般的使用习惯不同,但是可以保证_, ^, \之类符号能够正确解析。

测试一下

1
2
3
4
5
$$ 
\begin{aligned} \dot{x} &= \sigma(y-x) \\\\
\dot{y} &= \rho x - y - xz \\\\
\dot{z} &= -\beta z + xy \end{aligned}
$$
\[\begin{aligned} \dot{x} &= \sigma(y-x) \\\\ \dot{y} &= \rho x - y - xz \\\\ \dot{z} &= -\beta z + xy \end{aligned}\]

多说的评论

同样看过一些博文对多说和友言的讨论,discus由于是国外的东西,国内支持不好(你懂的,其实我是想用discus的,唉),最后选择了多说

需要对 _config.yml 做修改

找到 comments : 这一行,注释其他的东西,添加如下

1
2
3
provider : duoshuo
	duoshuo :
	short_name : YOURNAME

参照博文

将 js 代码复制到 _includes/themes/hooligan/default.html <head>里。

1
2
3
4
5
6
7
8
9
10
11
<script type="text/javascript">
var duoshuoQuery = {short_name:""};
(function() {
	var ds = document.createElement('script');
	ds.type = 'text/javascript';ds.async = true;
	ds.src = (document.location.protocol == 'https:' ? 'https:' : 'https:') + '//static.duoshuo.com/embed.js';
	ds.charset = 'UTF-8';
	(document.getElementsByTagName('head')[0] 
	|| document.getElementsByTagName('body')[0]).appendChild(ds);
})();
</script>

修改 _includes/JB/comments , 在 case 里加入

class="highlight">{% when "duoshuo" %} {% include JB/comments-providers/duoshuo %}

在 _includes/JB/comments-providers/duoshuo 里加入

1
<div class="ds-thread" ></div>

在 _includes/themes/hooligan/default.html <head> 里加入

1
2
3
4
5
6
7
8
9
10
11
<script type="text/javascript">
var duoshuoQuery = {short_name:""};
(function() {
	var ds = document.createElement('script');
	ds.type = 'text/javascript';ds.async = true;
	ds.src = (document.location.protocol == 'https:' ? 'https:' : 'https:') + '//static.duoshuo.com/embed.js';
	ds.charset = 'UTF-8';
	(document.getElementsByTagName('head')[0] 
	|| document.getElementsByTagName('body')[0]).appendChild(ds);
})();
</script>

在 _includes/themes/hooligan/page.html <div class="row"> 里加入

1
2
3
4
5
6
7
8
9
10
<div class="span4">
<section>
<h3>Latest Comments</h3>
<ul class="ds-recent-comments" data-num-items="10" data-show-avatars="0" data-show-time="0" data-show-title="0" data-show-admin="0" data-excerpt-length="18"></ul>
</section>
<section>
<h3>Recently Visitors</h3>
<ul class="ds-recent-visitors" data-num-items="4" data-avatar-size="45" style="margin-top:10px;"></ul>
</section>
</div>

注:最后我觉得不好看,注释掉了,在需要的地方加吧

创建你的第一篇博文

1
rake post title="Hello World"

参考链接

https://blog.segmentfault.com/skyinlayer/1190000000406011

https://blog.jsfor.com/skill/2013/09/07/jekyll-local-structures-notes/

https://www.pkuwwt.tk/linux/2013-12-03-jekyll-using-mathjax/

https://pinkyjie.com/2013/10/24/migrate-from-wordpress-to-jekyll/

This post is licensed under CC BY 4.0 by the author.