如何集成 Elementor 和 Mailchimp(5 個步驟)

已發表: 2022-07-01

Mailchimp 是您網站上最好的電子郵件營銷自動化工具之一。 它的服務可以有效地組織您的訂閱者並向他們發送他們感興趣的內容。但是,Mailchimp 聯繫表可能與您網站的品牌不一致。

要解決這個問題,您可以集成 Elementor 和 Mailchimp。 使用 Elementor,您可以輕鬆設計自定義訂閱表單並將其嵌入您的網站。 然後,您可以直接從 Mailchimp 管理註冊信息。

在這篇文章中,我們將討論為什麼您可能想要集成 Elementor 和 Mailchimp。 然後,我們將通過五個步驟向您展示如何做到這一點。 我們還包括一個附加組件列表,以訪問額外的特性和功能。 讓我們開始吧!


集成 Elementor 和 Mailchimp 的好處

無論您是經營在線業務還是博客,您都可能需要一種方法來始終如一地聯繫您的受眾。 使用 Mailchimp,您可以做到這一點。

Mailchimp 是一種電子郵件營銷服務,可以建立訂閱者列表和設計電子郵件:

Mailchimp 電子郵件營銷
郵遞員。

使用 Mailchimp,您可以使用訂閱者的聯繫信息創建電子郵件列表。 使用預製的電子郵件模板和內容優化器,您可以向您的受眾成員發送引人入勝的信息更新。

如果您是 Mailchimp 的新手,您可以免費創建一個帳戶。 只要您的訂閱者少於 2,000,您就可以訪問其易於使用的功能而無需付費。

當您嘗試增加您的電子郵件列表時,最好在您的網站上嵌入一些訂閱表格。 他們可以幫助您從自然流量中產生潛在客戶。 儘管 Mailchimp 具有此功能,但其嵌入形式通常是通用的,可能與您的品牌不匹配。

這就是 Elementor 的用武之地。 Elementor 是一個易於使用的 WordPress 頁面構建器,您可以使用它來設計您的網站而無需編碼。 它的拖放編輯器使創建站點所需的特性和功能變得簡單:

元素
Elementor 頁面構建器。

此外,Elementor 可以輕鬆與 Mailchimp 集成。 與其他頁面構建器相比,Elementor 是創建和管理選擇加入表單的最佳選擇之一。

使用 Elementor,您可以在站點的任何位置添加聯繫表單,並在其設置中鏈接 Mailchimp。 當您的在線訪問者註冊時,他們將自動添加到您的 Mailchimp 列表中。 使用這兩種工具可以讓您擁有精心設計的表單,而不會失去訂閱者分析。

Elementor+ Mailchimp = 夢之隊 在本指南中了解有關集成這兩個強大工具的更多信息點擊鳴叫

如何集成 Elementor 和 Mailchimp(5 個步驟)

既然您知道 Elementor 和 Mailchimp 可以如何使您的網站受益,那麼讓我們討論如何開始此集成過程!

第 1 步:註冊 Mailchimp 帳戶

首先,您需要訪問 Mailchimp 網站並註冊一個帳戶。 您只需輸入您的電子郵件地址、用戶名和密碼即可免費執行此操作:

Mailchimp 註冊頁面
註冊一個 Mailchimp 帳戶。

然後,Mailchimp 將向您發送一封包含激活鏈接的電子郵件。 單擊此按鈕,您將看到一個包含不同計劃選項的頁面:

Mailchimp 網站上的計劃選項
Mailchimp 計劃選項。

如果您不確定哪個計劃適合您,請選擇比較計劃功能。 在這裡,您可以查看每一層的所有內容:

查看比較所有計劃功能
比較 Mailchimp 計劃。

在本教程中,我們選擇免費計劃,它可以支持 2,000 個聯繫人和 10,000 封電子郵件發送。 這對於基本的電子郵件營銷計劃就足夠了。 但是,您將無法訪問重定向廣告、自定義編碼的電子郵件模板或自定義品牌。

要開始註冊過程,請填寫您的姓名和業務信息。 儘管它是可選的,但您也可以輸入您網站的 URL 並導入您的內容:

添加姓名和商家信息
添加您的姓名和公司信息。

接下來,填寫您的地址信息。 此步驟可確保您的電子郵件不會成為垃圾郵件:

填寫正確的地址
將您的地址添加到該字段。

Mailchimp 然後會詢問您是否已經有任何訂閱者。 如果是,請選擇並填寫您擁有的數量:

