WordPress 块:深入指南

已发表: 2021-10-02

WordPress 块是 WordPress 拖放式 Gutenberg 网站编辑系统的主要组件。

学习使用积木的最简单方法是通过动手练习,但了解积木是什么以及它们可以为您做什么可以使您的页面构建更加高效甚至有趣。

无论您是刚开始制作 WordPress 网站还是希望培养一些高级技能,本指南都会教您更多关于什么是块、人们使用哪些常用块、如何使用它们以及可以改进您的网站的其他信息。

了解更多:WordPress 网站设计:如何从头开始创建 WordPress 网站

目录

什么是 WordPress 块?

WordPress 块是文本、媒体或自定义代码的谨慎元素,您可以使用 WordPress 的 Gutenberg 编辑系统将它们添加到博客文章或网站页面。

什么是 WordPress 块?
图片来源

大多数人专注于将它用于博客,但它适用于许多网站上的大多数其他页面。

WordPress 块的存在是为了通过消除手动编码每个元素的需要来简化创建对读者来说看起来不错的帖子和页面。 相反,您可以拖动和重新排列每个块以自定义页面的外观。

每个块在功能上都是页面上的一个自包含元素,因此更改一个块不会修改其他块。

这不是市场上唯一的块类型编辑系统。 一些竞争服务,如 Ghost,也有强大的编辑器,可用于创建网站。

然而,Ghost 主要是一个博客平台,它的编辑器专注于这一点,而 WordPress 的编辑器也有助于在您的网站上创建非博客页面。

这些块也不同于另一个内容管理系统 Drupal。

Drupal 专注于可以出现在网站多个部分的块,而 WordPress 专注于页面的各个部分。

您可以很容易地复制内容,但块本身没有链接,并且在您编辑时不会全部更改。

了解更多:登陆页面设计:10 个鼓舞人心的高转化登陆页面

古腾堡的历史

Gutenberg 是 WordPress 的当前编辑器。

它最初于 2018 年推出,从那时起发展成为一个更成熟的系统,能够为网页和博客文章提供快速而强大的编辑。

它还没有完成,因为开发人员希望将它用于完整的站点编辑,但它现在的功能比发布时要多得多。

WordPress 块:古腾堡的历史
图片来源

古腾堡的存在是因为许多 WordPress 用户希望拥有一种更简洁、更简单的博客方式,而无需编辑代码以使一切看起来都很好。

在这里,必须了解 WordPress 吸引了许多临时用户,其中很多人几乎没有编码知识。

这与早期的互联网截然不同,那时除非您拥有相对先进的编码知识,否则您甚至不会拥有网站。 换句话说,WordPress 希望支持休闲市场,在这种市场中,点击和拖动过程更有意义。

古腾堡的第二个考虑因素是人们写博客的方式和地点。

一些网站所有者使用文本转语音系统而不是手动写出内容,而拖放编辑系统使在智能手机、平板电脑和其他设备上创建网站变得更加容易。

但是,有些人仍然喜欢旧的编辑系统。 这并不奇怪,因为它仍然为能够管理其代码的用户提供更多的控制和支持。

Gutenberg 是一个功能强大的编辑器,但出于必要,它限制了用户可以做的一些事情。 没有什么比纯编码更灵活了,但 Gutenberg 更快、更容易满足大多数需求。

了解更多:转化率优化:完整指南

在经典编辑器和块编辑器之间切换

WordPress 知道灵活性通常比强迫每个人使用一个系统要好,这就是为什么您可以在其经典和块编辑系统之间切换。

在大多数情况下,您需要成为站点管理员才能在编辑视图之间切换。

但是,一旦您使用正确的帐户登录,您就可以在修改每个页面时通过单击屏幕顶部的按钮来更改每个页面上的编辑器。

这是大多数用户需要知道的全部内容,但您可以进一步自定义内容。

WordPress 块:在经典和块编辑器之间切换
图片来源

许多 WordPress 插件允许您使用像 Gutenberg 这样的拖放界面来构建页面,但您可能更喜欢这种方式。 他们通常也提供古腾堡没有的编辑选项。

Divi builder、SeedProd 和流行的、易于使用的 Elementor 等插件提供了 Gutenberg 提供的块之外的编辑系统。

这些插件通常包含调整大小的工具、多部分组件和增强的模板,可进一步减少创建页面的过程。

