跳到內容
請注意::這篇文章的翻譯只是為了方便而提供。譯文透過翻譯軟體自動建立,可能沒有經過校對。因此,這篇文章的英文版本應該是包含最新資訊的管理版本。你可以在這裡存取這些內容。

在 HubSpot 頁面上設定和樣式表單 (傳統)

上次更新時間: 2025年4月30日

可搭配下列任何訂閱使用,除非另有註明:

所有產品和版本

在 HubSpot 中建立表單後,您可以將其新增至 HubSpot 頁面上的任何表單模組。在每個頁面上,您也可以 設定表單提交後的情況 ,以及自訂表單元素的樣式,例如提交按鈕和表單欄位。

請注意:建議使用更新的表單編輯器來建立和管理表單。本文僅適用於使用舊版編輯器建立的現有表單。進一步了解HubSpot 頁面上的表單樣式

開始之前

在 HubSpot 頁面上設定表單之前,請注意下列事項:

  • 設定和樣式變更只適用於所選頁面上的表單模組。任何設定和樣式變更都不會影響您在其他頁面上的表單。
  • 更新表單內容(如表單欄位)將更新所有其他頁面上的表單,包括任何內嵌表單或獨立表單頁面

設定您的表單

在 HubSpot 頁面上設定表單:
  • 導覽到您的內容:

    • 網站頁面:在你的 HubSpot 帳戶中,瀏覽「內容」>「網站頁面」。
    • 登陸頁面:在你的 HubSpot 帳戶中,瀏覽「內容」>「登陸頁面」。 著陸頁面
  • 按一下您的頁面名稱
  • 在內容編輯器中,按一下表單模組。如果您的頁面目前沒有表單模組,請學習如何為頁面新增模組
  • 在左側面板的內容 索引標籤中,自訂此頁面的表單設定:
    • 表單標題: 輸入表單的名稱
    • 選擇表單為此頁面選擇
      • 若要使用現有表單,請按一下下拉功能表,然後選擇一個表單
      • 若要建立並使用新表單,請按一下動作>建立新表單。進一步瞭解如何設定表單
      • 若要檢視此表格的提交內容,請按一下 [動作>檢視表格提交內容]。
      • 若要複製此表單,請按一下作業> 複製表單
      • 若要檢視使用選取表單的任何其他頁面,請按一下 [動作>使用此表單的頁面]。
      • 若要在表單編輯器中編輯表單,請按一下 [動作>移至完整表單編輯器]。



自訂表單內容

編輯表單欄位、按鈕文字、資料隱私與同意選項:

  • 按一下以展開 [表單內容 ] 區段。
  • 設定您的表單內容:
    • 表單欄位:按一下並拖曳欄位,以編輯顯示在表單中的順序。多欄表單或自訂模組的表單欄位無法拖放。若要新增其他表單欄位,請
      • 按一下+ 新增另一個表單欄位
      • 按一下Choose a property (選擇屬性) 下拉式功能表,並使用搜尋列搜尋欄位
      • 按一下屬性,將其新增為表單欄位。
    • 按鈕文字:輸入要顯示在提交按鈕上的文字
    • 資料隱私和同意選項:在下拉式功能表中,選擇要顯示的通知和同意資訊
    • Captcha (SPAM prevention):按一下以切換Captcha (SPAM prevention)開關,以顯示Google 的隱形 reCAPTCHA

請注意: 更新您的表單內容將更新使用表單的任何其他頁面上的表單,包括任何內嵌表單或獨立表單頁面



KB - Drag Drop Fields Form HubSpot-1

設定提交後的動作

預設情況下,新增至 HubSpot 頁面的表單將會顯示 Thanks for submitting the forminline message。表單不會顯示在表單編輯器中設定的提交後動作。

在頁面編輯器中,您可以自訂不同的提交後動作。若要設定表單提交後的動作,請按以下步驟:

  • 按一下以展開Thank you區段。
  • 提交表單後 訪客會看到什麼 部分,設定提交後的動作:
    • 重定向至其他頁面: 表單提交後,將訪客重定向至其他頁面。
      • 按一下重新導向到其他頁面
      • 按一下重定向連結下拉式功能表,然後選擇現有的 HubSpot 頁面或輸入URL
    • 顯示內線感謝訊息:在訪客提交表單後顯示訊息。 您可以在文字方塊中輸入感謝訊息

設定您的表單自動化

您可以管理表單自動化,例如建立聯絡人和行銷電子郵件選項,以及與表單相關的任何工作流程。註冊觸發器須遵守下列行為:

  • 在表單模組的自動化設定中加入工作流程時,對應的表單提交註冊觸發器會加入工作流程。
  • 從表單模組的自動化設定中移除工作流程,也會從工作流程的註冊觸發器中移除該工作流程。
  • 如果工作流程中使用的表單註冊觸發器未指定頁面,則觸發器不能從頁面中移除,而必須從工作流程中移除。

若要為您的表單設定自動化設定,請按一下左側面板中的表單自動化以展開該部分,然後檢視下列自動 化選項:

