Jekyll - personal blog
免费使用Jekyll构建自己的静态博客
构建自己的简单博客
创建项目
1
2
3
4
mkdir jekyll_demo
cd jekyll_demo
git init
git checkout --orphan gh-pages
创建设置文件
在项目根目录下，建立一个名为_config.yml的文本文件
1
baseurl: /jekyll_demo
创建模板文件
在项目根目录下，创建一个_layouts目录，用于存放模板文件
1
mkdir _layouts
进入该目录，创建一个default.html文件，作为Blog的默认模板(将多余的\(\)删除)
1
2
3
4
5
6
7
8
9
10
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title> {$$$${ page.title }} </title>
</head>
<body>
{$$$${ content }}
</body>
</html>
创建文章
根目录，创建一个_posts目录，用于存放blog文章
1
mkdir _posts
进入该目录，创建第一篇文章。文章就是普通的文本文件，文件名假定为2012-08-25-hello-world.html。(将多余的\(\)删除)
1
2
3
4
5
6
7
---
layout: default
title: 你好
---
<h2>{$$$${ page.title }}</h2>
<p>我的第一篇文章</p>
<p>{$$$${ page.date | date_to_string }}</p>
创建首页
根目录，创建一个index.html文件(将多余的\(\)删除)
1
2
3
4
5
6
7
8
9
10
11
---
layout: default
title: 我的Blog
---
<h2>{$$$${ page.title }}</h2>
<p>最新文章</p>
<ul>
{$$$$% for post in site.posts %}
<li>{$$$${ post.date | date_to_string }} <a href="">{$$$${ post.title }}</a></li>
{$$$$% endfor %}
</ul>
发布内容
1
2
3
4
git add .
git commit -m "first post"
git remote add origin https://github.com/username/jekyll_demo.git
git push origin gh-pages
上传成功之后，等10分钟左右，访问 http://username.github.com/jekyll_demo/就可以看到Blog已经生成了
在OSX系统调试Jekyll
安装/升级本地ruby（1.9.2以上）
rvm管理ruby
1
2
curl -L https://raw.github.com/wayneeseguin/rvm/master/binscripts/rvm-installer
| bash -s stable --autolibs=enabled
安装Ruby
1
2
rvm install 1.9.3
rvm use 1.9.3
检测Ruby版本
1
ruby --version
安装Jekyll
更换源
1
2
3
4
gem sources --remove https://rubygems.org/
gem sources --remove http://rubygems.org/
gem sources -a http://ruby.taobao.org/
gem sources -l
** CURRENT SOURCES **
http://ruby.taobao.org 请确保只有 ruby.taobao.org
1
2
sudo gem install jekyll
gem install rdiscount
启动Jekyll
1
jekyll server -s xxxx
Jekyll 插件
Jekyll添加多说评论
大众化评论，支持主流社交账号登陆。
[多说][1] [1]:http://duoshuo.com/
公用加载
1
2
3
4
5
6
7
8
<!--多说js加载开始，一个页面只需要加载一次 -->
<script type="text/javascript">
var duoshuoQuery = {short_name:"您的多说二级域名"};
(function() {
......
})();
</script>
<!--多说js加载结束，一个页面只需要加载一次 -->
最近访客
1
<ul class="ds-recent-visitors"></ul>
最新评论
1
2
3
<ul class="ds-recent-comments" data-num-items="10" data-show-avatars="1"
data-show-time="1" data-show-admin="1"
data-excerpt-length="70"></ul>
热评文章
1
<ul class="ds-top-threads" data-range="weekly" data-num-items="5"></ul>
Jekyll添加百度统计
除非要监听网站流量变化，否则导致网站加载变慢，慎用！
主题共享
Pygments
Install Pygments
decode
Terminal:
1
sudo python setup.py install
List Format for Pygments
Terminal：
1
pygmentize -L
Styles: * monokai: This style mimics the Monokai color scheme. ….
Use In Jekyll
1
2
3
cd /dev/projects/zyzhang.github.com/assets/themes/abel/css
pygmentize -S native -f html > pygments.css
“native”:is format，“html” is formatter layout to use in pygments.css
Pygments Example:
(删除多余\(\)) ~\(\)~~~ ruby/c++ … ~\(\)~~~
{\(\)% highlight ruby %} … {\(\)% endhighlight %}
1
2
3
ActionScript
Ada
...