如何在您的 WordPress 表單中包含添加到日曆選項

已發表: 2018-11-29

您想在 WordPress 表單中包含“添加到日曆”選項嗎?

在您的網站上註冊後,為網站訪問者提供一種簡單的方法將活動日期添加到他們的日曆中,這是人們會喜歡的一種額外的個人風格。 如果您願意,也可以隨時將此選項添加到表單的確認或電子郵件通知中。

在本文中,我們將向您展示如何在您的 WordPress 表單中添加“添加到日曆”選項,以便網站訪問者從他們在您的網站上提交表單的那一刻起就可以開始計劃您即將舉行的活動。

第 1 步:創建一個 WordPress 表單

您需要做的第一件事是安裝並激活 WPForms 插件。 有關更多詳細信息,請參閱有關如何在 WordPress 中安裝插件的分步指南。

在我們的示例中,我們將創建一個簡單的生日聚會 RSVP 表單,人們可以填寫並提交該表單。 如需這一步的幫助,請務必查看本教程,了解如何使用 Form Templates Pack Addon 在 WordPress 中創建 RSVP 表單。

這是我們的 RSVP 表單在表單編輯器中的樣子:

WPForms 是最好的 WordPress Form Builder 插件。 免費獲取!

生日派對 rsvp 表格

要將一條小消息添加到您的表單中,讓人們知道聚會的時間,只需將HTML表單字段從左側拖到右側即可。 然後單擊該字段進行更改。

這是我們添加到表單中的內容:

自定義 rsvp 表單

在我們網站的前端,這是 RSVP 表單的樣子:

最終生日 rsvp 表格

現在是時候將“添加到日曆”選項包含到您的表單中了。

第 2 步:在 Google 日曆中創建活動

在將日曆選項添加到我們的表單之前,我們要做的第一件事是在 Google 日曆中創建一個事件。

為此,請登錄您的 Google 帳戶並轉到您的 Google 日曆。 然後,填寫活動詳情。

谷歌日曆中的事件創建

單擊保存,以便將您的活動保存到您的日曆中。

然後,從標記為More actions的下拉菜單中,選擇Publish event

發布事件

當您這樣做時,將出現一個彈出式模式,其中包含指向您的活動的鏈接。 您需要復制 HTML 代碼以在您的 WordPress 表單上使用。

html代碼

為了讓您的網站訪問者看到您發布的活動,您需要確保您的 Google 日曆設置為“公開”。

要將您的 Google 日曆更改為“公開”以供所有人查看,請先從日曆的下拉列表中選擇“設置”

谷歌日曆設置

然後,單擊要公開的日曆,向下滾動到訪問權限,然後單擊公開復選框。

公開日曆

公開您的 Google 日曆將使全世界都能看到您的所有日曆活動,即使通過 Google 搜索也是如此。 如果您的日曆上有私人事務,建議您為您希望網站訪問者添加到他們自己日曆中的事件創建一個單獨的 Google 日曆。

現在您的活動已準備好添加到您的 WordPress 表單中。

第 3 步:在您的 WordPress 表單中添加添加到日曆選項

您可以在表單上的多個位置包含“添加到日曆”選項:

  1. 關於表格本​​身
  2. 形式確認
  3. 在電子郵件通知中

首先讓我們看看如何將“添加到日曆”選項包含到您的實際表單中。

如果您還沒有,請將HTML表單字段從左側面板拖動到右側面板,將其添加到您的事件表單中。

我們從一開始就添加了此表單字段,因為我們希望確保人們對我們的活動有所了解。

添加HTML表單字段後,單擊它進行更改。 將 Google 日曆中的代碼粘貼到代碼部分:

將html代碼添加到事件表單

點擊保存。 這是添加到日曆選項在我們前端表單上的樣子:

最後添加到日曆選項

當站點訪問者單擊標有Google 日曆的 CTA 按鈕時,Google 將打開並提示他們登錄其帳戶。 然後該事件將與您添加的所有詳細信息一起顯示,以便他們可以選擇將其保存到自己的日曆中。

現在,如果您不想在實際的 WordPress 表單上添加“添加到日曆”選項,您可以隨時在表單的確認或通知中添加指向您的活動的鏈接。

第 4 步:在表單的確認消息中包含“添加到日曆”選項

表單確認是網站訪問者在您的網站上提交表單後顯示給他們的消息。 他們讓人們知道他們的表格已經通過,並為您提供機會讓他們知道下一步是什麼。

