• 主页
  • 文章
  • 主题
  • 13 个常见的 WordPress 块编辑器问题以及如何解决它们

13 个常见的 WordPress 块编辑器问题以及如何解决它们

已发表: 2023-02-22


您在使用 WordPress 块编辑器时是否遇到过错误？

WordPress 在 2019 年用一个名为 Gutenberg 的全新内容编辑器取代了旧的经典编辑器。 这个新的编辑器使用块在 WordPress 中创建内容。 但是，有时您在使用它时可能会遇到恼人的问题。

在本文中，我们将分享如何解决最常见的 WordPress 块编辑器问题，以便您改进工作流程。

Common block editor issues and how to fix it

什么是 WordPress 块编辑器？

WordPress 块编辑器或 Gutenberg 是 WordPress 5.0 版本中引入的新内容编辑器。 从那时起，WordPress 改进了编辑器并添加了新的特性和功能。

与经典编辑器相比，它提供了更多的自定义功能。 您可以获得不同的块来向您的内容添加不同的元素，而不必编辑代码来更改外观和样式。

它试图通过模仿 WordPress 主题的相同字体和颜色来实时显示您的博客和页面的外观。

例如，您可以使用图像块将图片添加到您的博客文章中。 此外，您还可以使用该块获得图像样式、大小、对齐方式等选项。

Add an Image Block

除此之外，许多 WordPress 插件将它们的块添加到内容编辑器中。 这使得只需单击几下即可非常轻松地嵌入表单、社交媒体提要和目录等内容。

也就是说，块编辑器并不完美。 与任何其他 WordPress 插件一样，您可能会遇到不同的错误或错误。 以下是内容编辑器中的一些常见问题。 您可以单击下面的链接以查看您喜欢的部分。

1.修复WordPress块编辑器不工作的错误

用户面临的最常见问题之一是“WordPress 块编辑器不工作”。

出现此错误的原因有多种。 例如，这可能是因为旧的过时主题、错误的插件或其他技术错误。

如果您的网站设置错误，WordPress 块编辑器也可能无法工作，例如在创建用户配置文件时禁用可视化编辑器。

您可以通过从 WordPress 仪表板转到用户 » 配置文件来检查这一点。 从这里开始，只需确保未选择“编写时禁用可视化编辑器”选项。

Disable the visual editor when writing

如果问题仍然存在，那么您可以尝试停用您网站上的所有插件。 这应该有助于排除插件可能导致的任何冲突并阻止块编辑器工作。

解决此问题的另一种方法是更新您的 WordPress 主题。 过时的主题可能会导致块编辑器无法正常工作。 您可以查看我们的指南，了解如何在不丢失数据和自定义的情况下更新 WordPress 主题。

2. WordPress 块编辑器不断崩溃

一些用户面临的另一个常见问题是 WordPress 块编辑器会意外崩溃。

当它崩溃时，您会看到“编辑器遇到意外错误”的错误消息。 WordPress 然后会显示 3 个选项，包括尝试恢复、复制帖子文本和复制错误。

Block editor crashed

此问题可能有多种原因。 例如，插件可能会破坏块编辑器并显示此错误，或者您的 WordPress 版本不是最新的。

您可以通过停用所有插件并一个一个地重新激活它们来解决此问题。 另一个解决方法是将您的 WordPress 更改为默认主题，例如二十二十二，然后查看问题是否仍然存在。

如果您在检查 WordPress 插件和主题后仍然遇到此问题，请尝试更新 WordPress 版本并清除 WordPress 缓存。

3. 删除内容编辑器中的无效 JSON 错误

当您编辑博客文章或页面时，当您单击块编辑器中的更新按钮时，可能会出现“响应不是有效的 JSON 响应”错误。

View JSON error in block editor

当您在 WordPress 博客上编辑帖子时，WordPress 会在后台与网站服务器保持持续通信。 当 WordPress 无法从服务器接收响应或响应不是 JSON 格式时，会导致此错误。

