上次更新時間： 六月 28, 2023
在HubSpot中建立表單後，您可以將其新增至HubSpot頁面或您在HubSpot之外建立的頁面。 表格可以通過以下方式在您的外部非HubSpot託管網站上共享：
- 將表單代碼嵌入現有頁面。
- 建立一個可以連結到的獨立表單頁面。
使用任何一種方法，對HubSpot表單工具中的表單所做的更改都會自動反映在外部網站上的實時表單上。 新增表單後，您可以在表單編輯器的外部頁面上或在外部樣式表中使用CSS來輸入嵌入的HubSpot表單。
如果您正在使用WordPress ，請了解如何在WordPress文章或頁面上插入表單。更多
添加表單嵌入代碼
若要存取表單嵌入程式碼：- 在你的 HubSpot 帳戶中，瀏覽「行銷」>「吸引潛在商機客戶」>「表單」。
- 將遊標停留在表單上，然後按一下「操作」>「分享」。
- 在對話方塊中，如果要新增向Salesforce廣告活動提交表單的聯絡人，請按一下將聯絡人新增至Salesforce廣告活動下拉式選單，然後選擇一個廣告活動。 如果您將Salesforce廣告活動與您的表單關聯，表單的嵌入代碼將會變更。 在這種情況下，您必須重新將嵌入代碼添加到外部網站。
- 按一下複製。
- 將嵌入代碼貼到外部頁面的HTML模組中。 若要追蹤表單的分析，您的HubSpot追蹤代碼必須安裝在您放置HubSpot表單的外部頁面上。
建立獨立的表單頁面
您也可以透過「分享」連結分享表格。 在「分享」連結中，表單將以自己的URL顯示在獨立頁面上。 此分享連結無法隱藏或設為私密。 任何擁有分享連結的人都可以存取表格。
- 在你的 HubSpot 帳戶中，瀏覽「行銷」>「吸引潛在商機客戶」>「表單」。
- 將遊標停留在表單上，然後按一下「操作」>「分享」。
- 在對話方塊中，按一下分享連結標籤。
- 按一下複製，將表單頁面的URL複製到剪貼簿。
- 在瀏覽器中，開啟新視窗或分頁，並將表單頁面的網址貼在地址列中以加載。 您也可以直接與他人分享表單頁面URL ，讓他們可以存取表單。
在表單編輯器中設定嵌入表單的樣式
使用HubSpot表單編輯器設定嵌入表單樣式時，您可以使用主題或套用您自己的自訂樣式。
請注意：表單編輯器中設置的主題和樣式僅適用於嵌入式表 單或獨立表單頁面。 HubSpot網頁上的表單只能使用內容編輯器中的表單模組樣式選項進行樣式設定。
使用主題設定表單樣式
如果您想在不編寫任何自訂代碼的情況下設定表單樣式，您可以將預設主題套用到嵌入式表 單或獨立表單頁面。 除了任何全局表單樣式設定之外，這些主題還會為表單添加更多自訂選項。
若要使用主題設定表單樣式，請按照以下步驟操作
- 在你的 HubSpot 帳戶中，瀏覽「行銷」>「吸引潛在商機客戶」>「表單」。
- 將遊標停留在表單上，然後按一下「編輯」。
- 在表單編輯器中，按一下「 樣式與預覽 」標籤。
- 如果您正在編輯傳統表單，請在左側窗格中清除「 保留舊主題」 核取方塊。 這將移除應用於此表單的前預設HubSpot樣式。 您添加到表單中的任何自定義CSS或JavaScript都不再工作。 此核取方塊不適用於在您的帳戶中建立的任何新表單。
- 選擇一個主題。
- 在右上角，按一下 發佈 或 更新。
使用自定義樣式
如果您擁有HubSpot帳戶的Marketing Hub Starter、 Professional或Enterprise訂閱，您還可以在更精細的層面上設定嵌入式表單的樣式。
要應用自定義樣式：
- 在你的 HubSpot 帳戶中，瀏覽「行銷」>「吸引潛在商機客戶」>「表單」。
- 將遊標停留在表單上，然後按一下「編輯」。
- 在表單編輯器中，按一下「 樣式與預覽 」標籤。
- 在左側窗格中，按一下「 樣式」 部分。 在這裡，您可以設定表單欄位寬度、字體族、字體大小、字體顏色和表單按鈕。 這些樣式是根據個別表單設置的，並將覆蓋全局表單樣式設置。
- 自訂表單後，按一下右上角的「 發佈」 或「 更新」。
在外部樣式表中使用CSS樣式化嵌入式表單
如果您的HubSpot帳戶擁有Marketing Hub或CMS Hub Professional或Enterprise訂閱，您可以將表單嵌入為原始HTML表單，然後在外部樣式表中使用CSS為此嵌入表單設定樣式。
要使用CSS樣式化您的嵌入式表單：
- 在你的 HubSpot 帳戶中，瀏覽「行銷」>「吸引潛在商機客戶」>「表單」。
- 將遊標停留在表單上，然後按一下「編輯」。
- 在表單編輯器中，按一下 樣式與預覽 標籤。
- 按一下以切換「 設定為原始HTML表單」 開啟。 表單將呈現為外部頁面上的原始HTML元素，而不是在iframe中，並且應用於表單的任何預設HubSpot樣式都將被刪除。
- 在右上角，按一下發佈或更新。
- 將表單嵌入代碼添加 到外部頁面。 如果您已經嵌入表單，則必須將現有的嵌 入代碼 替換為這個新的非樣式版本。 嵌入表單後:
- 您可以使用CSS在外部樣式表中樣式化表單。
- 您也可以 修改表單嵌入程式碼 以進行額外的表單自訂。 由於 HubSpot表單是用JavaScript而不是HTML構建的，因此將表單嵌入代碼歸類需要知道如何使用JavaScript的開發人員的幫助 。