讓 Mailchimp 知道您有多少訂閱者
填寫您有多少訂閱者。

為了幫助 Mailchimp 了解您的業務,請說明您是否銷售產品或服務。 要繞過這個問題,您可以點擊Skip

銷售產品或服務
產品或服務選項。

完成此註冊過程後,您將能夠訪問您的 Mailchimp 帳戶!

第 2 步:創建受眾和 API 密鑰

要開始在 Mailchimp 中組織訂閱者,您需要創建一個受眾。 請記住,免費帳戶僅支持一個受眾,但任何高級計劃都可以包括三個或更多。

儘管您可能想創建多個受眾,但 Mailchimp 建議從一個開始。 此設置可以幫助您從整體上了解您的訂閱者。 隨著公司的發展,它還可以簡化您的電子郵件發送流程並維護您的聯繫人。

即使只有一個受眾,您也可以創建標籤和細分來將聯繫人組織到不同的子集中。 但是,讓多個受眾群體可以有一定的好處。

例如,如果您同時向供應商和買家發送電子郵件,您可能需要向這些組發送單獨的消息。

在您的 Mailchimp 儀表板中,轉到Audience > Audience Dashboard 。 然後,單擊添加您的聯繫人

在 Mailchimp 中添加聯繫人
在 Mailchimp 中添加聯繫人。

這將帶您進入一個頁面以導入訂閱者的聯繫信息。 只需將他們的姓名和電子郵件地址複製並粘貼到文本框中即可。 或者,您可以從第三方服務導入數據或上傳 CSV 或 TXT 文件:

選擇上傳方式
有不同的上傳選項可用。

完成此操作後,轉到您的受眾儀表板並找到Manage Audience > Settings 。 在這裡,您可以更改名稱和默認設置:

更改 Mailchimp 中的名稱和默認設置
更改名稱和默認設置。

請務必設置發件人姓名發件人電子郵件地址。 您還可以啟用雙重選擇以在訂閱者註冊後向他們發送確認電子郵件:

添加更多廣告系列默認選項
添加更多廣告系列選項。

完成創建和設置帳戶後,轉到您的個人資料。 然後點擊Extras > API keys

單擊附加選項卡以找到 API 選項
單擊“附加”選項卡以找到 API 選項。

如果您沒有 API 密鑰,則需要單擊Create A Key 。 Mailchimp 會自動為您添加一個:

創建您的 API 密鑰
創建 API 密鑰。

一旦您的 API 密鑰處於活動狀態,請複制它。 由於此信息允許訪問您的 Mailchimp 帳戶,因此切勿公開共享此代碼。

第 3 步:使用 Elementor 設計 Mailchimp 註冊表單

接下來,您需要下載並安裝 Elementor Pro。 它包括一個 WordPress 表單生成器,您可以使用它來設計自定義表單並從您的受眾那裡收集反饋。

激活 Elementor Pro 後,轉到Elementor > 設置 > 集成。 向下滾動到Mailchimp部分並粘貼 API 密鑰:

粘貼您的 Mailchimp API 密鑰
粘貼您的 Mailchimp API 密鑰。

單擊驗證 API 密鑰。 如果集成成功,您將在此按鈕旁邊看到一個綠色複選標記。 在此之後,保存您的更改。

現在您可以開始設計您的註冊表單了。 首先,添加一個新帖子或頁面,然後選擇Edit with Elementor

選擇使用 elementor 編輯
選擇“使用 Elementor 編輯”。

在 Elementor 編輯器中,向下滾動到Pro小部件。 在這裡,您將看到Forms的選項。 將此小部件拖放到頁面上:

查找表單小部件
將“表單”小部件拖放到頁面上。

Elementor 將自動創建一個包含姓名、電子郵件地址和消息字段的基本表單。 但是,您可以繼續自定義表單,直到滿足您的需求:

開始自定義表單
自定義您認為合適的表格。

例如,如果您想添加一個訂閱表單,它通常不需要消息字段。 您只需單擊該項目旁邊的X。

要產生潛在客戶,您需要要求訪問者填寫他們的姓名和電子郵件。 您可以通過單擊每個字段並選擇“必需”旁邊的“是”來執行此操作:

點擊相應的元素
單擊相應的元素。

然後,轉到按鈕部分以編輯操作按鈕。 儘管默認文本是“發送”,但請考慮將其更改為“訂閱”或“註冊:”

