WordPress 主题 patterns 配置详解：从 Pattern Directory 批量导入区块模板

发布于 作者:

WordPress 主题的 patterns 配置让开发者无需重复造轮子，只需在 theme.json 中填入几行代码，就能把官方目录里的现成模板直接绑定到自己的主题中。这项功能巧妙地将“设计能力”和“开发能力”解耦——你可以免费使用全球开发者贡献的高质量区块组合，还能把自己设计的模板反向提交到官方目录，让其他主题也能调用。本文手把手拆解 patterns 配置的完整流程，包括如何查找 pattern slug、如何批量注册、以及目录分类在编辑器中的映射逻辑。

先搞懂这俩核心概念

Pattern：可以理解为“区块模板”或“组件”。它不是单个区块（比如一个段落或一张图片），而是多个区块按照特定布局组合在一起的“半成品页面片段”。比如你经常看到的那种左侧大图右侧文字的英雄区（Hero Section），或者带三个卡片的价格表，这些都属于 pattern。

theme.json：WordPress 主题的“全局配置文件”。以前主题的各种设置分散在 functions.php 和各种钩子里，现在 WordPress 推荐把主题预设、样式、设置都集中写在这个 JSON 文件里，方便维护，也方便站点编辑器读取。

patterns 属性到底是做什么的

在 theme.json 中加入 patterns 数组，等于告诉 WordPress：“我这个主题要预装官方目录里的这几个模板”。用户激活主题后，在编辑页面时打开区块插入器（Inserter），就能直接看到并使用这些模板，就像主题自带的一样。

json

{
  "version": 2,
  "patterns": []
}

上面的空数组代表不预装任何外部 pattern，只保留主题自己定义的那些。

手把手实操：从目录捞一个 pattern 过来

假设你想把官方目录里的“Hero banner with overlap images”这个模板放进自己的主题。

一步，打开官方 Pattern Directory，找到这个模板页面，浏览器地址栏长这样：

text

https://wordpress.org/patterns/pattern/hero-banner-with-overlap-images/

关键点：去掉域名和 /pattern/ 前缀，再删掉末尾斜杠，剩下的 hero-banner-with-overlap-images 就是这个 pattern 的标识符（slug）。

二步，把 slug 塞进 theme.json 的 patterns 数组：

json

{
  "version": 2,
  "patterns": [
    "hero-banner-with-overlap-images"
  ]
}

保存文件，刷新后台，打开页面编辑器，在区块插入器的 Patterns 标签页里就能看到这个模板了。

批量注册多个 pattern

你可以一次性注册多个，数组里按顺序写 slug 就行：

json

{
  "version": 2,
  "patterns": [
    "fullscreen-cover-image-gallery",
    "hero-banner-with-overlap-images",
    "mixed-shape-gallery"
  ]
}

注意：这些 pattern 的原始分类信息（比如属于 Gallery 类还是 Call-to-Action 类）会跟着一起带过来。在后台的区块插入器中，它们会自动归到对应的分类标签下，不需要你额外映射。

举个例子，上面这三个 pattern 在目录里都属于 Gallery 分类，所以你在编辑器中点开 Patterns 面板，再切到 Gallery 标签页，就能看到它们整整齐齐排在那里。

进阶玩法：反向提交自己的 pattern

如果你自己设计了一组不错的区块组合，完全可以提交到 WordPress Pattern Directory。通过审核后，它就有了一个专属 slug。之后你再也不用在每个主题里复制粘贴这套模板的代码了——只需要在 theme.json 里填上这个 slug，所有使用你主题的人都能直接调用。

这种做法还有个额外好处：其他主题作者也可能把你的 pattern 收录进他们的主题，相当于你的设计被更多人使用，而且跟你的主题是否被安装毫无关系。

技术细节补充

Pattern 分类的映射逻辑：WordPress 后台的 pattern 分类和目录里的分类是对应好的。你在 theme.json 里注册的 pattern 不需要额外指定分类，系统会自动从目录拉取分类信息。所以如果你想让自己的 pattern 出现在特定标签下，在提交到目录的时候就要把分类填准确。

性能相关：从目录加载 pattern 是走 WordPress 官方 API 的，不会把 pattern 的完整代码打包进你的主题文件，主题包体积不会变大。用户实际使用的时候，区块数据才会从官方服务器拉取并插入到页面中。

版本兼容：patterns 属性从 theme.json 2 版开始支持，如果你的主题还在用 1 版格式，记得把 version 字段改成 2。

总结

patterns 配置本质上是一个“引用列表”——你只需要提供官方目录里现成的 slug，WordPress 会在运行时自动拉取对应的模板数据。三个核心操作：查 slug、填数组、刷新后台，整个流程就结束了。对于想要快速丰富主题模板库又不想从头设计每个组件的开发者来说，这是一条低成本、高回报的路径。别忘了，你设计的优秀 pattern 也同样可以反向提交到目录，让整个生态受益。