完整站点编辑允许您使用直接来自站点编辑器的各种区块功能,构建 WordPress 站点的各个方面,从页眉到页脚。
站点编辑器允许您更改模板、模板部件,并自定义整个站点的样式。在站点编辑器出现之前,站点主要元素(如页眉、侧边栏和页脚)的设计由主题决定。使用站点编辑器,您可以自行确定站点的结构和样式。除了用于创建页面和文章内容外,您还可以使用站点编辑器和模板来创建站点的整体外观和风格。
模板编辑器允许您编辑、创建模板,并将模板分配给每篇文章和每个页面;您还可以使用常规 WordPress 区块编辑器为文章和页面设计自定义模板。
目标
完成本课程后,参与者将能够:
- 区分站点编辑器和模板编辑器的功能。
- 通过站点编辑器管理模板、模板部件和全局样式设置。
- 通过模板编辑器编辑、创建模板,并将模板分配给每篇文章和每个页面。
所需技能
如果参与者熟悉以下内容,将能从本课程中获得最大收益:
能力相关问题
- 您能否解释模板的功能?
- 您是否熟悉如何为文章或页面分配模板?
所需材料
- 在本地网络上安装 WordPress
- 区块主题,例如 Twenty Twenty-Two
演示者须知
- 在开始本课程之前创建一个本地站点将会很有帮助。
- 站点编辑器和模板编辑器简介
- 模板
- 模板部件
课程大纲
- 介绍站点编辑器的布局和功能:模板、模板部件和样式设置。
- 展示如何使用样式设置来更改整个站点的样式。
- 解释模板是由多个区块组合而成的集合,用于创建网页设计或整个页面的布局。
- 区分模板中的动态部分(内容)和可重用部分(静态组件)。
- 演示如何修改现有模板部件以及创建新的模板部件。
- 演示如何使用模板编辑器编辑、创建模板,并将模板分配给每篇文章和每个页面。
练习
- 使用样式设置更改站点的字体、背景颜色和文本颜色。
- 编辑现有模板,并更改页眉和页脚模板部件。
- 创建自定义模板,并将其用于某个页面。
评估
站点编辑器提供以下功能。请选择所有适用项。
- 模板
- 模板部件
- 页面或文章内容编辑
- 全局样式设置
答案:1. 模板;2. 模板部件;4. 全局样式设置
模板编辑器允许您……
- 使用区块构建整个站点。
- 编辑、创建模板,并将模板分配给每篇文章和每个页面。
答案:2. 编辑、创建模板,并将模板分配给每篇文章和每个页面。
管理模板时,内容通过文章内容区块显示。
- 正确
- 错误
答案:1. 正确
创建模板时……
- 如果不将可重用部分与动态部分分开,您就能获得最佳使用效果。
- 如果将可重用部分与动态部分分开,您就能获得最佳使用效果。
答案:2. 如果将可重用部分与动态部分分开,您就能获得最佳使用效果。
其他参考资料
课程示例
今天我们将进一步了解站点编辑器和模板编辑器。如果您已经安装了 Twenty Twenty-Two 等区块主题,并准备开始完整站点编辑之旅,您会发现自定义器已经消失了。但是,当您进入“外观”时,会看到一个新选项,即“编辑器”。点击“编辑器”后,您将进入站点编辑器。

在这里,您可以修改模板和模板部件,并自定义站点各个部分的样式。站点编辑器提供“显示模板列表”,如您在左侧所见,它允许用户浏览“站点”部分,包括主页模板、模板以及所有其他模板部件。这是站点编辑器界面中的重要部分,您基本上可以在这里编辑整个站点的设计。要更改当前查看的内容,请点击左上角的 WordPress 图标或站点图标。然后,您可以选择返回仪表盘、站点(即前面提到的主页模板)、模板列表和模板部件列表。

