将您的 Divi 网站转换为 Elementor 的分步指南

已发表: 2022-04-28

Divi 是最受欢迎的 WordPress 主题之一,也是一个可视化页面构建器,可让您实时设计网站。 另一方面,Elementor 被公认为最好的 WordPress 页面构建器插件,它带有拖放功能,可在几分钟内创建和自定义网站。

这两个页面构建器都非常强大。 除了小部件、元素和自定义功能等许多相似之处外,这两个页面构建器之间也存在许多差异。

人们在使用优雅主题时大多使用 Divi builder,而 Elementor 与几乎所有主题兼容。 这是许多用户现在从 Divi 切换到 Elementor 的最大原因之一。 定价在这个选择过程中也起着至关重要的作用。

如果您也从 Divi 迁移到 Elementor,此博客适合您。 今天,我们将分享有关如何将网站从 Divi 转换为 Elementor 的分步指南。

将网站从 Divi 转换为 Elementor 的先决条件

How to Convert Divi to Elementor

在深入学习本教程之前,让我们检查一下先决条件。

首先:在转换您的 Divi 网站之前,请确保您备份您的网站。 您可以使用任何 WordPress 备份插件来完成此过程。

第二:如果您使用任何 WordPress 缓存插件,您需要将其关闭。

第三:建议在转换之前制作一个暂存站点。 您可以使用网站复制器插件简单地创建一个登台网站。

让我们开始吧:

如何将 Divi 转换为 Elementor:要遵循的 5 个步骤

老实说,不可能将整个网站或特定网页从 Divi 转换为 Elementor。 因为 Divi 使用简码来构建网页内容,而 Elementor 生成静态 HTML 代码。

因此,如果您打算将您的网站设计从 Divi 转换为 Elementor,则必须重建它。 在这里,我们将向您展示如何使用 Elementor 页面构建器重建您的 Divi 网站。

第 1 步:安装 Elementor
步骤 2. 删除 Divi 和相关插件
第 3 步:创建新页面
第 4 步:使用 Elementor 小部件向页面添加内容
第 5 步:使用 Elementor 模板设计您的网站

按照上述步骤使用 Elementor 重新设计您的网站。

第 1 步:安装 Elementor

首先,您需要转到Plugins->Add New

Go to Plugins->Add New area.

它会将您重定向到插件页面。 在这里,您应该通过搜索从插件目录中找到“Elementor”插件。 然后单击安装以安装插件。 之后,您需要激活插件。

Find Elementor plugin

注意:如果您需要 Elementor pro 功能来设计您的网站,您可以安装 Elementor Pro。

完成插件激活后,您应该进入Elementor->Settings区域管理 Elementor 的基本设置。

Elementor Settings

步骤 2. 删除 Divi 和相关插件

完成安装过程后,下一步是从您的网站停用Divi及其推荐的插件。 然后你会发现很多页面都留下了简码。

Divi Shortcodes
资料来源:Themerex

您必须删除这些Shortcodes 。 为此,您可以使用 ShortCode Cleaner 删除这些损坏的简码。 如有必要,您可以使用垃圾收集器来清理数据库。

第 3 步:创建新页面

现在我们准备转换我们的网站。 首先,我们需要创建一个新页面。 为此,请访问Pages->Add New

Go to Pages->Add New Area

我们创建了一个新页面(演示页面)。 此外,我们还设置了页面设置。

  1. 设置页面布局->元素画布。
  2. 单击发布按钮以发布页面。
  3. 单击“使用 Elementor 编辑”按钮将页面打开到 Elementor 编辑器面板。
Page settings

如何使用 Elementor:初学者终极指南

第 4 步:使用 Elementor 小部件向页面添加内容

做得好。 您已成功创建网页并准备使用 Elementor 对其进行编辑。

Elementor editor panel

是时候向页面添加内容了。 Elementor 带有可用于设计网页的拖放小部件。

Basic Elementor editor panel settings

让我们添加一个标题小部件。 只需从小部件库中找到标题小部件。 然后将小部件拖放到适合您网页的位置。

Add heading widget

您可以使用样式选项来自定义标题。

Customize heading design

要进行更多自定义,您可以使用 Elementor 的高级功能。

Elementor Advanced settings

第 5 步:使用 Elementor 模板设计您的网站

Elementor 还附带了一些现成的网站模板,用于设计网站。 您可以根据您的设计目的选择合适的。 但是,您可以以自己的方式自定义这些模板。

让我们看看如何使用 Elementor 网站模板。

首先,单击模板图标。

Click Template icon

在以下模式弹出窗口中,您将获得所有 Elementor Blocks & Templates

Elementor Template library

您可以从这里选择正确的模板或块。 要使用此模板,您需要单击“安装”按钮并等待一段时间进行安装。

就是这样。

Divi 和 Elementor 的常见问题解答

在这里,我们已经回答了有关 Elementor 和 Divi 的一些基本问题。

1. Elementor 和 Divi 哪个更好?

这是人们经常问的一个常见问题。 Elementor 是一个易于使用且最常用的页面构建器插件。 虽然 Divi 比 Elementor 更难但价格便宜。

2. Divi 和 Elementor 是一样的吗?

Divi 带有主题和插件版本,而 Elementor 是插件。 但 Elementor 推荐 Hello Theme。

3. Elementor 比 Divi 快吗?

这实际上取决于您的网络托管计划和您的网站内容。 但总的来说,Elementor 比 Divi 快。

4. 我可以将 Elementor 与 Divi 一起使用吗?

是的,您可以将 Elementor 与 Divi 一起使用。

您准备好转换您的 Divi 网站了吗

像 Elementor 或 Divi 这样的页面构建器改变了网站设计时代。 现在您可以轻松地实时设计网站。

在此博客中,我们展示了如何将 Divi 转换为 Elementor。 我们还回答了有关 Elementor 和 Divi 的一些基本问题。 如果您有任何疑问,可以使用下面的评论框提问。 我们会尽快回复。

如果您觉得此博客有帮助,请在您的社交媒体上分享。 不要忘记加入我们的时事通讯以获取与 WordPress 和 Elementor 相关的更多信息。

订阅我们的新闻

获取有关 Elementor 的最新消息和更新