Jekyll搭建lanmps.com站点

Jekyll 介绍

　 　Jekyll 的核心其实是一个文本转换引擎。它的概念其实就是： 你用你最喜欢的标记语言来写文章，可以是 Markdown，也可以是 Textile,或者就是简单的 HTML, 然后 Jekyll 就会帮你套入一个或一系列的布局中。在整个过程中你可以设置URL路径, 你的文本在布局中的显示样式等等。这些都可以通过纯文本编辑来实现，最终生成的静态页面就是你的成品了。

官网

http://jekyllrb.com/

http://jekyllthemes.org/ 模版

http://jekyll.com.cn/docs/structure/

http://jekyll.com.cn/docs/home/ 中文文档
风.fox

环境

系统：MAC

安装 brew

网址

https://brew.sh/

安装 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分支 就可以了

github.lanmps.com

自己服务器站点

把 _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/
http://jingpin.jikexueyuan.com/article/33606.html