点击“样式”图标后,您可以更改整个站点的排版和颜色。如果继续向下查看,还可以选择自定义特定区块在整个站点中的外观。请注意,无论您正在编辑哪个模板或模板部件,都可以使用样式设置。点击“排版”后,您可以管理文本和链接的排版设置。您可以一键更改站点的背景颜色,或文本和链接的颜色。右上角会显示“为整个网站设置背景颜色或渐变”。

如果点击右上角的三个垂直点,您可以在编辑器设置中更改一些偏好设置:
- 聚光灯模式:突出显示您选择的区块,并淡化其他内容。
- 显示按钮文本标签:在按钮上显示文本而不是图标。
- 始终打开列表视图:默认打开区块列表视图侧边栏。

如何通过站点编辑器管理模板?点击左上角的 WordPress 图标,然后打开“模板”。模板是由多个区块组合而成的集合,用于创建网页设计。让我们打开“页面”模板。可以说,模板就是整个页面的布局,其中包括页眉区域、内容和页脚等内容。点击“列表视图”。在顶部您会看到页眉,在页面底部会看到页脚,中间则是文章内容区块。创建模板时,将可重用部分与动态部分分开可以获得最佳使用效果。动态部分是指使用该模板的每个页面上都会发生变化的内容部分。可重用部分是模板中的静态部分,会保持不变。模板不是用来发布内容的。文章或页面模板通过文章内容区块显示您的内容。顾名思义,模板是一种设计模板,可供一个或多个页面和文章使用。
开始构建新网站时,您可以编辑现有模板或添加新模板。您还可以创建自定义模板。请记住,使用模板编辑器将每个页面或文章分配给某个模板。

接下来,让我们进一步讨论如何管理模板部件。补充说明一下,模板部件最适合用于创建页眉、页脚和侧边栏等区域。
打开模板部件后,我们会看到自己创建的模板部件,以及所使用主题提供的模板部件。因此,列表底部的四个模板部件是 Twenty Twenty-Two 主题提供的模板部件。如果您在某个模板部件图标上方看到一个点,就说明该模板部件已被修改。上方的页面模板部件是我自己创建的。

最后,您可能会决定添加新的模板部件。添加新的模板部件时,您可以在常规模板部件、页眉和页脚之间进行选择。常规模板部件不绑定到特定区域。请记得为模板部件指定具有描述性的名称。

让我们看看如何添加模板部件区块。我将打开在未找到内容时显示的 404 模板。正如您所看到的,目前没有页眉。现在让我们打开列表视图。在区块组上方,我将插入模板部件区块。选择模板部件区块后,您可以选择已有的模板部件区块,也可以创建新的模板部件区块。让我们选择已有的那个,也就是我之前创建的模板部件区块。

现在,让我们讨论模板编辑器。模板编辑器允许您编辑、创建模板,并将模板分配给每篇文章和每个页面。让我们一边实践一边看看它是如何工作的。点击左上角的 WordPress 图标,返回仪表盘。点击“页面”,然后打开一个现有页面。在右侧的设置侧边栏中,您会看到分配给此页面的模板是默认模板,也就是页面模板。您也可以分配其他可用模板。准备好后,您可以编辑所选模板。

点击“编辑”后,您将进入模板编辑模式。当顶部栏中显示模板名称时,您就知道自己处于模板编辑模式。此外,编辑模板时,模板周围会出现深色边框。不过,您还有第三个选择:创建一个新的自定义模板。此时会出现提示“描述模板的用途,例如全宽”,自定义模板可以应用于任何文章或页面。您可能会决定为着陆页创建自定义模板,也可能为作品集页面创建模板。

点击“创建”后,您会看到页眉看起来有所不同,而且没有页脚。因此,您拥有一块空白画布,可以用来创建自己的自定义模板。再次提醒,模板编辑模式支持在编辑每篇文章或每个页面的内容与该文章或页面所使用的模板之间进行切换。
我们相信,现在您已经更好地了解了如何使用站点编辑器和模板编辑器。
课程总结
