概述

🔗Zola概览

Zola 是一个静态站点生成器 (SSG)，类似于Hugo、Pelican和Jekyll（有关 SSG 的完整列表，请参阅Jamstack）。它用Rust编写并使用Tera模板引擎，类似于Jinja2、Django 模板、Liquid和Twig。

内容使用CommonMark编写，CommonMark 是一种定义明确、高度兼容的Markdown规范。Zola 使用pulldown-cmark来解析 markdown 文件。该库的目标是 100% 符合 CommonMark 规范。它添加了一些额外的功能，例如解析脚注、Github 风格的表格、Github 风格的任务列表和删除线。

SSG 使用动态模板将内容转换为静态 HTML 页面。因此，静态站点速度非常快，不需要数据库，因此易于托管。可以在此处找到静态网站和动态网站（例如 WordPress、Drupal 和 Django）之间的比较。

要体验 Zola，请参阅下面的快速概述。

🔗与 Zola 的第一步

与某些 SSG 不同，Zola 不对您网站的结构做出任何假设。在本概述中，我们将制作一个简单的博客站点。

🔗初始化站点

本概述基于 Zola 0.9。

请参阅适用于您的平台的详细安装说明。安装 Zola 后，让我们初始化我们的站点：

$ zola init myblog

你会被问到几个问题。

> What is the URL of your site? (https://example.com):
> Do you want to enable Sass compilation? [Y/n]:
> Do you want to enable syntax highlighting? [y/N]:
> Do you want to build a search index of the content? [y/N]:

对于我们的博客，让我们接受默认值（即，对每个问题按 Enter）。我们现在有一个myblog具有以下结构的目录：

├── config.toml
├── content
├── sass
├── static
├── templates
└── themes

作为参考，到本概述结束myblog时，我们的目录将具有以下结构：

├── config.toml
├── content/
│   └── blog/
│       ├── _index.md
│       ├── first.md
│       └── second.md
├── sass/
├── static/
├── templates/
│   ├── base.html
│   ├── blog-page.html
│   ├── blog.html
│   └── index.html
└── themes/

让我们启动 Zola 开发服务器：

$ zola serve
Building site...
-> Creating 0 pages (0 orphan), 0 sections, and processing 0 images

此命令必须在 Zola 基本目录中运行，该目录包含config.toml.

如果将 Web 浏览器指向http://127.0.0.1:1111，您应该会看到“欢迎使用 Zola”消息。

🔗主页

让我们做一个主页。为此，我们首先在目录base.html中创建一个文件templates。当我们浏览此概述时，此步骤将更有意义。

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <title>MyBlog</title>
</head>

<body>
  <section class="section">
    <div class="container">
      {% block content %} {% endblock %}
    </div>
  </section>
</body>

</html>

现在，让我们在目录index.html中创建一个文件templates。

{% extends "base.html" %}

{% block content %}
<h1 class="title">
  This is my blog made with Zola.
</h1>
{% endblock content %}

这告诉 Zolaindex.html扩展我们的文件并用和标签base.html之间的文本替换名为“content”的块。{% block content %}{% endblock content %}

🔗内容目录

现在让我们添加一些内容。我们将从blog在目录中创建一个子目录content并_index.md在其中创建一个文件开始。这个文件告诉 Zola 这blog是一个section，这就是内容在 Zola 中的分类方式。

├── content
│   └── blog
│       └── _index.md

在文件中，我们将以TOML_index.md格式设置以下变量：

+++
title = "List of blog posts"
sort_by = "date"
template = "blog.html"
page_template = "blog-page.html"
+++

请注意，虽然没有变量是强制性的，但打开和关闭+++是必需的。

  • sort_by = "date"告诉 Zola 使用日期来排序我们的部分页面（更多信息见下页）。
  • template = "blog.html"blog.html告诉 Zola在目录中使用templates作为模板列出本节中的 Markdown 文件。
  • page_template = "blog-page.html"blog-page.html告诉 Zola在目录中使用templates作为单个 Markdown 文件的模板。

有关部分变量的完整列表，请参阅部分文档。我们将在模板中使用title = "List of blog posts" （见下文）。

🔗模板

现在让我们创建更多的模板。在该templates目录中，创建一个blog.html包含以下内容的文件：

{% extends "base.html" %}

{% block content %}
<h1 class="title">
  {{ section.title }}
</h1>
<ul>
  <!-- If you are using pagination, section.pages will be empty. You need to use the paginator object -->
  {% for page in section.pages %}
  <li><a href="{{ page.permalink | safe }}">{{ page.title }}</a></li>
  {% endfor %}
</ul>
{% endblock content %}

正如index.html, blog.htmlextends所做的那样base.html，但这次我们要列出博客文章。我们在上面的文件中设置的标题_index.md可以作为{{ section.title }}. 在标题下方的列表中，我们循环遍历我们部分（目录）中的所有页面，并分别使用和blog输出页面标题和 URL 。我们使用过滤器是因为永久链接不需要进行 HTML 转义（转义会导致呈现为）。{{ page.title }}{{ page.permalink | safe }}| safe/&#x2F;

如果您转到http://127.0.0.1:1111/blog/，您将看到 的部分页面blog。该列表是空的，因为我们没有任何博客文章。让我们现在解决这个问题。

🔗降价内容

在该目录中，创建一个名为以下内​​容的blog文件：first.md

+++
title = "My first post"
date = 2019-11-27
+++

This is my first blog post.

标题和日期将在模板中分别显示为和。关闭下方的所有文本都将作为.blog-page.html{{ page.title }}{{ page.date }}+++{{ page.content }}

我们现在需要制作blog-page.html模板。在templates目录中，使用以下内容创建此文件：

{% extends "base.html" %}

{% block content %}
<h1 class="title">
  {{ page.title }}
</h1>
<p class="subtitle"><strong>{{ page.date }}</strong></p>
{{ page.content | safe }}
{% endblock content %}

注意| safe过滤器{{ page.content }}。

这看起来应该很熟悉。如果您现在返回我们的博客列表页面http://127.0.0.1:1111/blog/，您应该会看到我们孤独的帖子。让我们添加另一个。在目录中，让我们创建包含以下内容的content/blog文件：second.md

+++
title = "My second post"
date = 2019-11-28
+++

This is my second blog post.

回到http://127.0.0.1:1111/blog/，我们的第二篇文章出现在列表的顶部，因为它比第一篇文章更新，而且我们在文件中设置了sort_by = "date"_index.md。作为最后一步，让我们修改我们的主页以链接到我们的博客文章。

index.html目录中的文件应该templates是：

{% extends "base.html" %}

{% block content %}
<h1 class="title">
  This is my blog made with Zola.
</h1>
<p>Click <a href="{{ get_url(path='@/blog/_index.md') }}">here</a> to see my posts.</p>
{% endblock content %}

这是对 Zola 的快速概述。您现在可以深入了解文档的其余部分。