详解 WordPress 编辑器：经典编辑器、古腾堡、Elementor、Beaver Builder、Divi Builder 和 WPBakery

在 WordPress 中，编辑器是创建和管理网站内容的核心工具。随着时间的推移，WordPress 编辑器经历了多次变革和升级，目前主要有经典编辑器（Classic Editor）和古腾堡编辑器（Gutenberg Editor）。此外，还有一些流行的第三方页面构建器，如 Elementor、Beaver Builder、Divi Builder 和 WPBakery Page Builder。本文将详细介绍这些编辑器及其主要功能和使用方法。

Table of Contents

趋势简述

近年来，WordPress 编辑器的发展趋势主要体现在以下几个方面：

区块编辑模式：古腾堡编辑器引入的区块编辑模式受到了广泛欢迎，使内容创建更加模块化和灵活。用户可以通过添加、移动和自定义各类区块，轻松实现复杂的页面布局。
拖放式页面构建器：像 Elementor 和 Beaver Builder 这样的第三方页面构建器提供了直观的拖放式编辑体验，进一步简化了页面设计和内容创建过程。这类构建器功能强大，适合需要高度自定义和专业设计的用户。
响应式设计和实时预览：现代编辑器越来越注重响应式设计和实时预览功能，用户可以在编辑过程中实时查看不同设备上的显示效果，确保网站在各种设备上的用户体验一致。
增强的可扩展性：新的编辑器和页面构建器通常支持多种扩展插件和主题，提供丰富的自定义选项和功能扩展，满足不同类型网站的需求。
集成和兼容性：随着 WordPress 生态系统的不断壮大，编辑器和页面构建器越来越注重与其他插件和服务的集成和兼容性，提升整体网站的功能和性能。

接下来，本文将详细介绍经典编辑器、古腾堡编辑器、Elementor、Beaver Builder、Divi Builder 和 WPBakery Page Builder 的主要功能和使用方法。

经典编辑器（Classic Editor）

简介：经典编辑器是 WordPress 的原始编辑器，类似于传统的文本处理器界面。尽管古腾堡编辑器已成为默认编辑器，但经典编辑器仍然受到许多用户的青睐，特别是那些习惯于传统编辑模式的人。

主要功能：

文本编辑：支持丰富的文本格式，如加粗、斜体、下划线、项目符号等。
媒体插入：可以轻松插入图片、视频、音频等媒体文件。
短代码：支持短代码功能，可以通过短代码添加复杂功能。
HTML 编辑：切换到文本模式，可以直接编辑 HTML 代码。

使用方法：

创建新文章或页面：在 WordPress 仪表盘中，导航到“文章”或“页面”菜单，点击“写文章”或“写页面”。
编辑内容：使用经典编辑器的工具栏进行文本格式化、插入媒体、添加短代码等操作。
发布或保存草稿：编辑完成后，点击“发布”按钮发布内容，或点击“保存草稿”按钮稍后再继续编辑。

适用场景：

博客文章
简单的页面内容
需要频繁使用短代码的内容

古腾堡编辑器（Gutenberg Editor）

简介：古腾堡编辑器是 WordPress 5.0 版本引入的新编辑器，采用区块（Block）编辑模式，使内容创建更加灵活和直观。古腾堡编辑器彻底改变了内容创建和布局方式，提供了丰富的区块类型和自定义选项。

主要功能：

区块编辑：每个内容元素（如段落、图片、视频等）都是一个区块，可以自由添加、删除和移动。
多样化的区块：内置多种区块类型，如文本、标题、图像、画廊、按钮、表格等，支持扩展第三方区块。
实时预览：实时预览内容布局，所见即所得。
样式和设置：每个区块都有独立的样式和设置选项，可以自定义外观。

使用方法：

创建新文章或页面：在 WordPress 仪表盘中，导航到“文章”或“页面”菜单，点击“写文章”或“写页面”。
添加区块：点击“+”按钮，从区块库中选择需要的区块类型，添加到内容区域。
编辑区块：使用区块工具栏和侧边栏设置选项，自定义区块内容和样式。
发布或保存草稿：编辑完成后，点击“发布”按钮发布内容，或点击“保存草稿”按钮稍后再继续编辑。

适用场景：

复杂的页面布局
视觉效果丰富的内容
需要灵活定制的内容

Elementor 页面构建器

简介： Elementor 是一款功能强大的第三方页面构建器插件，提供直观的拖放式编辑功能，适合创建高度自定义和专业的页面设计。Elementor 深受设计师和开发者的喜爱，因其丰富的功能和灵活的布局选项。

主要功能：

拖放编辑：通过拖放元素创建页面布局，无需编写代码。
丰富的元素：内置多种元素，如标题、文本框、图像、视频、按钮、表单等，支持第三方扩展。
模板库：提供丰富的预制模板和区块，快速创建专业页面。
实时预览：所见即所得的编辑体验，实时预览修改效果。
高级功能：包括动画效果、响应式设计、WooCommerce 集成等。

使用方法：

