分步教程
2. Liquid
Liquid 是 Jekyll 开始变得更有趣的地方。它是一种模板语言,具有三个主要组件
对象
对象告诉 Liquid 将预定义的变量作为页面上的内容输出。对对象使用双花括号:{{
和 }}
。
例如,{{ page.title }}
显示page.title
变量。
标签
标签定义模板的逻辑和控制流。对标签使用花括号和百分号:{%
和 %}
。
例如
{% if page.show_sidebar %}
<div class="sidebar">
sidebar content
</div>
{% endif %}
如果show_sidebar
页面变量的值为 true,则此代码显示侧边栏。
在此处了解有关 Jekyll 中可用标签的更多信息。
过滤器
过滤器更改 Liquid 对象的输出。它们在输出中使用,并用 |
分隔。
例如
{{ "hi" | capitalize }}
此代码显示 Hi
而不是 hi
。
了解有关可用过滤器的更多信息。
使用 Liquid
现在,使用 Liquid 将 设置 中的 Hello World!
文本变为小写
...
<h1>{{ "Hello World!" | downcase }}</h1>
...
为了让 Jekyll 处理您的更改,请将 页眉 添加到页面顶部
---
# front matter tells Jekyll to process Liquid
---
您的 HTML 文档应如下所示
---
---
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Home</title>
</head>
<body>
<h1>{{ "Hello World!" | downcase }}</h1>
</body>
</html>
重新加载浏览器后,您应会看到 hello world!
。
Jekyll 的强大功能很大程度上源于将 Liquid 与其他功能相结合。将页眉添加到页面,以使 Jekyll 处理这些页面上的 Liquid。
接下来,您将详细了解页眉。