以下是您会收到无效 JSON 错误的几个原因以及如何修复它们：

  • 检查设置中的 WordPress URL – 您需要确保站点设置中的 WordPress 地址和站点地址正确无误。 只需转到设置 » 常规页面并检查 URL 是否相同。 如果站点地址不同，可能会触发 JSON 错误。
Ensure WordPress and site address are same
  • 修复 WordPress 中的永久链接设置– 在 WordPress 中，您可以为您的页面和帖子设置 SEO 友好的 URL。 但是，不正确的设置会使块编辑器难以获得有效的 JSON 响应。 只要确保选择正确的永久链接格式即可。
  • 检查 WordPress .htaccess 文件设置– .htaccess 文件在 WordPress 中用作配置文件以管理 SEO 友好的 URL（永久链接）。 通常，WordPress 会自动重新生成并更新它。 但是，不正确的设置或过时的 .htaccess 文件可能会导致 JSON 错误。
  • 请参阅 REST API 调试日志– REST API 是 WordPress 用于与您站点的服务器通信的一组技术。 JSON 错误也可能意味着 REST API 遇到错误。 您可以通过在 WordPress 的站点健康页面上查看 REST API 日志来检查这一点。
  • 尝试停用所有插件– 不同 WordPress 插件之间的冲突也可能导致无效的 JSON 错误。 尝试停用您网站上的所有插件，看看错误是否再次发生。
  • 切换到经典编辑器——如果您仍然无法解决 JSON 错误，那么您可以切换回 WordPress 中的经典编辑器。 旧的内容编辑器不依赖 REST API 从网站服务器获取 JSON 响应。

要详细了解这些提示中的每一个，请参阅我们的指南，了解如何修复 WordPress 中的无效 JSON 错误。

4.解决更新失败/发布失败错误

在 WordPress 块编辑器中更新或发布博客文章或页面时，您可能会看到的另一个错误是：“更新失败。 你可能不在线。

当 WordPress REST API 无法与 WordPress 数据库通信时会出现此问题。

Updating failed error

如果块编辑器无法发送和接收来自 WordPress 托管数据库的请求，那么您站点的不同部分将无法运行。 这包括块编辑器。

如果您未连接到 Internet 或失去连接，REST API 可能会停止工作。 要解决此问题，请确保您的互联网连接正常，然后尝试更新或发布您的页面。

除此之外，您可以从 WordPress 仪表板转到工具 » 站点健康并查看 REST API 日志。 如果 REST API 存在问题，您将在“建议的改进”部分下看到它。

View site health

错误日志将显示 REST API 发生的情况，并可能为您提供有关可能导致问题的原因的线索。

有关解决此问题的信息，您可以查看我们的指南，了解如何修复 WordPress 更新失败错误。

5. 添加或删除 WordPress 块之间的空格

使用 WordPress 块编辑器创建自定义页面和帖子时，您可能会注意到块之间的空间太大或太小。

通常间距由您的 WordPress 主题控制。 但是，块编辑器中的一些选项还可以让您控制页面的布局并提供更好的用户体验。

例如，您可以添加一个 Spacer 块来添加空格。 只需单击“+”按钮并在内容中的任意位置添加 Spacer 块。

Add spacer block to page

这样，您可以在块之间添加额外的空间。

WordPress 还允许您调整间隔块的大小。 您可以通过向上或向下拖动块来使其变大或变小。

Resize spacer block

如果你想删除块之间的额外空白，那么你需要在你的 WordPress 主题中输入自定义 CSS 或使用像 CSS Hero 这样的 CSS 插件。

该插件允许您在不编辑代码的情况下编辑网站的 CSS。 它提供了不同的间距选项，您可以使用它们来调整块之间的空白空间。

CSS Hero change bottom margin

您还可以使用 SeedProd 在 WordPress 中创建自定义页面并完全控制设计。

要了解更多信息，请参阅我们的指南，了解如何在 WordPress 块之间添加或删除空格。

6.复制和粘贴没有格式问题的内容

您是否注意到，当您将桌面应用程序或网页中的内容复制并粘贴到块编辑器中时，您最终也会粘贴不需要的格式？

