面向开发人员的 WordPress Gutenberg 教程 – 设计一个完整的网站

在这里，我们向开发人员展示了我们对 WordPress Gutenberg 教程的看法。 在推出最具革命性的更新后，大多数 WordPress 开发人员都在为之苦苦挣扎。 我们知道网站建设者正在帮助他们为客户设计精美的网站。

然而，有时建设者会使网站加载速度变慢，并且在谷歌最近的更新中，加载速度较低的网站会急剧下降。 另一方面，凭借 Gutenberg 的简单性，现在您可以使用它构建任何加载速度更快的网站。

Johannes Gensfleisch zur Laden zum Gutenberg 是德国金匠、发明家、印刷工等！ 我们不是在谈论人类古腾堡； 我们谈论的是 WordPress 平台中很棒的块编辑器 Gutenberg。

这是 WordPress 平台的最新块编辑器，它已经席卷了网站建设体验。 有了古腾堡，编辑和定制网站比以往任何时候都容易。

使用 Gutenberg，您还可以从头开始创建网站。 而且您无需知道编码即可在古腾堡工作。 Gutenberg 具有超级简单的功能，即使您是新手，也可以帮助您开发网站。

但是，如果您知道如何使用古腾堡 WordPress 块编辑器构建网站的详细过程，那么整个体验对您来说会变得更容易。 有了这个想法，我们将为开发人员编写详细的 WordPress Gutenberg 教程。

在详细了解如何使用古腾堡创建网站之前，我们想更多地讨论古腾堡的好处。 它将阐明古腾堡的重要性以及它如何对开发人员真正有用。

为什么要使用古腾堡来创建网站？

下面，我们将讨论为什么使用 Gutenberg 来创建网站很重要。 我们将向开发人员说明使用 Gutenberg 将获得的好处。

轻松定制

有了古腾堡，网站的定制变得非常容易。 Gutenberg 具有许多易于导航的功能，可帮助您轻松自定义网站。 想象一下，您不需要编写一行代码，仍然可以拥有一个出色的网站。 这可以在古腾堡的帮助下实现。

强大的插件

Gutenberg 附带了许多强大的插件。 这些插件使整个古腾堡体验更容易导航。 这些插件具有不同的功能，当您从头开始设计网站时，这些功能非常重要。 通过集成适当的插件，您将能够轻松创建令人惊叹的网站。 例如，在本文中，我们将展示如何将 Toolset Blocks 之类的工具与 Gutenberg 结合使用并创建一个高质量的网站。

简单的工作流程

有了古腾堡，整个工作流程将非常无缝。 编辑器旨在让每个人都更轻松。 借助插件的不同功能和附加选项，您将拥有一个非常简单和结构化的工作流程。

非开发人员友好

有了古腾堡，非开发人员也可以获得好处。 编辑器的整个过程使非开发人员能够进入网页设计。 具有许多功能和块，即使您不知道如何编码，您仍然可以想出一个高质量的网站。

WordPress 兼容性

Gutenberg 与 WordPress 的兼容性非常突出。 该工具的整体工作流程也与 WordPress 非常相似。 与 WordPress 工作流程的相似性使古腾堡立即流行起来。 以至于许多主题开发人员开始制作仅与古腾堡兼容的主题。 对于 WordPress 的整体胶冻，Gutenberg 已成为使用 WordPress 的个人的首选编辑器之一。

这些就是古腾堡作为 WordPress 社区中强大的编辑器越来越受欢迎的原因。 在下文中，我们将研究古腾堡的不同元素和范围，并指导您如何使用古腾堡编辑器创建网站。

关于如何使用块构建自定义网站的 WordPress Gutenberg 教程

为了实际演示如何使用 Gutenberg 构建自定义网站，我们将开发一个演示网站，让您更容易理解。 整个学习体验将涵盖以下主题。