在 Elementor 中編輯按鈕操作
在 Elementor 中編輯按鈕操作。

您可以根據需要繼續更改按鈕的大小和列寬。 如果您願意,也可以添加一個圖標。

第 4 步:連接 Mailchimp

根據自己的喜好自定義表單後,就可以連接您的 Mailchimp 帳戶了。 為此,請找到提交後的操作部分:

提交選項後查找操作
訪問“提交後的操作”選項。

然後,單擊+圖標並從下拉菜單中選擇Mailchimp

從下拉菜單中選擇 Mailchimp
從下拉菜單中選擇 Mailchimp。

這將在下面創建一個名為Mailchimp的新部分。 單擊此按鈕時,您將看到設置 API 密鑰和受眾的選項:

如果需要,設置 API 密鑰和受眾
如果需要,設置 API 和受眾選項。

如果您在集成設置中輸入了 API 密鑰,則可以將API Key部分保留為Default 。 然後,選擇要鏈接到此訂閱表單的受眾

從要附加到表單的 mailchimp 中選擇受眾
從 Mailchimp 中選擇合適的受眾。

您還可以選擇您在 Mailchimp 中創建的任何組或標籤。 最後,根據您在表單中提供的字段自定義字段映射設置。 這將告訴 Mailchimp 哪些信息要在其係統中編目。

對於此示例,我們的訂閱表單僅包含姓名和電子郵件字段。 這意味著我們只會在字段映射部分中包含此信息:

選擇字段映射選項
字段映射選項。

最後,導航到Additional Options並找到Custom Messages 。 啟用此功能可在有人填寫表單後提供成功消息:

添加自定義成功消息
為您的用戶添加成功消息。

默認消息將是“此表單已成功發送”。 您可以考慮將其更改為“感謝您訂閱”之類的內容。 您還可以為錯誤和必填字段添加自定義消息。

第 5 步:將表單添加到您的站點

完成自定義表單後,選擇Publish 。 考慮自己使用註冊表單來檢查它是否正常運行。 然後,您可以查看新的電子郵件地址是否記錄在您的 Mailchimp 帳戶中。

您可能還想將此新表單添加到您網站的多個區域。 您可以將其保存為全局小部件以簡化此過程。

首先,找到表單右側的“編輯表單”圖標。 右鍵單擊它並選擇Save as a Global

因停機時間和 WordPress 問題而苦苦掙扎? Kinsta 是旨在節省您時間的託管解決方案! 查看我們的功能
將表單另存為全局
另存為全局。

這會將訂閱表單添加到您的Global Settings 。 當您添加新頁面或帖子時,您只需轉到GLOBAL ,找到預先設計的表單,然後將其拖放到您想要的任何位置:

立即在現場任何地方使用全局表格
將全局表單拖放到您想要的任何位置。

在考慮在您的網站上放置訂閱表單的位置時,您可能需要考慮可見性。 您可以在精心設計的目標網頁上收集更多潛在客戶,訪問者在進入您的網站時可以看到這些信息。 但是,用戶可能對這麼早訂閱不感興趣。

有時,更好的選擇是在您的內容或側邊欄中包含聯繫表格。 雖然這比登陸頁面的知名度略低,但此展示位置可以讓訪問者在與您的網站交互時進行訂閱。

將表單添加到頁腳也是一個實用的選擇。 滾動到您網站底部的用戶通常對您的內容感到好奇,這意味著他們更有可能訂閱。 但是,此位置不像其他選項那樣可見。

Elementor/Mailchimp 集成的頂級附加組件

使用最好的 WordPress 插件,您可以為您的受眾創建一個量身定制的網站。 Elementor Pro 為您提供了大量用於設計表單和集成 Mailchimp 等第三方服務的選項。

不過,您可能需要更高級的功能。 使用一些附加組件,您可以更好地控製表單的外觀和功能。

1. 基本插件

使用 Essential Addons 是擴展 Elementor 核心功能的好方法。 使用此工具,您可以訪問更多創意元素。 其中包括交互式功能,例如 Woo 產品網格、倒計時和可過濾圖庫:

Elementor 的基本插件
基本插件。

特徵:

  • 用於添加事件日曆、信息框、推薦等的高級內容小部件
  • WooCommerce 元素,例如產品畫廊、網格和輪播
  • 與 Mailchimp 和 Ninja Forms 等第三方平台集成