new-form-automation-section-in-form-module

  • 永遠為電子郵件地址建立新聯絡人:每次以新的電子郵件地址提交表單時,都會建立新的聯絡人記錄,不論表單提交中是否有任何與現有聯絡人相符的 usertokens
  • 將建立的聯絡人設定為行銷聯絡人: 將透過此表單建立的任何聯絡人設定為行銷聯絡人
  • 以電子郵件進行後續追 向已提交表單的訪客傳送後續追蹤電子郵件。後續追蹤電子郵件只能傳送給行銷聯絡人。
    • 若要新增後續追蹤電子郵件,請
      • 按一下選取電子郵件 +
      • 在對話方塊中,按一下Select an email (選擇電子郵件 ) 下拉式功能表,然後選擇現有的自動電子郵件 ,或按一下Create new email (建立新電子郵件),以建立新的自動電子郵件
      • 按一下儲存。選取的追蹤電子郵件將顯示在左側面板中。
      • 設定後續追蹤電子郵件後,在右上方按一下「發佈」 「更新」,即可啟用這些變更。在變更發佈之前,追蹤電子郵件將不會啟用。
    • 若要變更所使用的後續追蹤電子郵件,請將滑鼠停留在電子郵件上,然後按一下電子郵件旁邊的鉛筆圖示
    • 若要移除追蹤電子郵件,請將滑鼠停留在電子郵件上,然後按一下電子郵件旁邊的X 圖示 。該電子郵件應不再顯示。
    • 如果表單先前與舊版後續追蹤電子郵件相關聯,則會顯示警示此表單正在使用舊版後續追蹤電子郵件。雖然傳統的後續追蹤電子郵件無法編輯,但如果電子郵件先前已發佈,則可以更新為自動化電子郵件。更新後的自動化電子郵件就可以編輯。
      • 若要將舊有跟進電子郵件更新為可編輯的自動化電子郵件,請按一下更新電子郵件。然後按一下更新。如果先前未發佈電子郵件,則不會顯示此選項。
      • 若要移除已發佈或未發佈的傳統追蹤電子郵件,請按一下移除。然後按一下移除
  • 連接的工作流程:會顯示使用表單作為註冊觸發器的任何工作流程和簡單工作流程。進一步瞭解如何使用表單自動化
    • 若要將表單用作工作流程的觸發器,請按一下將表單加入工作流程將表單加入其他 工作流程
      • 单击将表单添加到工作流
      • 選擇現有工作流程 ,或按一下建立工作流程以建立新工作流程。如果您建立新的工作流程,請先設定工作流程,然後再返回登陸頁面或網站頁面的表單模組。
    • 若要新增另一個工作流程,請按一下新增表單至另一個工作流程,然後選擇現有的工作流程 或按一下建立新的工作流程。
    • 若要移除表單作為工作流程的觸發器,請將滑鼠懸停在工作流程上,然後按一下工作流程旁的刪除圖示

請注意

  • 一旦工作流程附加到表單模組,即使頁面尚未發佈或更新,它也會立即更新工作流程註冊觸發器。
  • 如果您克隆了一個HubSpot頁面,而該頁面上的表單被設置為在工作流程中註冊聯繫人,那麼在新的、被克隆的頁面上提交的表單將不會被添加為工作流程中新的註冊觸發器。




配置其他表單選項

您也可以設定其他設定,例如選擇您的表單通知收件人。此外,如果您已安裝HubSpot-Salesforce 整合,您也可以將表單與活動中的 Salesforce 活動相關聯。

若要設定表單的其他選項,請捲動至左側面板底部,然後設定下列選項:

  • 將表單通知傳送至指定的電子郵件地址,而非表單預設值:預設情況下,表單提交通知將傳送至在表單的選項索引標籤中新增的任何收件者。若要覆寫 表單的預設收件者,並選擇在此頁面提交的通知收件者:
    • 按一下以開啟「傳送通知至指定的電子郵件地址而非表單預設值 」開關。
    • 按一下電子郵件地址下拉式功能表並選擇您的收件人。只有 HubSpot 使用者可以被選為表單通知收件人。
    • 若要移除收件人,請按一下收件人電子郵件地址旁的X 圖示
  • Salesforce 活動: 如果您已啟用 Salesforce 整合,您可以按一下下拉式功能表並選擇活動,將表單與活動中的 Salesforce 活動連結。進一步瞭解如何將表單與 Salesforce 活動相關聯

在 HubSpot 頁面上設定表單樣式

您可以自訂整體表單的樣式,以及對提交按鈕或表單欄位作特定樣式變更。要自訂表單的樣式,請執行下列步驟

  • 導覽到您的內容:
    • 網站頁面:在你的 HubSpot 帳戶中,瀏覽「內容」>「網站頁面」。
    • 登陸頁面:在你的 HubSpot 帳戶中,瀏覽「內容」>「登陸頁面」。 著陸頁面
  • 在內容編輯器中,按一下表單模組。如果您的頁面目前沒有表單模組,請學習如何為頁面新增模組
  • 在左側面板頂端,按一下樣式索引標籤。
  • 按一下模組欄位按鈕索引標籤,選擇您想要樣式的表單元素。
  • 使用下方的文字和對齊方式選項,自訂表單的選取元素。
  • 按一下 [發佈] [更新] ,即可將您對頁面所做的變更生效。

請注意: 出現在 HubSpot 頁面上的表單只能逐頁自訂樣式。 外部頁面上的嵌入式表單獨立表單頁面必須在表單編輯器中設定樣式,或在外部樣式表中使用 CSS 設定樣式。


這篇文章有幫助嗎?
此表單僅供記載意見回饋。了解如何取得 HubSpot 的協助