分享这篇文章

使用自定义块,解锁 WordPress 的 Gutenberg 编辑器的强大功能。

通过使用 Advanced Custom Fields (ACF) 插件,您可以显著扩展自定义功能。在本教程中,我们将向您介绍如何在 WordPress 网站中使用 ACF 创建自定义 Gutenberg 块的过程。

安装高级自定义字段插件

要开始创建自定义的 Gutenberg 块,您需要在您的 WordPress 网站上安装 Advanced Custom Fields (ACF) 插件。如果尚未安装,您可以方便地从 WordPress 官方下载并安装该插件。 WordPress 插件目录.

创建您自己的块

接下来,导航至 自定义字段 > 添加新字段 从您的 WordPress 控制面板中输入您的块的唯一标题。随后,在“位置”框中调整规则,以便该字段组显示块与您的块名称是否匹配。

将字段添加到您的块

这一步骤涉及定义您的内容块的内容。在将内容块添加到帖子或页面时,请将字段添加到您的内容块中,这些字段将在编辑器中显示。这些字段可以是文本、图像或其他任何类型的内容。

注册您的区块

向下滚动,找到“阻止设置”部分。在这里,您可以设置阻止的名称(在代码中使用的名称)、标题(编辑器中显示的名称)、描述、类别和图标。确保选中“激活”选项,以便使该阻止成为可供使用的功能。

创建块模板

现在,是时候教导 WordPress 如何显示您的块了。为此,在您的主题目录下创建一个名为“块名称”的 PHP 模板文件。如果您的块名称为 “testimonial”,那么您的文件应该就是 “block-testimonial.php”。这个文件应该包含 PHP 和 HTML,用于显示您的块的内容。

<code><?php 
  $heading = get_field('heading');
  $content = get_field('content');
?>
<div class="testimonial-block">
  <h2><?php echo $heading; ?></h2>
  <p><?php echo $content; ?></p>
</div>

利用您的自定义块

恭喜您,您的自定义块现已准备好在古滕堡编辑器中使用!要使用它,只需创建新的帖子或页面,点击“+”按钮添加一个新的块,您就会在列表中找到您的自定义块。

请记住,要使用 ACF Blocks 功能,就需要安装 ACF Pro。而且,该功能仅适用于 Gutenberg,即 WordPress 的全新块编辑器。此外,请确保您的主题支持 Gutenberg。如果您不确定,最好向主题开发人员咨询。

通过遵循这个一步一步的指南,您可以充分利用自定义块的功能,将您的 WordPress 网站提升到一个新的水平。您可以尝试使用不同类型的字段,并创建出与您的网站独有的块。祝您愉快!

下一步

如果您喜欢这篇文章,并想学习如何继续增强您的自定义 ACF 块,请查看以下文章:

准备好迁移您的网站了吗?

首先进行免费的无义务网站评估。我们将对您的项目进行评估,推荐合适的平台,并为您提供明确的报价。

保证零数据丢失
完整 SEO 保留与重定向映射
准时且按预算交付
专业化的平台专家,而非泛泛的专家

请告诉我们您的网站信息

"*"*” 表示必填字段

此字段用于验证目的,不应更改。
姓名*