Jekyll使用教程笔记 四


目录css


草稿

草稿是文件名中没有日期的文章。它们是你仍在编辑中的、不想发布的文章。要启动并运行草稿,请在站点根目录中建立一个_drafts文件夹(如站点结构部分中所述)并建立第一个草稿:html

|-- _drafts/
|   |-- a-draft-post.md
复制代码

要在你的网站中预览草稿,只需使用--drafts开关运行jekyll servejekyll build。每一个草稿将被自动设置修改时间,所以你看到的是按照最近编辑时间的顺序显示的草稿。git

建立页面

除了撰写文章外,你还可能但愿将静态页面(不是基于日期的内容)添加到Jekyll站点。经过利用Jekyll复制文件和目录的方式,这将很容易实现。github

首页

几乎全部你遇到的Web服务器配置都会在网站的根目录中查找名为index.html的HTML文件(按惯例),并将其显示为主页。除你使用的Web服务器被配置为查找某个不一样的文件名做为默认文件名,不然该文件将是你的Jekyll生成站点的主页。浏览器

重要提示™:对你的首页使用布局bash

你网站上的全部HTML文件均可以使用布局和/或引用,包括主页。常见的内容,如页眉和页脚,最好是抽取到布局中。服务器

其余网页的位置

你为网页添加HTML或Markdown文件的方式取决于你但愿网页的工做方式。主要有两种建立页面的方法:markdown

  • 在网站的根目录中放置每一个页面,并给HTML或Markdown文件命名。
  • 将页面放在文件夹和子文件夹中,并将其命名为任何你但愿的。

两种方法均可以正常工做(而且能够相互结合使用),惟一的区别就是生成的URL。默认状况下,页面在_site中保留与源目录中相同的文件夹结构。布局

为HTML文件命名

添加页面的最简单方法就是在根目录中添加一个HTML文件,其中包含要建立的页面的合适名称。对于包含主页,关于页面和联系页面的网站,如下是根目录和关联网址的结构:post

.
|-- _config.yml
|-- _includes/
|-- _layouts/
|-- _posts/
|-- _site/
|-- about.html    # => http://example.com/about.html
|-- index.html    # => http://example.com/
|-- other.md      # => http://example.com/other.html
└── contact.html  # => http://example.com/contact.html
复制代码

若是你有不少页面,则能够将这些页面放到子文件夹中。当你的网站创建时,用于在咱们项目的源代码中对你的网页进行分组的相同子文件夹将存在于_site文件夹中。

将子文件夹中的页面构建展现到根目录中

若是你的页面被放到你的源文件夹中的子文件夹中,而且想要将它们构建展现在根目录中,则必须直接在页面的Front Matter中添加永久属性,以下所示:

---
title: My page
permalink: mypageurl.html
---
复制代码

命名文件夹包含索引HTML文件

若是你不但愿文件扩展名(.html)出如今你的页面网址中(文件扩展名是默认存在的),你能够选择具备尾部斜线而不是文件扩展名的永久连接样式。

请注意,若是你但愿在没有Jekyll预览服务器的状况下离线查看你的网站,你的浏览器将须要文件扩展名来显示页面,而且全部资源都须要是相对连接,这样这些连接才能够在没有服务器基础的状况下运行。

静态文件

除了可渲染和可转换内容以外,咱们还有静态文件

静态文件是一个不包含任何YAML Front Matter的文件,包括了图像,PDF和其余不被渲染的内容。

它们能够经过site.static_files在Liquid中访问,并包含如下元数据:

变量 说明
file.path 文件的相对路径,例如:/assets/img/image.jpg
file.modified_time 该文件最后修改的时间, 例如:2016-04-01 16:35:26 +0200
file.name 文件的字符串名称, 例如:image.jpg for image.jpg
file.basename 文件的字符串基本名称, 例如:image.jpgimage
file.extname 文件的扩展名, 例如:image.jpg.jpg

请注意,在上表中,file能够是任何东西。它只是一个在你本身的逻辑中使用的任意设置的变量(例如在for循环中)。它不是网站或页面的全局变量。

给静态文件添加Front Matter

尽管没法直接将Front Matter添加到静态文件,但能够经过配置文件中的默认属性设置Front Matter。当Jekyll构建网站时,它将使用你设置的Front Matter。

这是一个例子:

在你的_config.yml文件中,将下列值添加到defaults属性中:

defaults:
  - scope:
      path: "assets/img"
    values:
      image: true
复制代码

这假定你的Jekyll站点的文件夹路径为assets/img,你能够在其中存储图像(静态文件)。当Jekyll构建网站时,它会将每一个图像视为含有Front Matter的值:image: true

假设你想要列出assets/img中包含的全部图像资源。你能够使用这个for循环来查看static_files对象并得到全部具备这个Front Matter属性的静态文件:

{% assign image_files = site.static_files | where: "image", true %}
{% for myimage in image_files %}
  {{ myimage.path }}
{% endfor %}
复制代码