當您在 WordPress 網站上安裝 Essential Addons 時,您可以使用其 Form Styler Elements 集成 Mailchimp。 在這裡,您可以簡單地輸入您的 Mailchimp API 密鑰,這會將 EA Mailchimp 小部件添加到 Elementor 編輯器。 然後,您可以將小部件拖放到頁面上,並根據需要繼續自定義。

價格:一個網站的 Essential Addons 訂閱計劃起價為 39.97 美元。 它包括 70 多個小部件和 7 個擴展。

2.快樂插件

使用 Happy Addons,您可以從 400 多個預先設計的塊和小部件中進行選擇以導入到 Elementor 編輯器中。 為了加快創建過程,您可以設置設計預設。

Happy Addons 還可以從一個網站複製元素並將它們粘貼到具有不同域的網站中:

Elementor 的快樂插件
快樂的插件。

特徵:

  • 部分嵌套
  • 跨域複製粘貼
  • 400 多個預製設計集

在 Happy Addons 設置中的Credentials下輸入 Mailchimp API 密鑰後,您可以使用 Elementor 將 Mailchimp 表單小部件拖放到頁面上。

然後,您可以編輯該工具的高級設置以自定義表單邊距、顏色和版式。 您還可以重新設計字段和按鈕,使其具有獨特的背景、陰影、字體大小和間距。

價格:Happy Addons 為一個網站提供起價為 39 美元的年度訂閱計劃。

3.元素套件

與此列表中的其他選項一樣,ElementsKit 是一個多合一的插件包,帶有 Elementor 的額外小部件和擴展。 在編輯頁眉、頁腳或菜單等功能特性時,它可以提供更多自定義功能。

此外,如果您找不到適合您的選項,ElementsKit 還包括一個自定義小部件構建器:

ElementsKit 插件
元素套件。

特徵:

  • 自定義控件,例如 Multi Widgets、AjaxSELECT2 和 Image-Picker
  • 85 多個小部件和擴展
  • 500 多個預先設計的網絡塊

您可以使用 ElementsKit 通過 Elementor 編輯器完全集成 Elementor 和 Mailchimp。 您只需將 Mailchimp 小部件拖放到頁面上並定義 API 密鑰。 然後,您可以將自定義字段和圖標添加到表單中。

價格:一個站點的 ElementsKit 年度計劃起價為 39 美元。

4. Plus插件

Plus Addons 將自己宣傳為為每個人構建的 Elementor 工具。 借助現成的模板和深入的 YouTube 教程,即使是初學者也可以快速學習如何設計功能性網站。

此外,Plus Addons 還包含豐富的小部件,為設計師提供可定制的功能:

Elemenotr 的 Plus 插件
加號插件。

特徵:

  • 96 多個高級 Elementor 小部件
  • 顯示產品、博客文章和圖片庫的列表選項
  • 易於使用的構建器,專為自定義帖子類型而設計

Plus Addons 工具提供了集成 Elementor 和 Mailchimp 的最簡單方法之一。 從您的 Mailchimp 帳戶中,複製您的受眾的 API 密鑰和列表 ID。 然後,轉到API 連接設置並粘貼此信息。 在此之後,您可以拖放 Mailchimp 訂閱小部件並編輯其佈局和結構。

價格:Plus Addons 有免費版本。 但是,它的計劃選擇包含更多小部件和擴展。 這些套餐起價為每年 31 美元。

Mailchimp 元素。 了解如何在這些工具的幫助下提升服務水平️ Click to Tweet

概括

儘管將 Mailchimp 和 Elementor 結合起來似乎令人生畏,但任何人都可以集成這兩個工具。 通過這樣做,您可以創建滿足您對外觀和功能的期望的自定義訂閱表單。

回顧一下,以下是在您的網站上集成 Elementor 和 Mailchimp 的五個簡單步驟:

  1. 註冊一個 Mailchimp 帳戶。
  2. 創建受眾和 API 密鑰。
  3. 使用 Elementor 設計 Mailchimp 註冊表單。
  4. 連接 Mailchimp。
  5. 將您的表單添加到您的網站。

電子郵件營銷和設計對於您網站的成功至關重要。 您還需要與專門的 WordPress 託管服務提供商合作。 在 Kinsta,我們的託管計劃可以將您網站的性能提升到一個新的水平。 欲知更多請聯絡我們!

您對集成 Elementor 和 Mailchimp 有任何疑問嗎? 在下面的評論部分詢問我們!