在 Gutenberg 之前,我们采用过多种不同的主题开发方法。最常见的方法是为网站的不同部分创建单独的页面模板。这些模板通常非常规范,包含每个设计部分的自定义字段。例如,“案例研究”模板可能包含文本编辑器、图片库、用户评价等字段。然而,这些字段一旦被添加到模板中,就无法轻易更改。
这种方法不仅在页面布局方面受到限制,而且通常意味着每个新的基于模板的网站都需要重复努力;需要创建字段、设置模板并编写单独的组件以在前端显示。
为了适应 Gutenberg,我们需要改变我们的开发方法,了解如何创建可重复使用的组件,并接受 Gutenberg 现在为我们的新网站建设提供的灵活性。
Gutenberg 不够灵活
Gutenberg 开箱即用,拥有超过 30 个核心区块,涵盖从段落、标题和列表元素等基本内容组件到更复杂的小部件和嵌入元素等各种功能。
对于我们许多网站的构建来说,这些核心模块中有很多要么不相关,要么功能水平达不到主题的要求。我们需要一种方法来创建一套我们自己的模式,以执行与主题设计相符的特定功能。
这种程度的自由在 Gutenberg 中实属不 按行业划分的特定数据库 易。虽然 Gutenberg 提供了多个区块可以添加文本、图片和按钮,但它们本质上非常原子化,单独添加时会显示为独立的堆叠区块。我们很早就意识到 Gutenberg 的灵活性不足,需要能够构建自己的自定义区块。
我们的解决方案
多功能的设计系统
在 Gutenberg 发布之前,我们已经投入了大量时间对模式库的模式研究和可视化进行研究。
这涉及审核我们现有的几个网站和原型,以编制常用元素的线框库。
我们的设计师和开发人员继续合作,了解如何将这些元素组合成 Gutenberg 块,以及如何创建特定的块类型,以便在有限的自定义选项下,可以使单个块在不同主题之间看起来有显著差异。
一旦我们将图案分类成块,我们就可以开始构建了。
具有高级自定义字段的构建块
每个主题开发者几乎都曾接触过高级自定义字段 (ACF)。通过直观的界面,可以创建多种不同类型的字段;从基本的文本字段和内容编 混合式学习:LMS 支持线上和线下学习 辑器,到日期选择器、地图嵌入和图库字段,应有尽有。这些字段可以轻松分配到网站的不同区域,例如帖子类型、页面模板、类别和用户页面。
ACF 的最新版本ACF 区块将所有熟悉的功能扩展至 Gutenberg。您可以像在网站的其他区域一样,创建字段组并将其分配到不同的 ACF 区块中。
只需几行代码注册一个块和输出字段,即可在几分钟内创建一个基本的自定义块。使用这种方法可以轻松创建块,使我们能够专注于块的配置、输出和样式。
我们现在能够创建一套自定 电话号码业务线索 义块,它提供了 Gutenberg 的所有灵活性,但受限于主题的设