开发环境
安装rubyinstaller
安装选项全部勾选
安装完毕后勾选Run'ridk install'to setup MSYS2 and development toolchain，进入终端，MSYS2 components全部安装
ruby -v
如果正常响应版本号则代表安装正确
下载并解压Development Kit(https://rubyinstaller.org/downloads/)，注意选择和ruby相匹配的版本，如 DevKit-mingw64-64-4.7.2-20130224-1432-sfx.exe 适用于64位 Windows 系统上的 Ruby 2.0.0及以上的版本
ruby dk.rb init #edit in DevKit file
DevKit文件夹中会自动生成一个config.yml文件，修改config.yml，添加Ruby的安装路径
# Example:
#
# ---
# - C:/ruby19trunk
# - C:/ruby192dev
#
---
- D:/Ruby25-x64
ruby dk.rb install #edit in DevKit file
更新Ruby source
gem sources -l 查看当前已经添加的源,然后将他们全部移除
gem sources -r https://rubygems.org/ 移除官方源(如果已添加)(国内官方源无法访问)
gem sources -a https://gems.ruby-china.com/ 添加ruby china 可用源(推荐)
gem sources -l 查看当前已经添加的源,是否正确修改
安装jekyll
gem install jekyll
jekyll -v
gem install jekyll bundler
gem install jekyll-paginate
网站的服务器: github.com
New Repository -> (Repository name)username.github.io -> Creat Repository
clone 到本地，工程文件夹username.github.io，作为根目录，将存放所有网站文件。
样式表: /css/main.css
body {
margin: 60px auto;
width: 70%;
}
nav ul, footer ul {
font-family:'Helvetica', 'Arial', 'Sans-Serif';
padding: 0px;
list-style: none;
font-weight: bold;
}
nav ul li, footer ul li {
display: inline;
margin-right: 20px;
}
a {
text-decoration: none;
color: #999;
}
a:hover {
text-decoration: underline;
}
h1 {
font-size: 3em;
font-family:'Helvetica', 'Arial', 'Sans-Serif';
}
p {
font-size: 1.5em;
line-height: 1.4em;
color: #333;
}
footer {
border-top: 1px solid #d5d5d5;
font-size: .8em;
}
ul.posts {
margin: 20px auto 40px;
font-size: 1.5em;
}
ul.posts li {
list-style: none;
}
网站的域名 /CNAME
申请域名
网站的入口: /index.html
<!DOCTYPE html>
<html>
<head>
<title>Hank Quinlan, Horrible Cop</title>
<link rel="stylesheet" type="text/css" href="/css/main.css"
</head>
<body>
<nav>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/Posts">Posts</a></li> <!-- you should create /Posts.html -->
<li><a href="/About">About</a></li> <!-- you should create /About.html -->
</ul>
</nav>
<div class="container">
<div class="blurb">
<h1>Hi there, I'm Hank Quinlan!</h1>
<p>I'm best known as the horrible cop from <em>A Touch of Evil</em> Don't trust me. <a href="/about">Read more about my life...</a></p>
</div><!-- /.blurb -->
</div><!-- /.container -->
<footer>
<ul>
<li><a href="mailto:hankquinlanhub@gmail.com">email</a></li>
<li><a href="https://github.com/hankquinlan">github.com/hankquinlan</a></li>
</ul>
</footer>
</body>
</html>
网站设置 /_config.yml
this file tells Jekyll some basics about your project
name: MyBlog
markdown: kramdown
攥写博客
博客的模板 /_layout/default
<!DOCTYPE html>
<html>
<head>
<title>{{ page.title }}</title>
<!-- link to main stylesheet -->
<link rel="stylesheet" type="text/css" href="/css/main.css">
</head>
<body>
<nav>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/Posts">Posts</a></li> <!-- you should create /Posts.html -->
<li><a href="/About">About</a></li> <!-- you should create /About.html -->
</ul>
</nav>
<div class="container">
{{ content }}
</div><!-- /.container -->
<footer>
<ul>
<li><a href="mailto:hankquinlanhub@gmail.com">email</a></li>
<li><a href="https://github.com/hankquinlan">github.com/hankquinlan</a></li>
</ul>
</footer>
</body>
</html>
博客的模板 /_layout/post
---
layout: default
---
<h1>{{ page.title }}</h1>
<p class="meta">{{ page.date | date_to_string }}</p>
<div class="post">
{{ content }}
</div>
博客文件 /_posts/YYYY-MM-DD-title-of-my-post.md
注意文件名的格式，例如：2018-12-16-my-first-blog.md
---
layout: post
title: "使用gitpage搭建个人网站"
date: 2014-04-30
---
Well. Finally got around to putting this old website together. Neat thing about it - powered by [Jekyll](http://jekyllrb.com) and I can use Markdown to author my posts. It actually is a lot easier than I thought it was going to be.
草稿 /_drafts
随便添加，跟随git一起上传，实现草稿的保存和更新，成型后再转移到_posts中
打开预览功能
jekyll server
最后
git add .
git commit -m "first vision"
git push -u origin master
GitHub Application
GitHub -> Settings -> Devloper settings -> New OAuth App
Application name ->
GitHub -> Settings -> Devloper settings -> OAuth App ->Comment
Client ID
Client Secret
var gitalk = new Gitalk({
clientID: `Github Application clientID`,
clientSecret: `Github Application clientSecret`,
repo: `Github 仓库名`,
owner: 'Github 用户名',
admin: ['Github 用户名'],
id: 'indow.location.pathname', 注意id一定不要重复，这里是举个例子，可以写中文，如果重复了，就会把其他地方的评论显示过来
});
gitalk.render('gitalk-container');
</script> <!-- Gitalk end -->