• 如何使用 Gutenberg 在 WordPress 中添加、编辑、移动和删除块？
• 如何使用 Gutenberg 并排显示内容？
• 关于浏览不同块的古腾堡 WordPress 教程。
• 使用 Gutenberg WordPress 在块编辑器中显示字段。
• 面向开发人员的古腾堡教程，了解如何显示图片库。
• Gutenberg WordPress 教程，用于使用 Gutenberg WordPress 设置样式块。
• 如何使用 Gutenberg WordPress 控制排版？
• WordPress Gutenberg 开发人员创建模板教程。
• 关于添加自定义搜索的古腾堡 WordPress 教程。

通过学习这些详细的元素，您将更容易理解如何使用 Gutenberg WordPress 构建网站。

如何使用 Gutenberg 在 WordPress 中添加、编辑、移动和删除块？

首先，让我们了解如何创建和删除块的基础知识。 Blocks 是一种全新的网站构建方式，但它应该只需要几分钟就可以适应它们。

1. 在页面或帖子上，单击 + 按钮。
2. 搜索并单击要使用的块以插入它。

古腾堡的积木实际上就是积木！ 所以第一个学习是关于如何使用 Gutenberg 在 WordPress 中添加、编辑、移动和删除块。 为此，您必须执行以下操作：

• 在页面或帖子上，单击“+”按钮。
• 查找您要插入的块并单击它开始。

• 添加所需的块后，您可以在块上输入内容。 例如，我们可以为博客添加一个标题，我们将为这个块提供一个标题。
• 如果您查看任何块的左侧，您会注意到一组控制博客位置的句柄。 您可以使用这些控件集根据您的要求在块中移动。

• 从右侧的侧边栏中，您可以根据需要修改块。 在此编辑器中，您可以修改所选块的颜色、图像大小和文本对齐方式。
• 通过单击三点选项，您可以获得该块的其他选项。

如何使用 Gutenberg 并排显示内容？

如果您正在设计一个网站，您可能希望并排显示内容。 您可以使用 Gutenberg 块编辑器轻松完成此操作。 要在网页上并排显示内容，我们建议使用 Gutenberg 中的列块。 为此，您必须执行以下操作。

• 单击 + 按钮并搜索列块。
• 找到后，点击块，页面上就会出现列。

• 插入块后，您将能够看到可以与内容并排编辑的块。
• 如果您想增加列数，您可以通过选择列块并从右侧边栏中调整数字来轻松实现。
  

关于在不同块中导航的 WordPress Gutenberg 教程

如果您正在处理特定块并想要进入另一个块进行自定义，您可以使用编辑器最顶部的块导航按钮轻松完成。 当您使用详细模板并在不同块之间导航时，您可以使用导航菜单在其他块之间导航。

使用 Gutenberg WordPress 在块编辑器中显示字段

在处理不同块时，您可以向块的不同字段添加附加信息。 例如，您可以从帖子字段中添加信息，例如标题、正文等。 您还可以包括来自您已经创建的不同块的字段。

一般来说，字段的显示方式主要有以下三种； 我们将在下面详细说明。

从块的字段值中引入内容

属于工具集块库的每个块都让您可以自由地设置字段中的内容。 您可以提供任何标题文本以从帖子字段中获取或使用工具集自定义字段。 为此，您必须按照以下步骤操作：

• 创建一个新的内容模板。
• 选择您希望显示的自定义帖子类型。
• 选择“+”按钮
• 添加工具集标题块

• 打开动态标题文本框

• 选择您希望显示的帖子字段。 在给定的示例中，我们选择了帖子标题。

从现在开始，您将能够查看和更正与特定自定义帖子类别相关的所有帖子的标题。

将字段显示为单个块

通过以下步骤，您还可以将字段显示为单独的块。 为此，您必须执行下面提到的简单步骤：

• 选择单字段块
• 从位于“字段类型”下方右侧的栏中，选择“标准字段”选项。
• 从 Post Field 选项下方，选择 Post Content (Body) 选项。