您会看到粘贴内容的字体和颜色与您的 WordPress 主题不匹配。 如果您使用 Microsoft Word 或 Google Docs 编写内容，然后将其输入到块编辑器中，这很常见。

保持原始格式的一些简单技巧包括使用 Word 和 Google Docs 标题样式。 这样，当您将内容粘贴到块编辑器时，WordPress 会自动选择标题级别。

除此之外，您应该检查页面的 HTML 代码或在粘贴内容后发布。 在 WordPress 内容编辑器中，您可以选择一个块，然后单击 3 个垂直点选项。 从下拉菜单中，只需选择“编辑为 HTML”选项。

Switching to the HTML View of a Block in the WordPress Block Editor

这样，您应该能够找到任何格式错误，例如不正确的粗体和斜体、不需要的文本等。

有关更多详细信息，您可以查看我们的指南，了解如何在没有格式问题的情况下在 WordPress 中复制和粘贴。

7.修复WordPress中的图片上传问题

接下来，您可能会在 WordPress 块编辑器中上传图片时看到错误。 这是 WordPress 中最常见的图像问题之一。

出现此错误的主要原因是文件权限不正确。 您所有的网站文件都存储在您的网络托管服务上，需要特定的文件和目录权限才能工作。

如果这些权限不正确，它会阻止 WordPress 读取文件并将文件上传到托管服务器。 因此，您会注意到图片在上传后会从媒体库中消失，或者您可能会看到一条错误消息：

'Unable to create directory wp-content/uploads/2019/04. Is its parent directory writable by the server?'

要解决此问题，您需要编辑文件权限。 您可以使用 FTP 客户端访问 /wp-content/ 文件夹。 从这里，您可以右键单击该文件夹并更改文件权限。

Check the File Permissions of the WP-Content Folder

请按照我们关于如何修复 WordPress 中的图像上传问题的分步指南获取有关此修复的更多信息。

8.修复HTTP图片上传错误

在 WordPress 块编辑器中上传图片时可能遇到的另一个问题是 HTTP 错误。

当您在媒体库中上传图片时，WordPress 将显示一个通用的“HTTP”错误，您将无法看到图片的预览。

HTTP image upload error

有几种情况可能会导致此问题。 令人沮丧的是，错误消息并没有提供很多关于实际原因的线索。

要解决此问题，您可以尝试多种方法。 首先，您只需等待几分钟，然后尝试重新上传图片。 有时，您的网站服务器可能会遇到异常流量和服务器资源不足等问题。

除此之外，您可以增加 WordPress 内存限制，防止内存不足导致 HTTP 错误。 您可以尝试的其他事情包括更改 WordPress 使用的图像编辑器库和编辑 .htaccess 文件。

此外，您的登录名可能已过期，有时通过转到您的登录屏幕并再次输入您的用户名和密码，此错误会消失。

您可以在我们关于如何修复 WordPress 中的 HTTP 图像上传错误的指南中详细阅读这些提示中的每一个。

9. 删除 WordPress 中的错过计划发布错误

您知道 WordPress 提供了一个内置选项来安排博客帖子吗？

在 WordPress 内容编辑器中，您可以更改发布博客文章的日期和时间。 但是，有时您预定的内容可能不会在设定的时间发布。

Posts Can Be Published Immediately or Scheduled to Go Live in the Future

出现此错误的主要原因是WordPress托管环境或插件冲突。 WordPress 使用一种称为“cron”的技术在以后自动发布您的帖子。

如果插件或网站托管服务器影响了 cron 作业，那么它将导致 WordPress 中的 missed schedule post 错误。

您可以通过检查 WordPress 站点的时区来解决此问题。 您网站的时区可能与您要用于安排博客的时区不匹配。

只需从 WordPress 管理面板转到设置 » 常规，然后向下滚动到时区部分。

Edit the timezone settings

您还可以尝试通过清除 WordPress 缓存和增加 WordPress 内存限制来解决此问题。

请参阅我们的指南，了解如何修复 WordPress 中错过的预定发布错误。

