模板是主题开发最重要的方面之一。它们是组合在一起的文件,用于表示出现在网站前端的文档结构。当与全局设置和样式(theme.json)结合使用时,您可以最终创建一个独特的设计供自己、客户使用或与世界分享。

模板决定了您如何在主题中放置内容的位置。

想在网站底部添加一个巨大的页脚吗? 您可以通过在模板底部的组块(Group block)中添加特定块来实现这一点。

想在内容区域旁边添加侧边栏吗? 没问题。您可以在一个或多个模板中放置列块(Columns block)来创建该布局。

在模板简介中,您获得了有关 WordPress 模板系统工作原理的广泛概述。在本文档中,我们将更深入地探讨模板本身。

模板是如何工作的?

每当有人访问您的站点上的任何页面时,WordPress 都会查看 URL,在后台运行一些逻辑,并确定访客正在查看哪种类型的页面。这无论如何都是对其的非常简化的解释。对于主题开发来说,您不需要深入了解此过程部分如何工作——只需要了解最终结果即可。

一旦 WordPress 确定了页面类型,它就会运行其“模板加载器”,该加载器会搜索与页面类型匹配的模板。它通过尝试在页面类型的模板层次结构中查找模板来完成此操作,有关详细信息请参阅模板层次结构文档。

WordPress 将按照优先级顺序在层次结构中搜索模板。如果它在这些位置中的任何一个找到匹配项,它将停止搜索层次结构:

  • 数据库中用户保存的模板。
  • 子主题的 /templates 文件夹中的模板(如果启用了子主题)。
  • 主题的 /templates 文件夹中的模板。

一旦在层次结构中找到了与页面类型匹配的模板,就会加载该模板。然后解析其块标记,WordPress 输出浏览器使用的结果 HTML 标记。

模板中有什么?

块主题模板完全由块标记组成。仅此而已。真的。

好吧。这稍微复杂一些。您通常会在块模板中看到这些东西:

  • 块标记
  • 对模板部件的引用
  • 对块模式的引用

最终,所有这些仍然是块标记。

以下是 /templates/404.html 模板文件的示例,其中包含所有这三项内容:

<!-- wp:template-part {"slug":"header","tagName":"header"} /-->

<!-- wp:group {"tagName":"main","layout":{"type":"constrained"}} -->
<main class="wp-block-group">
	<!-- wp:pattern {"slug":"twentytwentythree/hidden-404"} /-->
</main>
<!-- /wp:group -->

<!-- wp:template-part {"slug":"footer","tagName":"footer"} /-->

当然,块模板可以比这更复杂。重点是块模板必须完全由块标记组成,以便 WordPress 正确解析代码并将其输出给浏览器。

若要深入了解块的架构,请查看块编辑器手册中的关键概念文档。

组织模板

对于块主题,您只能在一个位置放置块模板:在主题的 /templates 文件夹中。其结构应如下所示:

  • templates/
    • 404.html
    • archive.html
    • author.html
    • home.html
    • index.html(必需)
    • page.html
    • singular.html

必需的最低模板文件是 index.html。此文件的存在方式使 WordPress 确定主题是否为块主题。

除此之外,您可以包含尽可能多或少量的模板以实现您的主题设计。

从技术上讲,如果主题中存在 /block-templates 文件夹,WordPress 也会在其中查找。这是为了与旧版 WordPress 版本向后兼容。但建议使用 /templates 文件夹而不是它。

构建模板

虽然您可以在模板文件中键入所有块标记,但这并不是使用块主题时的典型体验。在大多数情况下,您将从视觉界面工作并将您的块代码迁移到模板文件中。

若要探索与视觉界面的协作,请阅读有关使用站点和模板编辑器的支持指南:

编辑模板

要从 WordPress 管理界面访问模板,请在管理菜单中打开外观 > 编辑器菜单。然后单击侧边栏中的模板项目:

站点编辑器中的 WordPress 模板界面,左侧显示模板选项,右侧显示预览面板。

此屏幕列出站点的现有所有模板,这些模板可能来自三个位置:

  • 保存在数据库中的用户创建的模板
  • 主题 /templates 文件夹中的模板
  • 插件动态添加的模板

从那里,您可以对现有模板进行自定义调整,将块调整为您的喜好。

请记住,如果您保存这些内容,它们将存储在数据库中,并将覆盖您主题中的任何模板。如果您计划将此主题分发给其他人或在另一个站点上使用,则必须按照模板简介中的说明将块标记复制到 /templates 文件夹中的匹配模板。

添加新模板

您可以通过单击添加新模板(Templates标题旁边的+图标)来创建新模板。这将创建一个模态覆盖层,如下图所示:

WordPress 添加模板模态框覆盖站点编辑器。

从那里,您将能够创建完全自定义的模板(如果尚未存在用于编辑的模板)。

同样,您通过编辑器添加的任何新模板都保存在数据库中。如果您打算分发主题,则必须在 /templates 文件夹中创建模板文件并将块标记复制到其中。请确保您的模板文件名与模板层次结构中的有效文件名匹配(例如,主页模板的文件名为 home.html)。

自定义模板

自定义模板是您可以分配给单个帖子、页面或自定义帖子类型条目的模板。它们用于站点前端的单篇帖子视图。

您或您的主题用户可以从帖子编辑器侧边栏中的帖子/页面面板的模板设置中选择自定义模板:

带有模板选项在侧边栏中打开的 WordPress 帖子编辑器。空白模板选项被突出显示。

这是一个强大的功能,可以让您为特定情况创建独特的设计。例如,您可以添加一个简单的不同布局(包含联系表单)或复杂的新闻杂志布局(包含多个帖子查询和其他部分)。

从模板屏幕添加新模板时,您还可以创建自定义模板。从添加模板覆盖层中,有一个名为自定义模板的选项。单击它将在站点的数据库中添加工具自定义模板。

但是,若要随主题分发您的模板,则必须将其添加到主题 /templates 文件夹中的自定义模板文件。

自定义模板的好处是文件名可以是您想要的任何名称。只需确保不使用模板层次结构中标准模板文件名的名称,以确保其唯一性。

由于自定义模板可以是任何东西,因此没有关于应包含哪些块标记的确切规则。但是,如果您要显示帖子或页面内容,请确保在其中某处使用“帖子内容”块。

唯一的另一个规则是必须通过 theme.json 文件注册您的模板。如何执行此操作在自定义模板文档的全局设置和样式章节中涵盖。

最初,自定义模板被称为“页面模板”。这是因为该功能仅在初始实现中仅适用于页面。最终,帖子和其他自定义帖子类型可以使用此功能,因此它被重新命名为“自定义模板”。但您可能会在其他文档或第三方网站上看到这些术语为页面模板。