现在可以在每个字段下方看到相关描述。

在一个块中使用文本在字段之间创建混合

如果您想在网页上创建混合字段和文本，您也可以使用 Gutenberg WordPress 来做到这一点。 请执行以下步骤。

• 点击“+”按钮
• 选择字段和文本块

• 写下您要包含的标签。
• 您还可以从图标中选择您希望添加的内容类型。 例如，您可以添加字段、表单，甚至是条件输出。 在给定的示例中，我们添加了一个字段。
• 然后继续选择您喜欢添加的内容，然后单击插入简码。

WordPress Gutenberg 开发人员如何显示图片库教程

如果您想使用 WordPress Gutenberg 创建图片库，您可以轻松完成。 为此，请按照下列步骤操作：

• 从块选项中，选择重复字段/图库块。
• 选择块后，您可以修复您希望显示的自定义字段组。
• 然后您可以选择要显示的自定义字段。

这样做之后，您将能够轻松地将图片库添加到您的网页中。

使用 Gutenberg WordPress 设计样式块的 Gutenberg WordPress 教程

样式和自定义块是网页设计的一个组成部分。 使用 Gutenberg WordPress，您可以使用 Gutenberg 非常轻松地对块进行样式设置。 按照我们将详细说明的指南，您可以更改博客的字体、颜色、背景和页边距。

使用界面设计样式块

• 选择您要自定义的块。
• 从侧边栏中，展开样式设置选项。
• 您可以自定义不同的选项，例如背景颜色、边框、填充以及网站的更多内容。

使用容器块

如果您使用的是工具集块，则可以访问容器块。 您可以使用此选项将某些块归类到一起，并为所有这些块选择一种特定的样式。 从右侧边栏中，您将获得使用可用样式选项来设置块样式的选项。 如果您将多个块一起设置样式，则此选项适用。

如何使用 Gutenberg WordPress 控制排版？

当您使用工具集块时，只需导航到“排版”部分即可设置将在您的网站上显示的字体的样式和格式。 从排版部分，您可以自定义字体的以下元素。

• 字体的类型、大小和样式
• 使用大写、大写和小写选项转换文本
• 改变文本的颜色
• 为文本添加阴影

WordPress Gutenberg 开发人员创建模板教程。

模板是任何网站的基本元素。 因此，非常需要知道从哪里可以自定义网站模板。 创建模板意味着您页面的所有帖子和自定义帖子都将遵循模板中的设计和布局设计。 要创建特定模板，请执行以下操作：

• 导航到工具集 > 仪表板选项。
• 单击要设计的帖子类型的创建内容模板。
• 与上一次类似，您可以从向模板添加字段开始。 从示例中，您可以看到我们如何添加多个不同的块，包括标题、图像、单字段块字段等。

• 保存并发布模板后，所有相关帖子将具有相同的设计和布局。 这个工具有助于创建一个模板，将大量块和元素一起定制。

关于添加自定义搜索的 WordPress Gutenberg 教程

通过在您的网站上添加搜索选项，您的访问者将能够轻松找到内容。 他们可以使用此搜索选项来查找他们正在寻找的内容和元素。 要添加自定义搜索，您必须执行以下步骤：

• 在您的页面上插入视图块。
• 在视图创建向导中，启用搜索选项。

• 在块中，您可以从编辑区域添加搜索字段和搜索按钮。 如果需要，您也可以自定义它。

• 从右侧边栏中，您可以向该选项添加更多字段设置、标签和样式。 完成必要的自定义后，您将获得一个视觉上吸引人的搜索部分。

这些是您可以完全从头开始使用古腾堡设计网站的不同步骤。 您可以从教程中看到，这是您网站的易于使用的页面构建器之一。 我们相信，如果您为开发人员练习我们的 WordPress Gutenberg 教程，您可以像以前一样轻松地构建任何网站。

我们希望您发现这篇文章有价值且有用。 不要忘记查看我们的博客。