10. 修复 WordPress 块编辑器中的对齐问题

您可能会遇到的另一个常见的 WordPress 块编辑器是您的内容和图像可能没有正确对齐。

例如，假设您在博客文章中添加了一个项目符号列表并将其居中对齐。 但是，在编辑帖子时，列表在块编辑器中显示为左对齐。 类似地，居中对齐的图像块可能看起来向左或向右对齐。

如果您在 WordPress 站点上安装并激活了 Gutenberg 插件，那么它可能会导致块对齐问题。 我们建议您停用 Gutenberg 插件并查看它是否可以解决问题。

另一种解决方案是为要居中对齐的文本添加以下自定义 CSS 代码： 

.has-text-align-center 
text-align: center;

您还可以查看我们的指南，了解如何在 WordPress 块编辑器中添加和对齐图像。

11. 解决 Facebook 不正确的缩略图问题

您是否注意到当您在 Facebook 上分享文章时，帖子缩略图不正确？

该问题可能是由插件冲突、内容分发网络 (CDN) 问题或缺少 Facebook 的开放图元标记引起的。

现在，这不是您将在 WordPress 块编辑器中看到的问题。 但是，您可以使用内容编辑器为 Facebook 指定一个开放图形图像。

您可以使用 All in One SEO (AIOSEO) 插件快速解决问题。 它是 WordPress 最好的 SEO 插件，可帮助您针对搜索引擎和社交媒体优化您的网站。

激活后，您将在 WordPress 内容编辑器中看到一个 AIOSEO 设置元框。 只需前往“社交”标签即可。

head to the social tab

接下来，您可以向下滚动到“图像源”部分。

从下拉列表中，您可以选择在分享文章时在 Facebook 和其他社交媒体网站上显示的图像。

Select image source

您可以按照我们的指南了解如何修复 WordPress 中 Facebook 不正确的缩略图问题，并了解解决此问题的其他方法。

12. 修复 Facebook 和 Instagram oEmbed 问题

您将面临的另一个与社交媒体相关的块编辑器问题是将 Facebook 和 Instagram 内容添加到 WordPress。

过去，您可以轻松地将来自 Instagram 或 Facebook 的帖子嵌入 WordPress。 然而，Facebook 已经改变了 oEmbed 现在的工作方式。

您不能再在 WordPress 中嵌入视频、图像、更新和其他内容。 它会改为显示内容的纯 URL。

An example of an oEmbed error in WordPress

您可以使用 Smash Balloon 等社交媒体 WordPress 插件轻松解决此问题。 它可以帮助您使用 oEmbed 轻松嵌入来自 Facebook 和 Instagram 的内容，您还可以在您的网站上显示社交媒体提要。

有关更多详细信息，请参阅我们的指南，了解如何修复 WordPress 中的 Facebook 和 Instagram oEmbed 问题。

13.无法在块编辑器中看到嵌入的内容预览

这是在 WordPress 5.7 版本中提出的问题。 无论何时嵌入来自 YouTube 和 Vimeo 的视频或添加来自 Spotify 和 SoundCloud 的音频，预览都不会出现在块编辑器中。

相反，您只会在块中看到“预览不可用”。 这个问题的主要原因是默认的延迟加载功能。

在 WordPress 5.5 中，iFrame 默认是延迟加载的，这意味着图片等嵌入内容只有在访问者向下滚动到内容所在位置后才会加载。

解决此问题的一个简单方法是更新您的 WordPress 版本。 此错误已从那时起得到解决。 如果您使用的是 5.7 或更低版本，那么我们强烈建议您将 WordPress 更新到最新版本。

我们希望本文能帮助您了解常见的块编辑器问题以及如何解决这些问题。 您可能还想查看我们关于常见 WordPress 错误及其修复方法的指南，以及面向初学者的 WordPress SEO 终极指南。

如果您喜欢这篇文章，请订阅我们的 YouTube 频道以获取 WordPress 视频教程。 您还可以在 Twitter 和 Facebook 上找到我们。