將您的 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 的最新消息和更新