Improve this page

详细教程（分步骤）

2. Liquid：模板语言

Liquid 会让 Jekyll 变得更有趣。Liquid 是一种模板语言，主要由以下三部分组成：

对象（Objects）
标签（Tags）
过滤器（Filters）
使用 Liquid

对象（Objects）

对象用于让 Liquid 在页面上输出预定义的变量。使用双花括号来表示对象：{{ 和 }}。

例如，{{ page.title }} 会显示 page.title 变量的值。

标签（Tags）

标签用于定义模板的逻辑和控制流程。使用花括号和百分号来表示标签：{% 和 %}。

For example:

{% if page.show_sidebar %}
  <div class="sidebar">
    侧边栏内容
  </div>
{% endif %}

如果 page.show_sidebar 变量的值为 true，则会显示侧边栏。

你可以在 Jekyll 标签文档中了解更多可用的标签。

过滤器（Filters）

过滤器可以改变 Liquid 对象的输出，它们用于处理变量，并通过 | 进行分隔。例如：

{{ "hi" | capitalize }}

上面的代码会将 "hi" 转换为 "Hi"。

👉 查看更多可用的过滤器

使用 Liquid

现在，使用 Liquid 让设置章节中的 "Hello World!" 变成小写：

...
<h1>{{ "Hello World!" | downcase }}</h1>
...

为了让 Jekyll 解析 Liquid 代码，需要在页面顶部添加 Font matter（页面头部参数）：

---
# Font matter（页面头部参数）告诉 Jekyll 处理 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 与其他功能结合使用。接下来，你将学习更多关于 Font matter（页面头部参数） 的内容。

接下来，您将了解有关 front matter（页面头部参数）.的内容。