安装和激活：在 WordPress 插件库中搜索 Elementor，点击“安装”并激活。
创建新页面：在 WordPress 仪表盘中，导航到“页面”菜单，点击“添加新页面”。
启用 Elementor：点击“使用 Elementor 编辑”按钮，进入 Elementor 编辑界面。
添加和编辑元素：从左侧面板中拖放元素到页面，进行自定义编辑和样式设置。
保存和发布：编辑完成后，点击“发布”按钮保存和发布页面。

适用场景：

企业网站
电商网站
着陆页

Beaver Builder 页面构建器

简介： Beaver Builder 是另一款流行的第三方页面构建器插件，提供直观的拖放式编辑功能，适合各种类型的网站。Beaver Builder 强调简洁和高效，用户可以快速创建专业的页面布局。

主要功能：

拖放编辑：通过拖放元素创建页面布局，无需编写代码。
模块和模板：内置多种模块，如文本、图像、视频、按钮等，提供预制模板。
实时预览：所见即所得的编辑体验，实时预览修改效果。
兼容性：与大多数 WordPress 主题兼容，无缝集成。

使用方法：

安装和激活：在 WordPress 插件库中搜索 Beaver Builder，点击“安装”并激活。
创建新页面：在 WordPress 仪表盘中，导航到“页面”菜单，点击“添加新页面”。
启用 Beaver Builder：点击“使用 Beaver Builder 编辑”按钮，进入 Beaver Builder 编辑界面。
添加和编辑模块：从顶部面板中拖放模块到页面，进行自定义编辑和样式设置。
保存和发布：编辑完成后，点击“发布”按钮保存和发布页面。

适用场景：

个人博客
企业网站
作品集展示

Divi Builder

简介： Divi Builder 是由 Elegant Themes 开发的一款强大的页面构建器插件，提供丰富的设计元素和灵活的布局选项。Divi Builder 以其独特的可视化编辑界面和多样化的设计工具深受用户喜爱。

主要功能：

拖放编辑：通过拖放元素创建页面布局，无需编写代码。
丰富的设计元素：内置多种设计元素，如文本、图像、视频、按钮、表单等。
预制布局：提供大量预制布局和模板，快速创建专业页面。
全局元素：可以创建全局元素，一次编辑，多处应用。
高级设计选项：包括自定义 CSS、响应式设计、动画效果等。

使用方法：

安装和激活：在 Elegant Themes 网站购买并下载 Divi Builder 插件，上传到 WordPress 并激活。
创建新页面：在 WordPress 仪表盘中，导航到“页面”菜单，点击“添加新页面”。
启用 Divi Builder：点击“使用 Divi Builder 编辑”按钮，进入 Divi Builder 编辑界面。
添加和编辑设计元素：从左侧面板中拖放设计元素到页面，进行自定义编辑和样式设置。
保存和发布：编辑完成后，点击“发布”按钮保存和发布页面。

适用场景：

企业网站
电商网站
作品集展示

WPBakery Page Builder

简介： WPBakery Page Builder（原名 Visual Composer）是一款广泛使用的页面构建器插件，提供丰富的拖放式编辑功能。WPBakery 以其强大的功能和灵活性受到用户青睐，适合各种类型的网站。

主要功能：

拖放编辑：通过拖放元素创建页面布局，无需编写代码。
前端和后端编辑：支持前端实时编辑和后端编辑。
丰富的内容元素：内置多种内容元素，如文本、图像、视频、按钮、表单等。
模板库：提供大量预制模板，快速创建页面。
扩展支持：支持多种第三方扩展，增强功能。

使用方法：

安装和激活：在 WordPress 插件库中搜索 WPBakery Page Builder，点击“安装”并激活。
创建新页面：在 WordPress 仪表盘中，导航到“页面”菜单，点击“添加新页面”。
启用 WPBakery Page Builder：点击“使用 WPBakery Page Builder 编辑”按钮，进入 WPBakery 编辑界面。
添加和编辑内容元素：从左侧面板中拖放内容元素到页面，进行自定义编辑和样式设置。
保存和发布：编辑完成后，点击“发布”按钮保存和发布页面。

适用场景：

企业网站
博客网站
电商网站

优缺点对比

编辑器	优点	缺点
Elementor	– 强大的拖放编辑功能 – 丰富的设计元素和模板库 – 实时预览和高级设计选项	– 高级功能需要购买专业版 – 对初学者可能有一定学习曲线
Beaver Builder	– 简洁直观的拖放编辑界面 – 与大多数 WordPress 主题兼容 – 提供预制模板和模块	– 高级功能需要购买专业版 – 自定义选项相对有限
Divi Builder	– 强大的可视化编辑界面 – 丰富的设计元素和预制布局 – 全局元素和高级设计选项	– 高级功能需要购买 Elegant Themes 会员 – 对初学者有一定学习曲线
WPBakery Page Builder	– 强大的拖放编辑功能 – 支持前端和后端编辑 – 丰富的内容元素和模板库	– 高级功能需要购买专业版 – 界面相对较复杂