在表單編輯器中以兩種方式或在外部樣式表中使用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的開發人員幫忙來解決表單嵌入代碼。
Forms