外部插件对非博客页面很有帮助,这是 Gutenberg 经常掉线的地方。 它可以做很多这样的页面,但目前还没有与其他系统相同的灵活性。

了解更多:客户旅程地图:最佳实践 + 就绪模板

如何禁用古腾堡

您可以为特定用户禁用古腾堡吗? 可以完全禁用吗?

两者的答案都是肯定的。 如果您不想在您的网站上使用古腾堡,有几种方法可以禁用它。

通过安装插件禁用古腾堡

第一种方法,对于大多数用户来说是最好的,是使用经典编辑器插件。 这是 WordPress 团队的官方插件,在网站上有数百万的活跃安装。

WordPress 块:通过安装插件禁用古腾堡
图片来源
图片来源

经典编辑器允许您为每个用户设置默认编辑器,允许用户选择一个编辑器,并附带一些附加功能以简化操作。

这在技术上并不是禁用古腾堡,而是隐藏它,但实际结果是一样的。 或者,从另一种意义上说,安装 Classic Editor 是明智的,因为它可以让您使用任何您想要的编辑器,这比一直使用一个编辑器要好得多。

基于社区的替代方案使用 Disable Gutenberg 插件,它不如 Classic Editor 流行,但不依赖于官方支持。

这是完全禁用古腾堡或为特定页面、帖子类型、角色或站点上的主题禁用它的直接而实用的方法。

要安装任一插件,步骤很简单:

  1. 登录您的 WordPress 界面
  2. 在左侧,选择“插件”
  3. 在展开的插件屏幕上,选择“新建”
  4. 在顶部的搜索字段中,输入您想要的插件名称
  5. 从结果中选择您想要的插件,然后单击“立即安装”按钮
  6. 完成后,单击“激活插件”

通过编辑functions.php禁用古腾堡

最后,您可以修改站点上的functions.php 文件以直接禁用某些功能。

但是,如果操作不当,这最终可能会破坏您的网站,因此我们不建议临时用户使用此方法。 安装上面列出的插件之一既简单又容易逆转。

如果您想在没有插件的情况下禁用 Gutenberg,并且您是 WordPress 代码的初学者,您可以按照以下步骤操作。 此方法为所有用户禁用它。

  1. 登录您的 WordPress 界面(您需要成为管理员)
  2. 在左侧边栏中找到“外观”并将鼠标悬停在它上面
  3. 选择“主题编辑器”
  4. 在右侧的文件列表中,选择“functions.php”
  5. 之前复制您的functions.php文件作为备份,以便在出现问题时可以恢复它
  6. 当编辑器弹出时,准确复制以下内容并粘贴到文件中: add_filter( 'use_block_editor_for_post', '__return_false' );
  7. 单击下面的更新文件按钮

了解更多:热图解释 + 如何制作网站热图

WordPress 块的常见类型

以下是基本 WordPress 编辑器中最常见的块类型。

WordPress 块
动图来源

在古腾堡之前,大多数人直接对这些块进行编码,或者使用富文本编辑器的文本和图像格式化工具,并根据需要重新排列代码以调整页面上的布局。

段落

这是大多数人使用最多的块。 顾名思义,它专注于书面内容。

文本编辑器将每个段落转换为一个块,因此您可以在编写它们后移动和重新排列它们。

图片

图像嵌入块包含可以在页面上移动的单个图形。

这些带有各种对齐选项,包括调整图像大小甚至全宽,超出了主题的通常限制。

图片来源

段落和图像块一起足以创建一个基本的网页,所以其他一切最终都只是为了迭代和改进这些元素,遵循基本的视觉层次结构原则。

标题

标题块包含超大文本以将页面分成多个部分,并使用户更容易找到内容。 编辑器允许您根据需要调整标题大小、格式、超链接和其他元素。

WordPress 最多支持 6 个标题级别,包括页面标题的 h1,但大多数人很少超过 h4。

画廊

图库块是基本图像块的高级版本,可让您以预定布局添加多张图片。

当前编辑器最多支持八列图像,以及页面的调整大小、链接和其他格式选项。

列表

列出块创建的编号或项目符号列表。

这本质上只是段落块的应用,但是将列表分成自己的组件可以更容易地避免意外修改格式。

引用

引用块是特殊格式的段落块,有助于指出特别重要的内容。

动图来源

大多数人使用这些来引用特定人的报价,但您也可以使用它们来提供评论或以其他方式突出重要信息。

