如何用jekyll生成文章?

    前一段时间接触到github pages,感觉非常新奇,特意查阅资料自己搭建一把,这里做个记录。

环境和安装jekyll

    首先,jekyll是简单的博客形态的静态站点生产机器,具体的 官网介绍,戳我,而且,jekyll依赖Ruby,所以必须得先安装Ruby,本文中使用的是Ruby 2.4.3-1,怎么安装就自行百度了,很简单的。

出现下面提示,那就是安装OK了

我看了好多资料里都写了安装好ruby得安装Devkit,但是,我又在官网没找到2.4.3对应的Devkit,估计是新版不需要devkit了。

然后,用RubyGems来帮助安装(官方推荐),使用

gem install jekyll

出现这个信息,那就说明安装完毕了。


既然安装完毕了,那下面就来举个栗子吧


简单栗子


这里先不讲那么多理论和jekyll new 的方式,其实就只需要四个文件就能跑个demo的。。。

首先,创建一个文件夹,我们的一切操作都在这文件夹里进行,这里就叫  blog 文件夹。

_layouts下default.html

第一个文件,在blog目录下,创建一个叫 “_layouts”的文件夹,这里面放的是模板文件,其他的页面可以公用一个模板,在_layouts文件夹下,创建一个“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>

里面的page.title和content是占位参数

_posts下年-月-日-标题.html

第二个文件,在blog目录下,创建一个叫“_posts”的文件夹,这里存放的是要发布的文章,在“_posts”文件夹下,创建一个“2012-08-25-hello-world.html”,内容是

---
layout: default
title: 你好,世界
---
<h2>{{ page.title }}</h2>
<p>我的第一篇文章</p>
<p>{{ page.date | date_to_string }}</p>

_config.yml

第三个文件,在blog目录下,创建一个叫“_config.yml”的文件,内容简单点是

baseurl: "" # the subpath of your site, e.g. /blog

这个就像是eclipse里web project的项目名,“”就是localhost:4000

index.html

第四个文件,在blog目录下,创建一个叫“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>

最终的目录

blog
    |--_layouts
    |    |--default.html
    |--_posts
    |    |--2012-08-25-hello-world.html
    |--_config.yml
    |--index.html


在cmd里,jekyll server


打开浏览器,访问localhost:4000





OK,搞定,收工!



posted @ 2017-12-26 22:18  Bug开发攻城狮  阅读(158)  评论(0编辑  收藏  举报