最佳原创 WordPress 块 [快速概述]

我们为您带来有关如何使用 Gutenberg WordPress 编辑器和块的指南。请阅读有关下一个 5.4 版本中即将推出的区块更改的新闻。我们选择了所有最常用的块，这些块必须在任何网站上使用。一旦发布，我们将发布有关所有功能的更多详细信息。

当 WordPress 在 2018 年宣布推出新的古腾堡编辑器时，我们感到非常兴奋。现在几年后我们看到了巨大的进步。 Gutenberg WordPress 编辑器是创建网站的绝佳工具。

古腾堡编辑器的所有标准 WordPress 块在我们的最新项目中均具有完整功能 自由的 Citadela WordPress 主题。您可以在任何网站上使用它，请 创建一个帐户 并免费下载。

和 AitThemes Citadela 插件，您可以为公司、企业、博客或非营利网站演示创建特定内容。或者甚至开始一项新的在线业务。网站速度和编辑网站的便捷性是最重要的因素。

什么是块？

古腾堡 WordPress 块是网站的构建单元。他们每个人都有自己特殊的位置和目的。对于特定类型的内容使用正确的 WordPress 块非常重要。

但是如何找到最适合您意图的块呢？

为了帮助您更好地了解 WordPress 块，我们准备了最流行的块的概述。

文本内容块

您可以使用多个块在网站上插入文本内容。您可以使用多个块。从 WordPress 5.4 开始，有一个新设置，您可以更改文本颜色。

• 段落
• 标题
• 引用
• 列表
• 引述
• 桌子
• 诗
• 预格式化

除此之外，您可以使用经典块，这对于长段落来说会更方便。

按钮块

使用按钮块在 WordPress 中创建引人注目的 CTA 按钮变得非常容易。您无需输入自定义 CSS 或了解 HTML。您可以（但不必）输入您喜欢的颜色的十六进制代码，以使按钮看起来漂亮且引人注目。

哪里可以使用按钮块？

一旦网络访问者访问您的网站，您希望鼓励他们采取行动。这就是 CTA 按钮的用途。

一般来说，有 3 个地方应该使用 WordPress Button 块：

• 主页 – 完成可实现您目标的操作，例如注册时事通讯、发现特别优惠或注册免费试用。
• 产品页面 – 根据您的产品页面的引导方式，可能有 1 个 CTA 按钮（购买）或更多按钮，例如产品详细信息、购买、添加到愿望清单等。
• 博客 – CTA 按钮可以引用另一篇有用的文章或购买您的产品/服务。

按钮块设置

在检查器的右侧，您可以轻松管理按钮的设置：

• 风格
• 背景颜色
• 字体颜色
• 边界

CTA 按钮中写入的文本应该简短明了，鼓励您希望网络访问者采取的行动。

下一个 WordPress 5.4 版本（2020 年 3 月 31 日发布）中即将发布的消息

按钮块将被新按钮替换s 堵塞。
您可以从新名称中假设，您将能够在一个块容器中一一创建更多按钮。通常需要一次创建两个 CTA，例如：立即购买和阅读更多。此外，一些新的样式和颜色设置也即将推出。选择填充或轮廓样式，然后选择背景颜色。您可以选择纯色或渐变背景。一些预设作为起点将可用于更轻松的微调。好消息是所有现有的按钮块都将正常工作，无需迁移它们。

柱块

Columns 块是一个令人惊叹的 WordPress 块，它为新布局打开了大门。它为您提供了更多页面元素排列选项，从而产生更多设计选择。

使用 Columns 块很简单：

• 无需安装额外的插件。
• 无需编码。
• 您所需要的只是一点对简洁设计的理解。

与之前 WordPress 块编辑器发布之前必须经历的麻烦相比，使用 Columns WordPress 块非常简单。

如何使用列块？

如上所述，可以通过 2 种方式使用列块：

• 组织文本的流程（在博客文章或常规页面上）。
• 将其他块排列成列。

当将文本组织成列时，例如在博客文章中，您可以提高可读性并使您的网站更加透明和用户友好。

但是，当您使用列块嵌套其他块（例如图像、文本和按钮）时，您将更改所选页面的整个布局并创建新的设计。

列块设置

将列块插入页面后，选择所需的列数。它可以是 2 到 6 列之间的任意数量。然后您可以开始输入文本或在每列中添加块。

可以为整个块以及各个列单独设置列块内容的对齐方式。您甚至可以选择列宽的比例。这样，一列就可以比另一列宽。

盖块

我们来谈谈您网站的标题。该部分定义了某人访问您的主页时的第一印象。有点重要，不是吗？您是否知道封面块可以用作任何页面上的标题？

封面是 WordPress 的核心块，可帮助您给网络访问者留下深刻的印象。尤其是当它被正确使用时，或者更好地说，当它巧妙地集成到您的网页设计中时。

盖块在哪里使用？

如上所述，封面块可以用在您的任何页面上。此外，它可以添加到页面上的任何位置，与固定在网站顶部的网站标题不同。

盖块可用作：

