上次更新時間： 一月 20, 2023
在表單編輯器中以兩種方式或在外部樣式表中使用CSS來設定您在外部頁面上的嵌入式HubSpot表單的風格。
在窗體編輯器中
佈景主題
如果您想在不寫入任何自訂代碼的情況下為表單設定風格，您可以將預設主題套用至嵌入式表單或獨立表單頁面。 除了任何全 局表單風格設定外，主題還會在表單中新增更多自訂選項。
- 在 HubSpot 帳戶中，進入「行銷」>「商機擷取 」>「表單」。
- 按一下表單的名稱 。
- 在表單編輯器中，按一下「風格與預覽」標籤。
- 在左側窗格「主題」部分，清除「 保留舊主題」 核取方塊。
請注意：清除「保留舊主題」核取方塊將移除應用於此表單的先前預設的HubSpot風格。 您已添加到表單的任何自定義CSS或JavaScript都不再工作。 此核取方塊僅適用於傳統表單，不適用於您帳戶中建立的任何新表單。
- 選擇四個主題之一。
樣式（僅限營銷中心入門、專 業、企業或傳統營銷中心基本）
除了主題外，您還可以在更細緻的層級上設定嵌入式表單的風格。
- 在 HubSpot 帳戶中，進入「行銷」>「商機擷取 」>「表單」。
- 按一下表單 的名稱。
- 在表單編輯器中，按一下「 風格與預覽 」標籤。
- 在左側窗格中，按一下>風格 部分以展開它。 在這裡，您可以設定表單欄位寬度、字體族羣、字體大小、字體顏色和表單按鈕的風格。
這些風格會根據個別表單設定，並將覆蓋全局表單風格設定。
請注意：表單編輯器中設置的主題和風格只適用於嵌入表單或獨立表單頁面。 HubSpot頁面上的表單只能使用內容編輯器 中的表單模組風格選項來設定樣式。
外部樣式表中包含CSS （僅限Marketing Hub Professional 、Enterprise或Legacy Marketing Hub Basic ）
- 在 HubSpot 帳戶中，進入「行銷」>「商機擷取 」>「表單」。
- 按一下表單的名稱。
- 在表單編輯器中，按一下「風格與預覽」標籤。
- 按一下以切換設置為原始HTML表單開啟。 表單將在外部頁面上呈現為原始HTML元素，而不是在iframe內，並且將移除應用於表單的任何預設HubSpot造型。
- 按一下右上角的「分享」。
- 在「」對話方塊中，按一下複製以複製表單嵌入代碼。
- 將表單嵌入代碼添加到您的外部頁面。 如果您已經嵌入表單，您必須將現有的嵌入代碼替換成這個新的無樣式版本。
- 嵌入表單後，您可以使用CSS在外部樣式表中樣式表。
- 或者，您可以修改表單嵌入代碼以進行額外的表單自訂。 由於HubSpot表單是用JavaScript建造的，而不是HTML建造的，因此 需要一位熟悉如何使用JavaScript的開發人員幫忙來解決表單嵌入代碼。