摘要：雙擊打開正文顯示的文章名，如我的第一篇文章顯示的文章發(fā)布日期，如標(biāo)簽的分類，如隨筆注意文章頭部格式必須為上面的，就是文章的正文內(nèi)容。

萌新來講講如何使用 Jekyll 搭建個(gè)人博客，從安裝到配置！炒雞詳細(xì)！。原文地址https://zhangmingemma.github....

jekyll是一個(gè)靜態(tài)站點(diǎn)生成器，會(huì)根據(jù)網(wǎng)頁源碼生成靜態(tài)文件。

簡(jiǎn)單。無需數(shù)據(jù)庫，評(píng)論功能，不需要不斷更新版本，只用關(guān)注你的博客內(nèi)容

靜態(tài)。只用Markdown(或者Textile)、Liquid、HTML&CSS就可以構(gòu)建可部署的靜態(tài)網(wǎng)站

博客形態(tài)。自定義地址、分類頁面、分類博客內(nèi)容以及自定義的布局設(shè)計(jì)

使用GitHub Pages可以運(yùn)行jekyll，很簡(jiǎn)單就可以完全免費(fèi)的在GitHub上發(fā)布網(wǎng)站

注冊(cè)Github賬號(hào)，并新建倉庫教程第一部分內(nèi)容,照做即可

下載安裝Git,git for Windows,安裝教程

安裝Ruby & Devkit, Window 系統(tǒng)下，我們可以使用 RubyInstaller 來安裝 Ruby 環(huán)境，下載地址,安裝教程

配置jekyll環(huán)境(前提是你的電腦有Python、easy_install)

安裝 jekyll

$ gem install jekyll     

創(chuàng)建博客

$ jekyll new myBlog    

進(jìn)入博客目錄

$ cd myBlog  

啟動(dòng)本地服務(wù)

$ jekyll serve

在瀏覽器里輸入： http://localhost:4000，就可以看到你的博客效果了。

Error: Auto-regeneration: enabled for "c:/Devkit/MyBlog"
Configuration file: c:/Devkit/MyBlog/_config.yml
jekyll 3.4.1 | Error:  Permission denied - bind(2) for 127.0.0.1:4000

*解決方法：先關(guān)掉后臺(tái)開啟的Apache、MySQL服務(wù)，重新啟動(dòng)jekyll serve，繼續(xù)錯(cuò)誤，則在_config.yml文件最后一行加入port : 4001

　
Jekyll 的核心其實(shí)是一個(gè)文本轉(zhuǎn)換引擎。它的概念其實(shí)就是： 你用你最喜歡的標(biāo)記語言來寫文章，可以是 Markdown，也可以是 Textile,或者就是簡(jiǎn)單的 HTML, 然后 Jekyll 就會(huì)幫你套入一個(gè)或一系列的布局中。在整個(gè)過程中你可以設(shè)置URL路徑, 你的文本在布局中的顯示樣式等等。這些都可以通過純文本編輯來實(shí)現(xiàn)，最終生成的靜態(tài)頁面就是你的成品了。

一個(gè)基本的 Jekyll 網(wǎng)站的目錄結(jié)構(gòu)一般是像這樣的：

.
├── _config.yml
├── _includes
|   ├── footer.html
|   └── header.html
├── _layouts
|   ├── default.html
|   ├── post.html
|   └── page.html
├── _posts
|   └── 2016-10-08-welcome-to-jekyll.markdown
├── _sass
|   ├── _base.scss
|   ├── _layout.scss
|   └── _syntax-highlighting.scss
├── about.md
├── css
|   └── main.scss
├── feed.xml
└── index.html

這些目錄結(jié)構(gòu)以及具體的作用可以參考 官網(wǎng)文檔

進(jìn)入 _config.yml 里面，修改成你想看到的信息，重新 jekyll server ，刷新瀏覽器就可以看到你剛剛修改的信息了。

到此，博客初步搭建算是完成了，

在本地新建一個(gè)文件夾blog，在文件夾內(nèi)打開git bash，運(yùn)行命令

$ git clone https://github.com/(github的用戶名)/(github的倉庫名).git

可以看到文件夾內(nèi)多了文件夾(github的倉庫名).git(內(nèi)含隱藏的.git文件夾和READme文件)

將它們?nèi)恳苿?dòng)到blog目錄下，并將你本地創(chuàng)建的博客文件下的所有內(nèi)容_config.yml，_layouts,_posts等，刪掉(github的倉庫名).git文件夾

運(yùn)行命令

git add .
git commit -a -m "first commit"
git remote add origin https://github.com/(github用戶名)/(github倉庫名).git
git push -u origin master

如果是綁定到一級(jí)域名：

首先在項(xiàng)目根目錄下創(chuàng)建一個(gè)叫CNAME文件，里面寫上自己的以及一級(jí)域名（如這個(gè)博客就是skyinlayer.com）

在DNS中為自己的域名增加一條A記錄，指向207.97.227.245

將項(xiàng)目提交到github上，等一會(huì)兒（不會(huì)超過1小時(shí)）

baseurl應(yīng)該為"/"

訪問自己的域名看看結(jié)果吧

如果是綁定到二級(jí)域名，需要額外在DNS中增加一條CNAME，指向(github用戶名).github.io，然后再CNAME文件中修改為自己的二級(jí)域名即可

所有的文章都是 _posts 目錄下面，文章格式為 mardown 格式，文章文件名可以是 .mardown 或者 .md。