WPForms 有三種確認類型可供選擇:

  1. 信息。 這是 WPForms 中的默認確認類型。 當站點訪問者提交您的 RSVP 表單時,會出現一條簡單的消息確認,讓他們知道他們的表單已通過。
  2. 顯示頁面。 這種確認類型會將網站訪問者帶到您網站上的特定網頁,感謝他們的回复。 如需幫助,請查看我們關於將客戶重定向到感謝頁面的教程。
  3. 轉到 URL(重定向)。 當您想要將站點訪問者發送到不同的網站時使用此選項。

對於我們的活動表單,我們將創建一條確認消息,完成添加到日曆選項,以便網站訪問者可以立即將我們即將舉行的活動添加到他們的 Google 日曆中。

首先,單擊“設置”下表單編輯器”中的確認”選項卡。

接下來,選擇您要創建的確認類型。 對於此示例,我們將選擇Message

確認訊息

因為我們在表單確認中添加了將您的活動添加到日曆的選項,所以我們有兩個選項:

  1. 創建一條簡單的消息,在消息中添加添加到日曆選項,無論人們是否參加
  2. 創建多個表單確認並啟用智能條件邏輯,以便只有那些將參加或可能參加的人才能看到帶有“添加到日曆”選項的確認消息

為簡單起見,我們將創建一條確認消息,向所有站點訪問者顯示他們是否計劃參加活動。 當您將 Google 日曆中的 HTML 代碼添加到您的確認消息時,請務必點擊文本選項卡。

表單確認信息

這是當有人提交 RSVP 表單時表單確認的樣子:

表單確認示例

同樣,您的站點訪問者需要做的就是單擊 Google 日曆按鈕並將您的活動添加到他們自己的日曆中。

如果您想創建多個表單確認並使用條件邏輯根據他們的 RSVP 答案向人們顯示不同的消息,請查看有關創建條件表單確認的教程。

第 5 步:在表單的電子郵件通知中包含“添加到日曆”選項

您可以在 WordPress 表單上添加添加到日曆選項的最後一個位置是人們在您的網站上提交表單時收到的電子郵件通知中。

但在我們開始討論如何執行此操作之前,您需要確保您的 RSVP 表單上有一個電子郵件表單字段,在我們的示例中我們沒有。 這是 WPForms 知道通過電子郵件向您的網站訪問者發送通知的唯一方式。

將電子郵件表單字段添加到事件表單後,轉到表單編輯器中的設置»通知

WPForms 通知設置

默認情況下,當有人在您的網站上提交表單時,您將始終收到電子郵件通知。

但是,為了確保網站訪問者也收到通知,您需要使用智能標籤將網站訪問者的電子郵件添加到電子郵件通知中。

為此,請單擊顯示智能標籤

表單通知智能標籤

接下來,從下拉菜單中選擇電子郵件選項,以便 WPForms 知道向站點訪問者在 RSVP 表單中輸入的電子郵件發送電子郵件通知。

通知智能標籤

現在是使用“添加到日曆”選項自定義消息的時候了。

向下滾動到消息並添加您希望人們在他們的電子郵件中看到的消息。 您可以在此處粘貼 Google 日曆中用於添加到日曆選項的 HTML 代碼。

通知消息

現在,每當有人填寫您的活動表單時,他們都會收到一條通知,其中包含我們在所有其他步驟中看到的相同Google 日曆按鈕。

最後的想法

你有它! 您現在知道如何將“添加到日曆”選項添加到您的 WordPress 表單中,以便網站訪問者可以輕鬆地將您即將舉行的活動添加到他們自己的 Google 日曆中。

如果您正在為活動或預訂製作表格,您也會喜歡這份關於如何使用日期選擇器製作 WordPress 表格的指南。

您知道嗎,您可以讓訪問者將日曆事件添加到共享的 WordPress 日曆中? 這是我們為用戶提交的事件添加表單的簡單指南。

如果您擔心所有網站訪問者都看到並填寫您的活動表單,請知道 WPForms 允許您啟用特定的表單權限,以便只有擁有密碼的人才能填寫和提交您的活動表單。 如需此步驟的幫助,請查看有關如何使用密碼保護您的 WordPress 表單的易於遵循的教程。

你還在等什麼? 立即開始使用最強大的 WordPress 表單插件。

不要忘記,如果您喜歡這篇文章,請在 Facebook 和 Twitter 上關注我們。