定制古腾堡积木指南

已发表: 2022-11-08

前言
什么是自定义古腾堡积木?
何时使用自定义古腾堡块
使用自定义 Gutenberg 块的替代方法
- 块模式或可重复使用的块
- 代码块
如何创建自定义古腾堡块
- 自己编码
- 使用插件
无论您在建造什么,我们都可以提供帮助

如果你迟到了 WordPress 派对,块.

WordPress 不断发展和改进 Gutenberg 体验,这导致许多开发人员询问他们是否应该创建自定义 Gutenberg Blocks。

在这篇文章中,我们将了解自定义块的工作原理、何时使用它们、构建网站的替代选项以及如何构建 Gutenberg 块。

什么是自定义古腾堡积木?

块是在 WordPress 中构建页面和帖子的基本单元。 WordPress 在 2018 年引入了具有 Gutenberg 编辑体验的块。WordPress 包含许多默认内容类型块,包括帖子标题、图像和画廊。 此外,插件还会为您的编辑体验添加自己的块。 例如,一些最新的 WooCommerce 版本引入了新块,以便更轻松地将产品和电子商务功能添加到 WordPress 中的任何页面或帖子。

创建自定义 Gutenberg 块使您可以在任何页面上使用该块或在您的网站上发布。 例如,您可以创建一个提取并显示客户推荐的块。

24/7 WordPress 支持

来自真正的 WordPress 专家

学到更多

如果你一直不愿意完全接受积木,那你就错过了。 所有最新的 WordPress 功能都专注于改善块编辑器的体验。 您需要使用块来利用许多最近和即将推出的 WordPress 功能

下载我们关于开始使用完整站点编辑的电子书,以了解有关如何使用块来构建和编辑整个站点的更多信息。

何时使用自定义古腾堡块

当现有的块选项不符合您的需求并且您无法通过插件或主题找到可行的替代方案时,您可以创建自定义 Gutenberg 块。

创建自定义 Gutenberg 块通常不是适合初学者的项目。 编写自己的自定义 Gutenberg 块的两个最常见原因是在开发插件或创建自己的主题时。

构建块不是大多数人为单个网站承担的项目,除非它是具有专门开发人员或开发团队的企业级项目。 我们正在分享一些替代方法,如果您只需要一个站点的自定义块,它们可能会更好。

使用自定义 Gutenberg 块的替代方法

在完成所有确定自定义块的工作之前,请考虑这些替代方案之一是否适合您。

块模式或可重用块

如果您不需要引入动态内容并且真的只是想要一个块来复制布局,请改用新的块模式功能或可重用块。 此选项对初学者友好,只需很少甚至无需编写代码即可完成。

模式就像一个迷你模板,您可以在网站的任何地方使用。 您可以将其插入页面,然后进行编辑。 可重用的块以类似的方式工作。 最大的区别在于在页面或帖子上使用它们后如何处理它们。

模式是一个起点。 一旦它出现在页面上,您所做的任何修改都是该页面独有的。 如果您稍后更改模式,它不会更改它已在使用的位置。

可重复使用的块保持相互链接。 如果您更新块,更改将应用​​于您使用该块的每个地方。

代码块

使用代码块在页面上插入自定义代码。 主题和插件开发人员创建自定义块以跨多个站点使用。 如果您在单个站点上工作,则可以通过添加自定义代码片段在更短的时间内完成相同的目标。 这两种选择都需要相同水平的技术专长。

可能值得考虑构建自己的自定义块的一种情况是,如果您是想要将网站移交给客户的开发人员。 客户端可能能够使用 Gutenberg 编辑器使用您的自定义块,但在尝试编辑您的代码时会完全迷失。

如何创建自定义古腾堡块

您有两个选项可用于创建自定义 Gutenberg 块。 您可以自己编写代码或使用块创建插件。 这两个选项都需要一些编码。 在尝试之前,您需要复习一下 Web 开发基础知识。

自己编码

构建自定义块需要开发经验。 如果您想坚持使用所见即所得的编辑器,并且在您不小心单击显示代码选项时心跳加速,那么这不适合您。

创建自定义块需要 HTML、CSS、JavaScript 和 React 的中级知识。

首先设置您的开发环境和工具。 你需要一个 WordPress 环境、Node、NPM 和一个代码编辑器。 之后,按照本教程从官方 WordPress 块编辑器手册创建您的第一个块

使用插件

如果您熟悉 HTML、CSS 和 JavaScript,但还没有准备好从头开始编写所有代码,请考虑使用插件方法。 当您需要在单个网站上使用自定义块时,使用插件创建自定义块是一个不错的选择。

Genesis Custom Blocks 插件是最流行的用于创建自定义块的插件。 您将使用熟悉的 WordPress 界面创建块字段。 设置字段后,您需要提供 HTML、CSS、JavaScript 和 PHP 模板以使块工作。

即使它更容易,它仍然需要一些编码。 不同之处在于,您无需设置本地开发环境即可通过 WordPress 管理员完成所有操作。 该插件还可以更轻松地测试和预览块,以确保其正常工作。

无论您在建造什么,我们都可以提供帮助

无论您如何构建您的网站,使用自定义块,或者如果您仍然使用经典编辑器,您都需要一个可靠的主机。 Pressable 很自豪能够成为 WordPress 最适合从个体企业家到高级开发人员团队的每个人的地方。

Pressable 提供易于使用的界面、顶级的安全性和极快的速度。 使用 Pressable 的托管,您的网站将易于更新,并且易于客户查找和使用。

立即注册并开始构建您的网站或了解有关转移现有网站的更多信息。 我们很乐意帮助您迁移您的网站!

网络性能

加载时间很重要! 你知道你的网站有多快吗?

学到更多