編寫一篇新文章很簡(jiǎn)單，你可以直接從 _posts/ 目錄下復(fù)制一份出來 2016-10-16-welcome-to-jekyll副本.markdown ，修改名字為 2016-10-16-article1.markdown ，注意：文章名的格式前面必須為 2016-10-16- ，日期可以修改，但必須為 年-月-日- 格式，后面的 article1 是整個(gè)文章的連接 URL，如果文章名為中文，那么文章的連接URL就會(huì)變成這樣的：http://baixin.io/2015/08/%E6%... ， 所以建議文章名最好是英文的或者阿拉伯?dāng)?shù)字。 雙擊 2016-10-16-article1.markdown 打開

---
layout: post
title:  "Welcome to Jekyll!"
date:   2016-10-16 11:29:08 +0800
categories: jekyll update
---

正文...

title: 顯示的文章名， 如：title: 我的第一篇文章
date: 顯示的文章發(fā)布日期，如：date: 2016-10-16
categories: tag標(biāo)簽的分類，如：categories: 隨筆

注意：文章頭部格式必須為上面的，.... 就是文章的正文內(nèi)容。

我寫文章使用的是 Sublime Text3 編輯器，Markdown簡(jiǎn)單語法

雖然博客部署完成了，你會(huì)發(fā)現(xiàn)博客太簡(jiǎn)單不是你想要的，這里有很多漂亮的模板。

選擇你喜歡的模板下載解壓到目錄下， 將_config.yml、_posts修改成自己的信息與文章，使用命令部署本地服務(wù)

$ jekyll server   

可能會(huì)出現(xiàn)一些錯(cuò)誤：

/Users/xxxxxxxx/.rvm/rubies/ruby-2.2.2/lib/ruby/site_ruby/2.2.0/rubygems/core_ext/kernel_require.rb:54:in `require": cannot load such file -- bundler (LoadError)
    from /Users/xxxxxxxx/.rvm/rubies/ruby-2.2.2/lib/ruby/site_ruby/2.2.0/rubygems/core_ext/kernel_require.rb:54:in `require"
    from /Users/xxxxxxxx/.rvm/gems/ruby-2.2.2/gems/jekyll-3.3.0/lib/jekyll/plugin_manager.rb:34:in `require_from_bundler"
    from /Users/xxxxxxxx/.rvm/gems/ruby-2.2.2/gems/jekyll-3.3.0/exe/jekyll:9:in `"
    from /Users/xxxxxxxx/.rvm/gems/ruby-2.2.2/bin/jekyll:23:in `load"
    from /Users/xxxxxxxx/.rvm/gems/ruby-2.2.2/bin/jekyll:23:in `
"
    from /Users/xxxxxxxx/.rvm/gems/ruby-2.2.2/bin/ruby_executable_hooks:15:in `eval"
    from /Users/xxxxxxxx/.rvm/gems/ruby-2.2.2/bin/ruby_executable_hooks:15:in `
"

原因： 沒有安裝 bundler ，執(zhí)行安裝 bundler 命令

$ gem install bundler

提示：

Fetching: bundler-1.13.5.gem (100%)
Successfully installed bundler-1.13.5
Parsing documentation for bundler-1.13.5
Installing ri documentation for bundler-1.13.5
Done installing documentation for bundler after 5 seconds
1 gem installed

再次執(zhí)行 $ jekyll server ，提示

Could not find proper version of jekyll (3.1.1) in any of the sources
Run `bundle install` to install missing gems.

跟著提示運(yùn)行命令

$ bundle install

提示

Fetching gem metadata from https://rubygems.org/...........
Fetching version metadata from https://rubygems.org/..
Fetching dependency metadata from https://rubygems.org/.
。。。
Installing jekyll-watch 1.3.1
Installing jekyll 3.1.1
Bundle complete! 3 Gemfile dependencies, 17 gems now installed.
Use `bundle show [gemname]` to see where a bundled gem is installed.

bundler安裝完成，后再次啟動(dòng)本地服務(wù)

$ jekyll server

繼續(xù)報(bào)錯(cuò)

Configuration file: /Users/tendcloud-Caroline/Desktop/XXXXXXXXXXXXX/_config.yml
  Dependency Error: Yikes! It looks like you don"t have jekyll-sitemap or one of its dependencies installed. In order to use Jekyll as currently configured, you"ll need to install this gem. The full error message from Ruby is: "cannot load such file -- jekyll-sitemap" If you run into trouble, you can find helpful resources at http://jekyllrb.com/help/! 
jekyll 3.1.1 | Error:  jekyll-sitemap

表示沒有安裝gem 的jekyll-sitemap

gem install jekyll-sitemap

并將Gemfile中加入

gem "jekyll-sitemap", "~> 1.0"

再次啟動(dòng)本地服務(wù)

$ jekyll server

提示

Configuration file: /Users/baixinpan/Desktop/OpenSource/Mine/Page-Blog/XXXXXXXXXXXXX/_config.yml
            Source: /Users/baixinpan/Desktop/OpenSource/Mine/Page-Blog/XXXXXXXXXXXXX
       Destination: /Users/baixinpan/Desktop/OpenSource/Mine/Page-Blog/XXXXXXXXXXXXX/_site
 Incremental build: disabled. Enable with --incremental
      Generating... 
                    done in 0.901 seconds.
 Auto-regeneration: enabled for "/Users/baixinpan/Desktop/OpenSource/Mine/Page-Blog/XXXXXXXXXXXXX"
Configuration file: /Users/baixinpan/Desktop/OpenSource/Mine/Page-Blog/XXXXXXXXXXXXX/_config.yml
    Server address: http://127.0.0.1:4000/
  Server running... press ctrl-c to stop.

表示本地服務(wù)部署成功。

在瀏覽器輸入 127.0.0.1:4000 ， 就可以看到博客效果了。