標籤：style class blog code http ext
第一步：先總體看下要在本地建立的檔案目錄
/jun_demo |-- _config.yml |-- _layouts | |-- default.html |-- _posts | |-- 2014-06-26-hello-world.html |-- index.html
config.yml:Configuration設定
_layouts:模板存放檔案夾
default.html:檔案模板
_posts：blog文章存放目錄
2014-06-26-hello-world-html:blog文章
index.html:文章首頁面
第二步：配置
//建立檔案夾 jun_demo,對該目錄進行git初始化
$ mkdir jun_demo
$ cd jun_demo $ git init
//建立沒有父節點的分支gh-pages，只有在該分支中的頁面才會產生網站
$ git checkout --orphan gh-pages
第三步：給以上建立檔案目錄新增內容
1 config.yml(只設定這一個屬性其他屬性參看：http://jekyllrb.com/docs/configuration/)
baseurl:/jun_demo
2 default.html
<!DOCTYPE html><html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>{{ page.title }}</title> </head> <body> {{ content }} </body></html>
3 2014-06-26-hello-world-html (在"---"之間的部分是blog版面設定，其中layout是選擇模版,title是page.title)
--- layout: default title: 你好，世界--- <h2>{{ page.title }}</h2> <p>我的第一篇文章</p> <p>{{ page.date | date_to_string }}</p>
4 index.html
--- layout: default title: 我的Blog--- <h2>{{ page.title }}</h2> <p>最新文章</p> <ul> {% for post in site.posts %} <li>{{ post.date | date_to_string }} <a href="{{ site.baseurl }}{{ post.url }}">{{ post.title }}</a></li> {% endfor %} </ul>
第四步：提交
//添加到本地庫中
$ git add .$ git commit -m "first post"
//添加到服務庫中 username對應替換成你的github賬戶名，jun_demo.git也為你在伺服器上的庫命
$ git remote add origin https://github.com/username/jun_demo.git
$ git push origin gh-pages
第五步：訪問你的網站，地址為http://username.github.com/jun_demo/（將username換成你的使用者名稱)
註：該文為閱讀總結，原地址為http://www.ruanyifeng.com/blog/2012/08/blogging_with_jekyll.html
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
