使用新的表單編輯器(BETA)建立和編輯表單
上次更新時間: 十一月 15, 2024
透過新的表單編輯器建立和使用表單來收集有關訪客的資訊以儲存在 HubSpot CRM 中。使用新的表單編輯器時,您可以建立多步驟表單。然後,設計您的表單以反映您企業的身份和品牌。
建立表單後,您可以使用 HubSpot 表單模組將其新增至 HubSpot 頁面、使用表單嵌入程式碼的外部站點,或使用共用連結將其作為獨立頁面共用。
建立一個新表單
若要建立新表單:
- 在你的 HubSpot 帳戶中,瀏覽「行銷」>「表單」。
- 點選右上角的「建立表單」 。
- 若要將表單與業務單位關聯,請按一下選擇業務單位下拉式選單,然後選擇要與該表單關聯的業務單位。
- 選擇您的新表單編輯器。
- 點選右上角的「下一步」 。
- 點擊頂部的edit鉛筆圖示以編輯表單名稱。您必須發佈表單才能更新表單名稱。
新增和編輯表單字段
新增表單欄位以收集網站訪客和聯絡人的資訊。每個表單欄位必須與 HubSpot 屬性關聯。若要新增表單欄位:
- 在您的 HubSpot 帳號中,導覽至Marketing > Lead Capture > Forms 。
- 建立新表單或將滑鼠懸停在現有表單上,然後按一下「編輯」。
- 點擊左上角的+ 新增圖示。
- 在左側面板中,按一下欄位類型並將其拖曳到右側的表單預覽上,以將其包含在表單中。欄位可以放置在其他欄位的上方、下方或旁邊。
- 在右側面板中,按一下 並輸入欄位標籤。輸入欄位標籤時,將出現類似現有屬性的清單。
- 在「將欄位連接到屬性」對話方塊中,按一下建議的屬性。
- 若要將表單欄位連接到其他屬性,請按一下「搜尋屬性」 。
- 若要新增連線的屬性,請在左側面板中按一下以展開「連線的屬性」部分。按一下要連接到表單欄位的屬性。
- 若要將現有屬性用作表單上欄位的連線屬性,請使用搜尋列搜尋現有屬性。新增欄位的物件類型可以決定表單提交是否出現在關聯記錄的活動時間軸上。
請注意:
- 預設情況下,提交表單時需要電子郵件欄位來建立聯絡人。 HubSpot 將在允許使用者提交表單之前檢查電子郵件地址是否有效。詳細了解如何允許在沒有電子郵件地址的情況下提交表單來建立聯絡人。
- 分數、計算和富文本屬性不能在表單中使用。
- 若要建立新屬性並將其用作表單上欄位的連線屬性,請按一下新建。
- 新增表單欄位後,要編輯欄位的選項:
- 在右側面板中,按一下表單預覽中的欄位.
- 在左側面板中,按一下展開「欄位選項」部分。此處的選項可能會根據欄位的屬性類型而有所不同,請了解有關可用的其他欄位自訂選項的更多資訊。
- 說明文字:欄位標籤下方的資訊文本,可協助訪客完成此欄位。
- 佔位符文字:出現在欄位輸入框中的文字。當訪客在欄位中輸入值時,文字將消失,並且即使欄位留空,也不會在提交中出現。
- 預設值:除非訪客更改,否則將預設為該欄位提交的值。
- 隱藏欄位:開啟此選項時,此欄位將透過表單提交設定其值,但該欄位不會向訪客顯示。啟用該設定後,設定提交表單時將傳遞到屬性的預設值。
- 必填欄位:開啟此選項後,必須填寫該欄位才能提交表單。如果表單欄位已按要求設置,則不能將其設為隱藏。
新增額外的表單元素
在您的表單中添加其他文字和媒體或安全性和隱私。與表單欄位類似,這些元素可以放置在其他欄位的上方、下方或旁邊。在測試版中,某些元素可能無法使用。
- 在你的 HubSpot 帳戶中,瀏覽「行銷」>「表單」。
- 建立新表單或將滑鼠懸停在現有表單上,然後按一下「編輯」。
- 點擊左上角的+ 新增圖示。
- 在左側面板中,按一下「其他」 。
- 按一下元素並將其拖曳到右側的表單預覽上,以將它們包含在表單中。
在表單中新增條件邏輯(僅限Content Hub或Marketing Hub Professional和Enterprise )
新增表單欄位後,您可以設定條件邏輯來隱藏或顯示相關字段,或根據訪客先前的回應將其重新導向至其他 HubSpot 頁面。
對於每個表單,您最多可以新增 30 個規則,每個規則有 10 個條件。
若要在表單上設定條件邏輯:
- 在你的 HubSpot 帳戶中,瀏覽「行銷」>「表單」。
- 建立新表單或將滑鼠懸停在現有表單上,然後按一下「編輯」。
- 點選左上角的githubBranch邏輯圖示。
- 在左側面板中,按一下「新增邏輯」 。
- 在邏輯部分中,配置條件邏輯規則。例如,如果您按城市過濾並選擇“都柏林”,條件邏輯規則將僅適用於值為“都柏林”的記錄。
- 若要刪除過濾器,請按一下deletee刪除圖示。
- 若要複製過濾器,請按一下duplicate複製圖示。
- 若要為規則新增其他篩選器,請按一下add將篩選器新增至此群組」 。
- 若要將其他群組新增至規則中,請add一下新增新增群組。
- 如果您已向規則新增多個篩選器或群組,請按一下篩選器和群組之間的AND OR下拉選單以套用AND或OR邏輯:
- AND :規則中的所有篩選器都必須為 true才能觸發規則。
- OR :群組中只有一個過濾器必須為 true 才能觸發規則。 了解有關 AND 或 OR 邏輯的更多資訊。
- 在「然後」部分中,按一下下拉式功能表以選擇表單上的動作。您可以從以下選項中進行選擇:
- 顯示欄位:如果使用者的回應符合規則中設定的條件,則顯示特定欄位。
- 隱藏欄位:如果使用者的回應符合規則中設定的條件,則顯示特定欄位。
- 跳到步驟:如果使用者的回應符合規則中設定的條件,則跳到特定步驟。若要使用此選項,表單必須至少包含三個步驟。了解有關新增表單步驟的更多資訊。
- 重新導向至:如果使用者的回應符合規則中設定的條件,則將其重新導向至 HubSpot 頁面或外部 URL。 Sales Hub Enterprise或Service Hub Enterprise帳戶中的使用者可以將表單重新導向到安排頁面上的會議連結。
- 根據所選操作,填寫必填欄位。
- 若要套用條件邏輯,請按一下「儲存並啟動」。
管理條件邏輯規則
- 在你的 HubSpot 帳戶中,瀏覽「行銷」>「表單」。
- 建立新表單或將滑鼠懸停在現有表單上,然後按一下「編輯」。
- 點選左上角的githubBranch邏輯圖示。
- 若要新增其他規則,請按一下「新增邏輯」 。
- 若要編輯規則,請按一下操作下拉式功能表並選擇編輯。
- 若要刪除規則,請按一下操作下拉式功能表並選擇刪除。
新增和編輯表單步驟
請注意:此功能僅適用於Marketing Hub 、 Sales Hub或Service Hub Starter 、 Professional和Enterprise或Content Hub Enterprise 。
建立多步驟表單以鼓勵使用者完成多個表單片段而不是單一長表單。若要在多步驟表單中新增表單步驟:
- 在您的 HubSpot 帳號中,導覽至Marketing > Lead Capture > Forms 。
- 建立新表單或將滑鼠懸停在現有表單上,然後按一下「編輯」。
- 在右側面板中,將滑鼠懸停在兩個現有步驟之間,然後按一下+ 新增圖示。將出現一個新的步驟部分。然後,您可以在步驟面板中設定表單欄位和其他表單元素。
- 若要重新排列步驟的順序,請將滑鼠停留在該步驟上。然後,在步驟的左上角,點擊並拖曳步驟 [x]以重新定位它。
- 若要複製步驟,請將滑鼠懸停在該步驟上並點擊duplicate複製圖示。您無法複製包含電子郵件、reCAPTCHA 或資料隱私欄位的步驟。
- 若要刪除步驟,請將滑鼠懸停在該步驟上並按一下delete圖示。
- 進度條直觀地指示使用者已完成的表單數量,從而提高表單完成率。編輯進度條:
- 將滑鼠懸停在進度欄上並點擊edit鉛筆圖示。
- 在左側面板中,您可以編輯進度條並打開或關閉它:
- 預設情況下,進度條會新增到所有表單中。若要關閉進度欄,請關閉進度欄開關。這將從所有表單步驟中刪除進度列。
- 在「格式」部分中,選擇文字在進度列上的顯示方式。您可以從以下選項中進行選擇:顯示完成百分比、顯示步驟數或不顯示文字。
請注意:
- 只有當訪客提交了表單的所有步驟後,表單提交才會完成。如果訪客已完成第一步,但未完成表單的其餘部分,則第一步中的欄位將不會提交到表單。
- 每個表單最多可以新增20 個步驟。
編輯步驟佈局和背景橫幅
使用快速佈局切換器從預先定義的步驟佈局中進行選擇,並自訂表單背景橫幅。
- 在你的 HubSpot 帳戶中,瀏覽「行銷」>「表單」。
- 建立新表單或將滑鼠懸停在現有表單上,然後按一下「編輯」。
- 將滑鼠懸停在表單步驟上,然後點擊右上角的edit鉛筆圖示。
- 在左側面板中,選擇步驟佈局。
- 若要刪除佈局,請按一下右上角的刪除佈局。
- 點擊橫幅背景以展開該部分:
- 打開背景顏色開關以自訂表單的背景橫幅。
- 選擇顏色和不透明度。
- 點擊漸變下拉選單以新增漸層。
- 使用圖像作為橫幅背景。您可以從HubSpot 檔案上傳圖像、從電腦硬碟瀏覽圖像或使用AI 助理生成圖像。
設計您的表單
自訂表單和表單步驟的文字、輸入欄位、按鈕和背景。在「全域樣式」標籤中配置的樣式選項將會套用至所有表單步驟。您無法單獨設定各個表單步驟的樣式。
設定表單樣式:
- 在你的 HubSpot 帳戶中,瀏覽「行銷」>「表單」。。
- 建立新表單或將滑鼠懸停在現有表單上,然後按一下「編輯」。
- 點選左上角的樣式圖示。
- 自訂文字、輸入欄位或按鈕時,您可以使用快速欄位輸入樣式從現有樣式中進行選擇。或者,您可以手動自訂表單每個元件的樣式:
- 文字:自訂標題和正文文字的字體、字體大小和顏色。您可以選擇在標題文字中新增陰影,或在正文文字中新增突出顯示。
- 輸入字段:自訂字段,包括背景和邊框。您還可以自訂標籤的字體、字體大小和顏色,以及幫助文字、佔位符和錯誤文字的顏色。
- 按鈕:自訂按鈕的高度、圓角、背景、漸變,並為按鈕添加陰影。您也可以自訂按鈕文字的字體、字體大小和顏色。
- 背景:自訂表單和表單步驟的背景。您可以選擇設定背景顏色或使用圖像作為背景。您可以使用人工智慧助理來產生圖像。您也可以選擇為表單設定邊框。
自訂表單設定
配置表單的設置,包括提交表單後相應聯絡人的處理方式、使用者通知設定以及表單的預設語言。您可以設定聯絡人的行銷狀態、生命週期階段等。根據您的 HubSpot 訂閱,某些選項可能不會顯示。
- 在你的 HubSpot 帳戶中,瀏覽「行銷」>「表單」。
- 建立新表單或將滑鼠懸停在現有表單上,然後按一下「編輯」。
- 在左側面板中,按一下settings圖示。
- 在常規標籤上,配置以下常規表單設定:
- 始終從未知的電子郵件地址建立聯絡人:選擇此選項可為每個具有唯一電子郵件地址的提交建立新的聯絡人記錄。如果提交的電子郵件地址與資料庫中的現有聯絡人記錄匹配,則現有記錄的詳細資訊將被更新。
- 如果關閉此選項, HubSpot 將首先嘗試將提交內容與具有所提交電子郵件地址的現有聯絡人關聯起來。如果該電子郵件地址不存在聯絡人,HubSpot 將根據瀏覽器中的 cookie 識別並更新您的聯絡人。如果從同一裝置多次提交相同表單,則可能會導致聯絡人被覆蓋。
- 如果啟用此選項,當聯絡人在已存在 Cookie 的瀏覽器上使用不同的電子郵件提交表單時,將不會追蹤該聯絡人的檢視次數。使用已知值預先填入聯絡人欄位選項也將自動停用。
- 將建立的聯絡人設定為行銷聯絡人:如果您的 HubSpot 帳戶有權存取行銷聯絡人,您可以自動將提交此表單的任何聯絡人設定為行銷聯絡人。這包括新的和現有的聯絡人。
- 為回訪者預先填入欄位:如果聯絡人之前曾造訪您的網站並提交了表單,並且 HubSpot 能夠儲存和追蹤他們的 cookie,則可以在表單上預先填入任何已知的欄位值。預設啟用此選項, 以了解有關預填表單欄位的更多資訊。
- 加入行銷活動:如果您有Marketing Hub專業人員 或者 企業訂閱,您可以將表單與活動關聯:
- 若要將您的表單與現有行銷活動相關聯,請點擊「行銷活動」下拉式選單並選擇一個行銷活動。
- 若要將您的表單與新行銷活動相關聯,請按一下「行銷活動」下拉式選單,然後按一下「建立行銷活動」 。然後,繼續設定您的廣告活動。
- 始終從未知的電子郵件地址建立聯絡人:選擇此選項可為每個具有唯一電子郵件地址的提交建立新的聯絡人記錄。如果提交的電子郵件地址與資料庫中的現有聯絡人記錄匹配,則現有記錄的詳細資訊將被更新。
- 提交後,更新聯絡人和公司生命週期階段: 點擊“將生命週期狀態設定為”下拉式選單並選擇生命週期階段。當訪客提交表單時,任何新的或現有的記錄都會設定為選定的生命週期階段。
- 您無法向後移動記錄的生命週期階段。如果具有較晚生命週期階段的現有聯絡人或公司提交表單,則生命週期階段將不會更新。
- 表單中設定的生命週期階段將覆蓋 HubSpot 設定中配置的預設生命週期階段 。
- 提交後,更新聯絡人和公司生命週期階段: 點擊“將生命週期狀態設定為”下拉式選單並選擇生命週期階段。當訪客提交表單時,任何新的或現有的記錄都會設定為選定的生命週期階段。
- 若要自訂提交設置,請在左側面板中按一下「提交設定」標籤。自訂以下表單提交設定:
訪客電子郵件通知:勾選「向聯絡人擁有者發送提交電子郵件通知」複選框,以自動向聯絡人擁有者發送通知。如果聯絡人沒有所有者,則不會發送任何通知。了解有關HubSpot 中物件所有權的更多資訊。
提交電子郵件通知:按一下「將提交電子郵件通知傳送至」下拉式功能表可選擇要向其發送提交電子郵件通知的預設團隊或個人,無論聯絡人所有權為何。此處設定的收件者將被 HubSpot 頁面上的表單選項中設定的收件者覆蓋。
- 若要自訂表單語言設置,請按一下語言和區域標籤。按一下主要語言下拉式選單,然後選擇表單的預設語言。錯誤訊息、預設屬性標籤、說明文字、佔位符文字和預設值將翻譯成該語言。
- 若要建立表單的 AI 翻譯(僅限Marketing Hub或Content Hub Professional和Enterprise ):
- 開啟所有表單內容 AI 的啟用 AI 翻譯開關。
- 在主要語言下拉式選單中,選擇要將表單翻譯成的語言。錯誤訊息、預設屬性標籤、說明文字、佔位符文字、預設值、自訂標籤、富文本和同意文字將自動翻譯成該語言。
- 如果您在上次翻譯後更新了表單,請按一下「立即重新翻譯」以更新翻譯。
管理表單欄位的即時驗證
如果您為屬性設定了驗證規則,這些規則將應用於表單字段,並且訪客必須滿足這些要求才能提交表單。表單欄位的即時驗證可以為訪客提供有關其輸入的即時回饋,從而更輕鬆地更正錯誤並準確填寫表單。
例如,如果您已將「訂單號碼」屬性的驗證規則設定為僅包含數字值,則訪客將收到回饋以更正任何非數字條目。
預設情況下,表單上的即時驗證處於開啟狀態。若要開啟/關閉表單欄位的即時驗證:
- 在你的 HubSpot 帳戶中,點擊頂端導覽列中的settings「設定圖示」。
在左側邊欄選單中,導覽至「行銷」 > “表單” 。
- 按一下提交設定標籤。
- 開啟/關閉啟用表單欄位即時驗證開關。
- 點選左下角的“儲存”。
發布或分享您的表單
建立新表單或更新表單後,發布表單以使變更生效。然後,將其添加到您的 HubSpot 內容中,使用表單嵌入程式碼將其新增至外部頁面,或透過共用連結將其作為獨立頁面共用。
- 在您的 HubSpot 帳號中,導覽至Marketing > Lead Capture > Forms 。
- 建立新表單或將滑鼠懸停在現有表單上,然後按一下「編輯」。
- 點擊右上角的“發布”以發布表單更新。
- 若要將表單嵌入 HubSpot 頁面,請導覽至您的內容,然後新增表單模組並選擇表單。
- 若要共享您的表單或將其嵌入外部網站,請點擊右上角的共享,然後從以下選項中進行選擇:
- 取得嵌入程式碼:使用嵌入將表單新增至外部託管頁面。若要在外部頁面上追蹤表單的分析,必須在該頁面上安裝您的 HubSpot 追蹤程式碼。了解有關將 HubSpot 表單新增至外部網站的更多資訊。
- 在頁面底部,按一下「複製」 。
- 將嵌入程式碼貼到頁面上的 HTML 模組中。
- 複製共用連結:使用 URL 將表單共用為獨立頁面。
- 取得嵌入程式碼:使用嵌入將表單新增至外部託管頁面。若要在外部頁面上追蹤表單的分析,必須在該頁面上安裝您的 HubSpot 追蹤程式碼。了解有關將 HubSpot 表單新增至外部網站的更多資訊。