声音的

音频块在网站上相对较少,但 WordPress 仍然支持它们。

这些允许您添加任何音频文件,包括自动播放音频或循环播放等功能。

请记住,大多数用户不喜欢自动播放的音频,除非他们希望发生这种情况,因此请尽量避免让访问者感到意外的噪音。

覆盖

封面块是一种更高级的格式化元素。 此块可让您选择可以覆盖在页面上的图像或视频,有时还包括文本。

图片来源

这种媒体可以漂浮在背景中,重复,或者作为一个即时的关注点。

WordPress 支持在叠加层上不透明或完全透明,但建议使用适度的数量以确保您的文本易于阅读。

文件

文件块可让您提供指向网站上文件的直接链接,以便访问者可以下载它们。

您几乎可以将任何类型的文件上传到您的站点,但如果您尝试上传太大的文件或为您的计划获得太多下载,您的托管服务提供商可能会遇到问题。

这是 Web 开发相互关联的一个很好的例子。

如果您只让人们下载基本的文本文件,但在添加任何其他文件之前与您的网站主机交谈,您可能不会违反限制。 他们可以告诉您计划中允许的内容或根据需要建议替代方案。

视频

视频块让您可以将多媒体内容添加到您的网站,方法是直接上传或链接其他网站上的内容。

图片来源

视频文件往往非常大,因此如果您想在您的网站上拥有这些文件,通常需要一个好的托管计划。

在外部托管,例如通过 YouTube 和使用 YouTube 嵌入, 容易得多。 Gutenberg 会根据需要自动将一些视频链接转换为不同类型的块。

如何使用 WordPress 块

有多种方法可以在 Gutenberg 编辑器中添加块。 您可以直接从顶部图标栏添加它们,或者单击插入器按钮。

此按钮看起来像一个带有加号的圆圈,可让您单击要添加的块类型。

块出现在页面上后,您可以通过单击块左侧的箭头来上下移动它们。 或者,您可以单击六个点的网格并按住鼠标按钮,然后将块拖动到您想要的位置。

如何使用 WordPress 块
图片来源

要编辑块,只需单击它们的空间。 这将自动打开块信息并让您根据需要调整组件。

您可以使用相同的功能来更改块的类型。 控制面板中的箭头可用于展开或关闭编辑器的各个部分,而 X 按钮可让您关闭块编辑器并专注于其他内容。

WordPress 块和小部件之间的区别

块主要是网页内容,包括文本和媒体,如图像和音频。 那么,什么是 WordPress 小部件,它与块有何不同?

相比之下,WordPress 小部件是您可以放置​​在侧边栏和页脚等特殊区域的内容。 Gutenberg 编辑器主要避免这些区域,尽管您可以通过添加代码块在主要内容中包含类似小部件的内容。

当页面编辑器打开时,块界面通常位于屏幕的右侧。 小部件编辑器可通过外观 > 定制器区域和管理菜单使用。

小部件通常出现在网站的每个页面上,因此您无法从可以编辑块的同一位置编辑它们。

创建可重用的 WordPress 块模板

WordPress 允许您创建可重复使用的块模板。

这对于在您的网站上拥有一致的品牌和设计非常有用,而无需每次都重新创建精确的布局。 如果您使用 Vectornator 或 Adob​​e Illustrator 等软件来创建高级矢量图形和布局,这将特别有用。

创建模板本身很简单。 您需要做的就是选择块,单击出现的工具栏中的三个点,然后单击添加到可重用块。

从那里,您可以将其重命名为易于记忆的名称,然后重新开始处理页面。

块模板可以简化徽标、图形设计软件中制作的自定义按钮、设计元素以及网站品牌中使用的任何内容。

该模板将允许您轻松地将元素添加到您想要的任何位置,而无需在每次要使用它时重做某个品牌元素或布局。

关于 WordPress 块的最终想法

虽然 WordPress 块并不适合所有人,但它们是以直观、用户友好的方式创建页面和排列内容的强大起点。

然而,仅仅阅读块并不足以掌握它们的使用。

相反,现在转到您的 WordPress 网站并开始在一页上播放。 通过进行一些实践练习,您将能够掌握它们的使用并开始在您的站点上创建高级布局。

就像骑自行车一样,一旦您学习 WordPress 块就很难忘记它们,并且可以帮助您创建几乎所有标准的页面设计。