• 任何页面的标题，包括主页。
• 图像或视频被产品页面上使用的文本覆盖。
• 博客文章中的内容分隔符。

盖块设置

设置 Cover 块非常简单。首先，选择图像或视频作为背景。您也可以使用单一颜色。设置背景后，添加标题和副标题。 

您可以选择块的对齐方式，当然也可以选择其中文本的对齐方式。

盖块对齐提供以下选项：

• 左对齐
• 居中对齐
• 右对齐
• 宽幅
• 全屏宽度

我个人最喜欢的是检查器中可用的颜色叠加 - 封面块背景图像可以调色为您想要的任何颜色。结合定制的字体大小和颜色，您可以创建美丽的对比，封面块的最终外观将令人惊叹。

从 WordPress 5.4 开始，您可以选择渐变背景而不是纯色背景。

画廊块

使用图库块在您的网站上展示图像。这个标准的 WordPress 块旨在保存您的图像并在您网站的任何页面上很好地显示它们。与其他 WordPress 块类似，图库块可以放置在网站上或博客文章中的任何位置。

可以通过从媒体库、计算机中选择文件或使用拖放功能来上传图像。

在哪里使用画廊块？

根据网站的类型，您可能想要创建复杂的照片库或简单的图像演示。您可以在以下位置使用图库块：

• 您的主页
• 创建为照片库相册的单独子页面
• 产品页面
• 博客文章

画廊块设置

除了画廊块本身的各种对齐选项之外，该块内还有一些有趣的选项，例如：

• 图像排列的列数。
• 图像裁剪以匹配相同的尺寸（最小图像）。
• 超链接使您可以选择链接到另一个页面或媒体文件。

图像块

图像块只不过是在您的网站上显示图像的块。

这是正确的。如果您只想将图像添加到任何页面，则应该使用 Image WordPress 块。它可能与其他呈现的块相似，但存在显着差异，使其非常适合单个图像。

什么时候使用图像块？

特别是当图像上显示的对象对您的网络访问者特别重要时，应使用图像块，您希望：

• 用特定的图像吸引网络访问者的注意力。
• 显示带有标题的图像。
• 显示信息图表，帮助访问者更好地理解所讨论的问题。

图像块设置

WordPress 图像块的最大优势之一是它的图像大小选项。您可以通过拉动图像的角来轻松调整图像大小，选择固定的像素大小，或定义百分比大小。

另一个重要的选项是替代文本、标题和链接的输入字段。我强烈建议使用这些字段，因为它们在页面搜索引擎优化中发挥着重要作用。

媒体和文本块

让我们继续讨论可以使用媒体和文本块创建的更高级的页面布局。这个核心 WordPress 块允许您以美观和上下文的方式并排组合媒体和文本。

在哪里使用媒体和文本块？

尽管媒体和文本块最适合在博客文章中使用，但只要发挥一点想象力，您也可以在其他地方使用它。例如，您可以使用彼此相邻的图像和文本来创建精美的产品或服务概述。

如果用作产品/服务概述，请不要忘记将按钮块添加到媒体和文本块的文本部分。这样您就可以在任何页面上设计漂亮的 CTA 部分。

媒体和文本块的优点

• 将上下文相互契合的图像和文本结合在一起。
• 避免博客文章中的图像错位。
• 帮助提高网站的响应能力（使用“Stack on mobile”功能）。

媒体和文本块设置

当查看媒体和文本块的设置时，您会注意到相当多的对齐选项，其中一些与大多数其他块相比是独特的。

该块有趣且有用的设置是背景颜色。通过对图像和文本周围相配的区域进行着色，您可以在视觉上突出显示它们的联系。

插入 WordPress 版本 5.4 (31.3.2020) 的链接。您可以从链接、媒体文件或附件页面中进行选择。

工作台块

表块是 WordPress 在 5.0 及更高版本中引入 WordPress 块编辑器后如何改进的示例之一。之前您需要插件将表格插入 WordPress 网站，现在您可以简单地使用表格块。

在哪里使用表块？

表格在以井然有序且透明的方式提供有用内容方面发挥着巨大作用。当然，大多数网站都使用了表格。以下是在不同网站上使用表格的几个示例：

• 数据对比
• 定价表
• 产品技术细节
• 食谱
• 会员套餐概览

将 Table 块作为免费 WordPress 核心的一部分真是太棒了。

表块设置

当您将表格块插入页面时，您需要定义表格的许多列和行。别担心，这个数字不是固定的。您可以随时添加更多行和列（或删除它们）。

然后，选择表格的样式：默认或条纹。继续进行对齐和字体样式，最后填写表格，然后再进行最后的修饰。

更多选项包括：

• 背景颜色
• 固定宽度单元格
• 标头
• 页脚
• 链接（表格中的文本条目可以链接到其他页面）

接下来您想看哪个街区？

希望您喜欢阅读我们精选的非常有用的 WordPress 核心块 - 每个人都可以免费使用。请告诉我们您接下来想阅读哪些内容，或者您发现 WordPress 核心中仍然缺少哪些功能。谢谢阅读！