日志未经声明,均为风.fox原创。版权采用『 知识共享署名-非商业性使用 2.5 许可协议』进行许可。
Jekyll 介绍
Jekyll 的核心其实是一个文本转换引擎。它的概念其实就是: 你用你最喜欢的标记语言来写文章,可以是 Markdown,也可以是 Textile,或者就是简单的 HTML, 然后 Jekyll 就会帮你套入一个或一系列的布局中。在整个过程中你可以设置URL路径, 你的文本在布局中的显示样式等等。这些都可以通过纯文本编辑来实现,最终生成的静态页面就是你的成品了。
官网
http://jekyll.com.cn/docs/structure/
http://jekyll.com.cn/docs/home/ 中文文档 风.fox
环境
系统:MAC
安装 brew
网址
安装 brew
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
查看 brew 版本
brew --version
安装GIT
如果已安装,可以跳过
brew install git
查看git版本
git --version
Ruby,Mac自带,如果没有请安装
Ruby,Mac自带,如果没有请安装
gem 升级
sudo gem update --system
gen 版本
gem -v
安装 Jekyll
如果已安装,可以跳过
这里指定目录安装
sudo gem install jekyll -n /usr/local/Cellar/jekyll
设置环境
vim ~/.bash_profile
加入
export PATH=/usr/local/Cellar/jekyll:$PATH
生效
cd ~
. ./.bash_profile
查看 jekyll 版本
jekyll -v
安装依赖库
bundler,minima,jekyll-feed
sudo gem install bundler -n /usr/local/Cellar/jekyll
sudo gem install minima -n /usr/local/Cellar/jekyll
sudo gem install jekyll-feed -n /usr/local/Cellar/jekyll
gem 数据源改成国内
gem sources --add https://gems.ruby-china.org/ --remove https://rubygems.org/
gem sources -l
显示
*** CURRENT SOURCES ***
https://gems.ruby-china.org
# 请确保只有 gems.ruby-china.org
jekyll 几个操作
## 博客生成,默认生成再_site目录下
jekyll build
jekyll build--watch //自动检测编译
## 开启jekyll本地预览
jekyll server
jekyll serve --watch //自动运行编译文件
创建博客 lanmps
jekyll new lanmps #生成博客
cd lanmps #进入博客目录
启动服务,本地预览
jekyll serve
网址,浏览器里输入
http://localhost:4000
如下图
目录结构
官网介绍 http://jekyll.com.cn/docs/structure/
用命令查看
find . -print | sed -e 's;[^/]*/;|____;g;s;____|; |;g'
返回
.
|____.DS_Store
|____.gitignore
|____.sass-cache
| |____a5d4e30abfe97072f611db3329398692c6ec56cf
| | |____minima.scssc
| |____bf328f05706bf12c3361420b40482f39a31a8d93
| | |_____base.scssc
| | |_____layout.scssc
| | |_____syntax-highlighting.scssc
|____Gemfile
|____Gemfile.lock
|_____config.yml
|_____posts
| |____2017-03-11-welcome-to-jekyll.markdown
|_____site
| |____about
| | |____index.html
| |____assets
| | |____main.css
| |____feed.xml
| |____index.html
| |____jekyll
| | |____update
| | | |____2017
| | | | |____03
| | | | | |____11
| | | | | | |____welcome-to-jekyll.html
|____about.md
|____index.md
用tree命令查看
如果没有tree命令请先安装
brew instal tree
然后直接执行
tree
修改页面信息
进入 _config.yml 里面,修改成你想看到的信息,重新 jekyll server ,刷新浏览器就可以看到你刚刚修改的信息了。
到了这里,最原始的一个Jekyll 博客就搭建完成了
案例 lanmps.com博客搭建
博客模版用的是 https://github.com/sharu725/gatok ,你也可以直接使用我修改过得博客 https://github.com/foxiswho/lanmps/tree/gh-pages ,效果 github.lanmps.com
先下载他并解压缩,更改名字为lanmps
,进入lanmps
目录
启动本地服务看效果
jekyll serve
如果是第一次启动,一般要安装扩展插件
sudo gem install jekyll-seo-tag -n /usr/local/Cellar/jekyll
修改成自己博客
_config.yml
根目录 _config.yml
站点配置文件修改为
# Welcome to Jekyll!
#
# This config file is meant for settings that affect your whole blog, values
# which you are expected to set up once and rarely need to edit after that.
# For technical reasons, this file is *NOT* reloaded automatically when you use
# 'jekyll serve'. If you change this file, please restart the server process.
# Site settings
title: LANMPS 一键PHP环境安装包
email: foxiswho@gmail.com
description: > # this means to ignore newlines until "baseurl:"
LANMPS一键安装包,Linux+Nginx+Mysql+PHP+ElasticSearch ( phpmyadmin+opencache+xdebug )环境套件包,绿色PHP套件,一键自动安装
baseurl: "" # the subpath of your site, e.g. /blog
url: "http://github.lanmps.com/" # the base hostname & protocol for your site
# Build settings
markdown: kramdown
baseurl: ""
permalink: /:title/
disqus-shortname: LANMPS
kramdown:
input: GFM
extensions:
- autolink
- footnotes
- smart
- hard_wrap
- no_intra_emphasis
- strikethrough
- fenced_code_blocks
- with_toc_data
- tables
- underline
use_coderay: false
syntax_highlighter: rouge
#compress.html
compress_html:
clippings: [html,div, p, ul, td, h1, h2, h3, h4,link, meta, footer, nav, img, header, hr, br, head, style, li, ul, ol, time, main, script, title]
comments: ["<!-- ", " -->"]
endings: [all]
ignore:
envs: [local]
blanklines: false
profile: false
startings: []
sass:
style: compressed
analytics: UA-83979019-1
version: 1.0
gems: [jekyll-paginate, jekyll-seo-tag]
prose:
rooturl: ''
siteurl: 'http://prose.github.io/starter/'
relativeLinks: 'http://prose.github.io/starter/links.jsonp'
media: 'images'
ignore:
- index.md
- _config.yml
- /_layouts
- /_includes
lists.md 列表页面
原首页 是列表页,但是 我这里博客首页显示是安装教程,
而且默认首页不支持 markdown编辑器,所以这里没有使用它,只使用它作为列表页面
修改index.html
为lists.md
页面
修改lists.md
---
layout: default
title: 列表
permalink: /list/index.html
---
。。。其他部分请看 源码,这里就不复制了
layout 模版,使用的是
_layouts/default.html
模版 title 显示的标题名称 permalink 生成的url链接
index.html
这里使用的是 列表自定义URL地址
在_posts
目录下,新建格式为年-月-日-自定义文件名.md
的文件 2017-03-17-install.md
,
内容为
---
layout: post
title: 安装
permalink: /index.html
---
LANMPS 一键安装包,php绿色环境套件包
=====================================
Linux+Nginx+Mysql+PHP+Elasticsearch ( phpmyadmin+opencache+xdebug )环境套件包,绿色PHP套件,一键自动安装
系统需求
-------------------------------------
* 系统:Linux下CentOS,RedHat,Ubuntu
* 内存:大于等于512M内存
* 安装时需要联网
LANMPS 一键安装包V3.2.2 :Linux+Nginx+Mysql+PHP+Elasticsearch ( phpmyadmin+opencache+xdebug )套件包,绿色PHP套件,一键自动安装。
>
> 已在 CentOS7.x,Ubuntu17.x 中安装成功!
>
> Apache 在下个版本中会实现
。。。其他更多内容就不复制了
layout 模版,使用的是
_layouts/post.html
模版 title 显示的标题名称 permalink 生成的url链接 ,设置好/index.html
这个url文件名后,你就会发现,这不就是首页
么
其他目录
根据index.html
,做相应的更改就可以了,主要是title
和permalink
要修改好
根目录下
contact.md和about.md 文件删除
本博客不使用它
github 上传
直接把当前目录 上传 到 gh-pages
分支 就可以了
自己服务器站点
把 _site
目录下文件上传即可
注意
在生成好的网站HTML文件中,有些链接例如
<link rel="canonical" href="http://localhost:4000/" />
,都是本地调试域名及端口
如果你有完美洁癖的,只要在上传站点之前,在 _config.yml
中增加端口和主机名,重新执行jekyll serve
编译后,再上传就好了
port: 80
host: localhost
Q&A
安装 jekyll 报错 Operation not permitted - /usr/bin/sass
请按照 上述格式指定目录安装
sudo gem install jekyll -n /usr/local/Cellar/jekyll
依赖库
Dependency Error: Yikes! It looks like you don’t have bundler 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 -- bundler’ If you run into trouble, you can find helpful resources at https://jekyllrb.com/help/! 安装如下依赖库
sudo gem install bundler -n /usr/local/Cellar/jekyll
https://github.com/sharu725/gatok 参考 https://my.oschina.net/u/868062/blog/613164 http://baixin.io/2016/10/jekyll_tutorials1/
Donate:| 文章有帮助,可以 请我喝杯咖啡
Powered by foxwho.com 浙ICP备19037334号-1