当你构建你的站点时,输出将列出符合此前提条件的每一个文件的路径。

变量

Jekyll遍历你的网站寻找要处理的文件。任何带有YAML Front Matter的文件都将受处处理。对于这些文件中的每个,Jekyll都会经过Liquid模板系统提供各类数据。如下是可用数据的参考。

全局变量

变量 说明
site 来自_config.yml的全站信息+配置设置。详情请参阅下文。
page 页面特有信息+YAML Front Matter。经过YAML Front Matter设置的自定义变量也会在此处提供。详情请参阅下文。
layout 布局特有信息+YAML Front Matter。经过YAML Front Matter设置的自定义变量也会在此处提供。详情请参阅下文。
content 在布局文件中,包装好的文章或页面的渲染内容。 文章或页面文件中没有这个变量的定义。
paginator paginate配置选项被设置时,这个变量才能够使用。有关详细信息,请参阅分页

site变量

变量 说明
site.time 当前时间(当你运行jekyll命令时的时间)。
site.pages 全部页面的列表。
site.posts 全部文章的按时间顺序的倒序列表。
site.related_posts 若是正在处理的是文章,则其中最多包含10个相关文章的列表。默认状况下,这些是最近发布的十个文章。对于高质量但计算结果较慢的状况,请使用--lsi(潜在语义索引)选项运行jekyll命令。另外请注意,GitHub Pages在生成网站时不支持lsi选项。
site.static_files 全部静态文件的列表(即未由Jekyll转换器或Liquid渲染器处理的文件)。每一个文件都有五个属性:pathmodified_timenamebasenameextname
site.html_pages site.pages的一个子集,列出以.html结尾的内容。
site.html_files site.static_files的一个子集,列出以.html结尾的内容。
site.collections 一个全部合集的列表
site.data 包含从位于_data目录中的YAML文件加载的数据的列表。
site.documents 每一个合集中的全部文档的列表。
site.categories.CATEGORY CATEGORY类别中的全部文章的列表。
site.tags.TAG 标签是TAG的全部文章的列表
site.url _config.yml中配置的网站的网址。例如,若是你的配置文件中包含url: http://mysite.com,则能够在Liquid中以site.url的形式访问它。对于开发环境,有一个例外,若是你运行jekyll serve,在开发环境中site.url将被设置为与hostportSSL相关选项的值。 默认为url: http://localhost:4000
site.[CONFIGURATION_DATA] 全部经过命令行设置的变量和你的_config.yml均可以经过site变量得到。例如,若是你在你的配置文件中有foo: bar,那么它能够在Liquid中经过site.foo访问。Jekyll不会在watch模式下解析对_config.yml的更改,你必须从新启动Jekyll以查看对变量的更改。

页面变量

变量 说明
page.content 页面的内容,渲染或不渲染取决于Liquid正在处理什么以及页面是什么。
page.title 页面的标题
page.excerpt 未渲染的文档摘录
page.url 只有前导斜杠,但不含域名的文章地址,例如:/2008/12/14/my-post.html
page.date 文章指定的日期。这能够经过指定YYYY-MM-DD HH:MM:SS(假设UTC)或YYYY-MM-DD HH:MM:SS +/-TTTT( 使用与UTC的偏移来指定时区,例如2008-12-14 10:30:00 +0900)。
page.id Collection或Post中文档的惟一标识符(在RSS提要中有用)。例如 /2008/12/14/my-post /my-collection/my-document
page.categories 此文章所属类别的列表。类别来自_posts目录上方的目录结构。例如,/work/code/_posts/2008-12-24-closures.md中的文章可能会将此字段设置为['work','code']。 这些也能够在YAML Front Matter中指定。
page.tags 此文章所属的标签列表。这些能够在YAML Front Matter中指定。
page.path 原始文章或页面的路径。用法示例:连接回GitHub上的页面或文章的源代码。这能够在YAML Front Matter中重写。
page.next 下一篇文章相对于site.posts中当前文章的位置。最后一个文章会返回nil
page.previous 上一篇文章相对于site.posts中当前文章的位置。最后一个文章会返回nil

重要提示™:使用自定义的Front Matter

你指定的任何自定义Front Matter将在page下提供。例如,若是你在页面的Front Matter中指定了custom_css: true,则该值将做为page.custom_css提供。

若是你在布局中指定Front Matter,请经过layout访问。例如,若是在布局的Front Matter中指定class: full_page,则该值将在布局及其父项中做为layout.class提供。

分页

变量 说明
paginator.per_page 每页文章数。
paginator.posts 该页面可用的文章。
paginator.total_posts 文章总数。
paginator.total_pages 总页数。
paginator.page 当前页面的编号。
paginator.previous_page 上一页的编号。
paginator.previous_page_path 上一页的路径。
paginator.next_page 下一页的编号。
paginator.next_page_path 下一页的路径。

注意:分页变量可用性

这些仅在索引文件中可用,但它们能够位于子目录中,例如/blog/index.html

相关文章
相关标签/搜索