Statamic 是一个现代的 PHP CMS，它确实努力做到简单直观的使用。从其平面文件设计到对 Markdown 和 YAML 等技术的使用，您无需编写任何代码即可完成大量工作。
在本文中，我们将了解从安装到设置基本组合的过程。
采用平面文件设计，设置就像提取从 Statamic 网站下载的 zip 文件一样简单。不涉及数据库，所有内容和设置都存储在本地的许多不同文件中，这也意味着如果您使用 Git 之类的工具，您可以对所有内容进行自动备份和版本控制。
提取完内容后，我们来看看Statamic的结构。
您最有可能与之交互的文件夹或多或少有五个不同的文件夹，它们是：
除此之外，您可能不会直接接触以下四个文件夹：
每个 Statamic 站点的第一步是配置其选项。
所有配置文件都位于 _config 文件夹内，如上所述。您应该查看的主要文件是 settings.yaml。
如果您是 YAML 新手，那么您真正需要知道的是它是一种类似于 JSON 的数据格式，只不过它是一种更易于人类阅读的格式。它通过不需要任何分隔字符（如分号或引号）来实现这一点，而是通过放置和缩进获取其结构。
settings.yaml 文件有很好的文档记录，因此填写它应该不会有问题。您可能想要查看的一些选项如下：
_license_key: Enter your License Key _site_name: My Portfolio _site_url: http://localhost:7000 _theme: portfolio _taxonomy: - language _log_enabled: true _cookies.secret_key: Some Random Key
其中大部分都非常简单，例如设置许可证密钥、站点名称和 URL。 theme 选项设置要加载的主题文件夹。我们稍后会讨论这个问题，但主题本质上是您指定网站上不同页面如何工作的地方。我们将创建自己的主题，以便您可以随意命名。我选择了“投资组合”。
下一个选项是一个称为分类法的数组。如果你曾经使用过WordPress之类的东西，那么你应该知道它的用途。基本上，它允许您为每个帖子添加设置或“类型”，然后您可以使用这些分类法来过滤您的内容并为这些分组创建自定义页面。
我只添加一种分类法；语言分类，因为在我们的示例组合中，我们将指定每个作品的编程语言。您无需为每个自定义属性创建分类法。我们还需要我们的产品组合中包含其他内容，例如链接和描述。分类适用于多个条目共有的字段，以及您可能想要为其创建自定义页面的字段。
log_enabled 设置打开日志记录，因此您可以查看管理面板中出现的问题。它们将存储在我们之前看到的 _logs 文件夹中。最后我提到的最后一个选项是用于加密 cookie 的密钥。
现在可以保存此文件，但在我们开始讨论内容之前，让我们花点时间设置投资组合模板，以便我们可以看到我们正在做什么。
与大多数现代框架一样，当您加载页面时，您可以从多个可重用组件构建它。 Statamic 中的页面由 layout、template 和 content file 组成。布局文件和模板都可以选择由更多称为部分的部分组成。
layout 是放置模板的外壳。这通常用于保存样板 HTML 代码，例如 head 部分，以及使用此布局的所有页面都需要的基本主体，例如在文件底部添加公共库。
模板是单个页面的特定视图。您可以有主页模板、联系页面模板等。您不需要为每页创建一个，但我建议为每种类型页面创建一个。
在这些模板中，您可以使用实际内容文件中存储的变量。例如，假设您需要一个页面来显示您正在阅读的书籍索引，然后需要另一个页面来显示您正在观看的节目列表。您可以创建一个模板来显示对象列表，然后提取要从内容文件本身检索的列表的详细信息，而不是为每个页面复制大部分代码。
内容文件（如其名称所示）是正在显示的实际资源。这可以是一个实际的独特网页，也可以是一个博客条目。我们稍后将详细介绍这些内容。
现在，Statamic 提供了一种入门模板，为您提供了入门的基本结构，而不是手动创建所有这些不同的组件。您可以从 Github 下载主题文件夹。
只需将整个文件夹放入 _themes 目录中，并将该文件夹重命名为“portfolio”（因为这是我们在设置文件中声明的主题名称）。您还需要将js文件夹中的kindling.js文件和css目录中的kindling.css文件分别重命名为portfolio.js和portfolio.css，因为有一个特殊的标签自动拉入这些。
这就是我们现在需要的所有设置，但是为了更好地了解我所讨论的有关布局和模板的内容，让我们看一下这些文件。首先，从 layouts 文件夹中打开名为 default.html 的文件。正如您可能已经猜到的，这对应于默认布局。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>{{ _site_name }}</title>
<link rel="stylesheet" href="{{ theme:css }}">
</head>
<body>
{{ layout_content }}
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="{{ theme:js }}"></script>
</body>
</html>
就像我之前提到的，布局是放置多个页面（或更确切地说是模板）所需代码的好地方，这就是为什么此文件中的默认布局仅包含 HTML 文件的基本轮廓。现在我们还没有真正讨论过它，但 Statamic 带有自己的模板引擎，相当容易上手。基本上，您只需在想要插入内容的位置放置一个标签，类似于 Handlebars（如果您熟悉的话）。
此布局包含几个我想浏览的标签，第一个是 _site_name。该标签实际上指的是我们在 settings.yaml 文件中设置的属性。您会在整个 Statamic 中发现这种约定。您可以像这样全局设置 YAML 选项，甚至可以在每个文件的基础上设置 YAML 选项，然后只需将带有选项名称的标签放入模板中即可获取这些选项。
下一个标签实际上出现了两次，是 theme 标签。 Statamic 中的助手更像是独立的模块，因此它们可以具有附加到同一名称的多个不同功能；您可以使用冒号和所需命令的名称来访问各个函数。
theme 标签是关于加载特定于该主题的资源的。它可用于提取脚本和样式表等内容，也可用于提取图像和部分内容等内容。它是一个辅助函数，基本上允许您提供所需资源的名称，它将填充当前模板目录的路径。例如，如果你要写：
{{ theme:js src="underscore.js" }}
它将替换为当前主题 js 文件夹内名为 underscore.js 的文件的链接。默认情况下，如果没有为 js 或 css 命令设置 src 参数，它将假定您引用的是具有当前主题名称的 js 或 css 文件，这就是我们重命名这些文件以匹配的原因；这只是为了方便，所以我们不需要指定它们，并且它稍微清理了源代码。
出现的下一个标签是 {{layout_content }}。这与其他模板引擎中的 yield 类似，它基本上表示内部模板应该插入到哪里。
我想在此文件中做的最后一件事是删除 jQuery 的链接，因为我不会使用它（如果您愿意，那么您当然可以保留它）。
接下来让我们进入默认模板文件（templates/default.html）。它应该是空白的。为了便于教学，我们添加一个名为 {{content}} 的标签，该标签仅插入当前正在加载的页面的内容。
回顾一下，当您进入页面时，它会首先加载布局文件，然后无论 {{layout_content}} 标记放置在何处，都会插入此模板。然后，该模板将仅输出当前页面内的所有内容。
完成后，保存这些文件，然后让我们继续讨论内容。
Statamic中的内容默认在Markdown文件中指定，加载的默认文件名为page.md。与标准 Web 服务器在未指定文件的情况下加载 index.html 的方式相同，Statamic 将加载 page.md。
还值得注意的是，站点中的路由或 URL 链接将由 _content 目录定义。例如，如果您在 _content 目录中创建名为 demo 的文件夹，并在其中放置名为 link.md 的文件，则该文件将对应于 URL /demo/link。如果您在其中放置 page.md 文件，则导航到 /demo/ 时将会加载该文件，因为它是默认文件名。
Statamic 附带了一些演示内容，但您可以删除本示例中 _content 目录中的所有内容（或暂时将其移到一边）。
让我们从基本主页开始。在 _content 目录的根目录中，创建一个名为 page.md 的文件，其中包含以下内容：
---
title: Home
---
# Welcome to the {{title}} Page
所有内容文件分为两部分； YAML 的前言和内容。顶部（虚线之间）是您可以放置特定于此文件的标准 YAML 的位置，并且是设置选项以调整模板文件的好方法。第二部分是 Markdown 区域，您可以在其中放置实际页面的内容。您可以使用标准 Markdown 以及 Statamic 辅助标签。
此页面将加载我们刚刚设置的默认布局和模板文件，但如果您希望它使用不同的布局和模板文件，您可以使用 _layout 和 _template 在顶部的 YAML 部分中将这些指定为选项分别。
如果您在 Statamic 目录的根目录中创建服务器：
php -S localhost:7000
...然后在浏览器中导航到 http://localhost:7000，您应该会看到带有我们的欢迎消息的 H1 标记。
这就是在 Statamic 中创建页面所需了解的全部内容，如果您正在构建一个相当静态的网站，这就足够了。但对于很多网站，我们需要能够添加动态数据，这些数据可以采取博客文章、商店商品的形式，或者在我们的例子中是作品集。
Statamic 中没有数据库，因此这些类型的条目存储在 Markdown 文件中，就像我们刚刚构建的页面一样，尽管我们做了一些事情来巧妙地引入多个功能来优化事物并使其在管理员。
首先，您可以使用特殊的日期格式命名文件，以便可以按日期对它们进行排序和过滤。您可以通过在标题前添加 year-month-day 模式来完成此操作。如果您想创建一个名为“foobar”的帖子，您可以将其命名为：
2013-09-15-foobar.md
帖子需要的任何设置都位于顶部的前言部分，然后内容放置在下面。这遵循上面概述的页面格式。
虽然这很酷，但它相当于手动将帖子输入到传统系统的数据库中。还有另一种选择！
Statamic 捆绑了一个非常好的管理员，可以为您完成所有这些操作，但是为了进行设置，我们需要告诉它这种类型的条目应该具有哪些字段。这是在适当命名为 fields.yaml 的文件中完成的。
因此，对于我们的示例，让我们在 _content 目录中创建一个名为 works 的文件夹，并在 works 文件夹中创建一个名为 fields.yaml 的文件。在 fields.yaml 文件中，我们需要指定“条目”将包含哪些属性以及每个设置的单独类型。
您可以在 _config/fieldsets/ 目录中指定字段集（字段列表）并引入定义，也可以仅在此处输入定义（或者您可以同时执行这两种操作来扩展现有定义）。对于我们的简单示例，我只是将定义放在这里，因为我们不会在任何地方重用它：
type: date
fields:
language:
type: tags
display: Programming Language
required: true
description:
type: text
display: Description
required: false
link:
type: text
display: Link
required: true
content:
type: hidden
第一个属性只是告诉 Statamic 我们希望这些条目文件具有日期属性并进行适当的命名。接下来，我们打开一个名为 fields 的 YAML 对象，其中包含条目的所有属性。
第一个是 language 字段，如果您还记得的话，它是我们在 settings.yaml 中创建的分类法。在每个属性中，我们需要指定其类型（或默认为文本框）、显示文本（默认为属性名称）以及是否需要。您还可以设置其他选项，包括说明和默认值，您可以在 Statamic 的网站上查看有关这些选项的更多信息。除了这些设置之外，不同的字段类型还可以有自己的自定义选项。
对于language输入，我将其设置为使用tag类型，该类型允许您为此选项设置多个标签。它只是在管理中输入其值的不同类型的输入。您可以在 Statamic 文档或“Fieldtypes”下的官方 Statamic Cheat Sheet 中查看所有不同的字段类型。
description 和 link 几乎相同。它们都是文本框，只不过其中一个是必需的，而另一个则不是。除了您指定的字段之外，所有条目都将带有标题和内容字段。我们并不真正想要内容字段——在我们的作品中它们更像是链接——所以我将其设置为 hidden。
进入管理员界面之前的最后一步是在 works 目录中创建一个 page.md 文件。这不是必需的，但管理员将尝试从此处获取此条目类型的标题，因此最好放置它。为此，请在 works 文件夹中创建一个 page.md 文件，并将标题设置为“Works”：
--- title: Works ---
要进入管理员，我们需要首先创建一个用户。这是 config 文件夹内的一个简单的 YAML 文件。文件的名称是您用于登录的用户名，在文件中您可以配置用户的详细信息和密码。
让我们创建一个用户名为 editor 的新用户。为此，我们在 _config/users/ 文件夹中创建一个名为 editor.yaml 的文件。插入以下数据（除了您的信息而不是我的信息）：
--- first_name: Gabriel last_name: Manricks roles: [admin] email: gmanricks@gmail.com password: password --- The Editor of this Portfolio
这些专栏中的大多数都非常简单，我认为它们不需要任何解释。唯一值得一提的字段是 roles 设置。目前 admin 是唯一可用的选项，但将来您将可以在其中调整用户的编辑权限。
还值得一提的是，密码不会保留为明文形式。首次登录后，Statamic 将对密码和盐进行哈希处理，并将其包含在此处。
虚线之后的所有内容都将存储为该用户的内容，并且可以用作他们的个人简介。
现在保存此文件，如果您的 Web 服务器仍在运行，请在浏览器中导航至 /admin。这将打开登录控制台，您可以在其中输入这些属性。第一次登录时，您需要执行两次此操作，一次是对密码进行哈希处理，第二次是实际登录。
登录后，您将看到我们的页面列表。其中包括我们的主页以及“作品”条目类型。让我们看看我们的字段声明为我们做了什么。单击作品栏内的创建链接。
您应该看到一个漂亮的表单，其中包含我们指定的所有字段和标题。尝试添加一些帖子来测试一下。
存储了一些帖子后，我们已经完成了第一轮。您现在知道如何创建页面、主题、用户和条目，这是很好的第一步。但 Statamic 还可以提供更多功能。
创建一些帖子固然很好，但如果我们能够将它们实际显示在页面上那就更好了。为此，我们需要编辑默认模板。
这将是我们第一次与附带的模板引擎进行真正的交互，但不用担心，Statamic 直观的设计使其易于上手。
要查看可用标签的完整列表，您可以查看 Statamic 的文档。此示例真正需要的是 entries 标签，该标签用于从 _content 目录中的特定文件夹中提取条目。有很多可选属性，允许您按日期或按分类法甚至标准属性等条件进行过滤。我们将保持简单，只按日期列出属性（这是默认值）。
这是完整的新默认模板（templates/default.html）：
<h1>Portfolio</h1>
<table>
{{ entries:listing folder="works" }}
<tr>
<td class="lang"><p>{{ language }}</p></td>
<td class="work">
<a href="{{ link }}">
<span class="title">{{ title }} - </span>
<span class="desc">{{ description }}</span>
</a>
</td>
</tr>
{{ /entries:listing }}
</table>
在此代码中，我们创建一个表并循环遍历“works”目录中的所有帖子。这些类型的块标记可在其中放置更多 HTML，并分配新的占位符。除了提供对所有帖子属性等内容的访问之外，您还可以获得特殊的辅助变量，它们可以告诉您当前索引等信息，或者这是第一篇还是最后一篇帖子。我们不会使用任何这些变量。我们需要的只是显示标题、语言、描述和链接。但是，如果您在浏览器中加载该页面，您可能会意识到它没有显示语言，而是只显示“Array”。
这是因为我们将此属性设置为类型标记，这意味着它可以容纳多种语言。因此，即使您可能只放置了一种语言，它仍然存储在数组中。幸运的是，Statamic 带有修改器。
为了结束本指南，让我们看一下一些修改器，它们将使我们能够使该页面变得更好。
第一个也是最大的问题是让语言显示出来。如果您查看静态备忘单，一直到左下角，您将看到一个名为列出快捷方式的部分。虽然从技术上讲不是修饰符，但 Statamic 允许您将这些单词附加到列表变量的末尾，并且它将返回字符串表示形式。在这种情况下我想使用的是标准 _list 帮助程序。这样做的作用是用逗号和空格分隔数组中的多个值，这正是我们在我们的情况下想要的。
要尝试一下，请将 {{ language }} 标记替换为 {{ language_list }}。刷新您的浏览器，它现在应该可以正确显示语言。
接下来，我们为标题添加修饰符，使其全部大写。如果您曾经使用过 Smarty 模板引擎之类的东西，那么它的工作方式是相同的。您可以在变量名称的末尾添加一个竖线，然后添加一个修饰符。在我们的示例中，您只需将对 {{ title }} 的调用替换为 {{ title|upper }} ，并且这些是可链接的，因此您可以无限期地继续添加管道。
现在让我们添加一些 CSS 来设置所有内容的样式。请记住，这位于 css/portfolio.css 文件中：
body { background: #FAFAF5; }
h1 {
font: 800 64px 'Raleway', sans-serif;
margin-bottom: 28px;
}
table { font: 15px 'Coustard', serif; }
td { padding: 10px 10px 0 10px; }
p { margin-bottom: 15px; }
.lang p {
background: #CA9F53;
color: #FFF;
padding: 3px 5px;
text-align: right;
}
.work { text-align:left; }
.work a{
border-bottom: 1px solid #000;
text-decoration: none;
}
.title {
font-weight: 600;
color: #000;
}
.desc { color: #666; }
这两种字体来自 Google Fonts，因此您需要在默认布局文件的顶部添加以下链接：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>{{ _site_name }}</title>
<link href='http://fonts.googleapis.com/css?family=Coustard|Raleway:800' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="{{ theme:css }}">
</head>
<body>
{{ layout_content }}
<script src="{{ theme:js }}"></script>
</body>
</html>
如果一切顺利，您应该会看到以下页面（除了您添加的作品）：
在本教程中，我将引导您完成从安装框架到设置所有内容、创建新条目类型和构建自定义主题的整个过程。要做的事情有很多，而这一切之所以成为可能，是因为 Statamic 让事情变得如此简单。
我们已经看到了很多功能，我们甚至还没有涉及创建自己的模块以及使用 PHP 扩展 Statamic，但我认为迄今为止最令人惊奇的事情是我们不需要编写一行代码整个教程中的 PHP 内容！这是值得夸耀的事情。
所以我认为人们可能会遇到的主要问题是，“我应该使用它吗？”，或者，“这应该取代我当前的曲目中的什么？”衡量 Statamic 的用途很重要。如果您正在构建一个新的初创公司并需要一个成熟框架的灵活性，我相信您将能够让它在 Statamic 中运行，但这将是大量的自定义代码，这可能会达不到目的。我认为博客平台或 CMS 将会蓬勃发展。
来自 WordPress 背景，这感觉就像是直接继承者。它在理论上遵循许多相同的约定，但它们都是以更智能的方式实现的。比较每个项目所需的代码量就成了一个笑话。展望未来，Statamic 拥有令人难以置信的 API，用于构建自定义标签、挂钩、新字段类型等，您可以想象 Statamic 使其变得像您所期望的那样精简且简单。
我希望您喜欢这篇文章，如果您有任何问题，请随时在 Twitter @gabrielmanricks 或 freenode 上的 Tuts+ Web 开发 IRC 频道 (#nettuts) 上向我提问。
