編輯主題設定
上次更新時間: 2025年9月12日
主題是一套樣式和範本,您可以套用到 HubSpot 中的網頁和部落格文章。為了確保您的網頁內容看起來一致,所有使用相同主題的頁面和文章的樣式設定都會在主題設定中管理。
開始使用前
在您開始使用此功能之前,請務必充分瞭解應該提前採取哪些步驟,以及此功能的限制和使用此功能的潛在後果。
瞭解限制與注意事項
- 主題設定中可用的樣式選項取決於建立主題的網頁開發人員所包含的主題欄位選項。
- 知識庫使用主題的修改版本。瞭解有關編輯知識庫主題設定的更多資訊。
- 網頁內容的部分元素在帳戶設定的其他部分進行管理,包括:
- 公司標誌:在品牌套件中更新公司標誌。
- 導覽選單:選單顏色可在主題設定中設定,但您的導覽選單內容和連結則在導覽設定中管理。瞭解如何建立導覽選單,您可以在頁面編輯器內將其新增至全局頁頭或全局頁尾內容。
編輯主題設定
您可以從完整主題編輯器編輯使用該主題的任何頁面或文章的主題設定。如果超級管理員已將帳戶選擇為通用主題編輯器 (BETA),您也可以在內容編輯器中編輯網站和登陸頁面的主題設定。
-
導覽到您的內容:
- 網站頁面:在你的 HubSpot 帳戶中,瀏覽「內容」>「網站頁面」。
- 登陸頁面:在你的 HubSpot 帳戶中,瀏覽「內容」>「登陸頁面」。 著陸頁面
- 部落格:網誌: 在你的 HubSpot 帳戶中,瀏覽「內容」>「部落格」。
- 點選內容的名稱。
- 要為頁面和文章使用完整的主題編輯器:
- 在內容編輯器中,按一下「編輯 」功能表,然後在編輯器工具列中選擇「主題 」。例如,如果您使用的是Elevate 主題,請按一下「編輯」功能表,然後選擇「主題」:Elevate。
-
- 在主題編輯器中,按一下以展開相關部分(例如:顏色或按鈕),以編輯主題設定。
- 完成後,按一下Publish theme(發佈主題)。您會被導回內容編輯器。
- 若要在頁面中使用通用主題編輯器 (BETA):
- 在頁面內容編輯器中,按一下左側欄中的全局主題樣式圖示。
- 在左側欄中,按一下以展開相關部分(例如:顏色或按鈕),以編輯主題設定。變更將適用於使用該主題的所有頁面和範本。
瞭解主題樣式
在主題設定中,您可能會有字型、顏色、按鈕和連結的樣式選項。您也可能有額外的詳細設定,以便在頁面上使用更特定的樣式。主題中的樣式選項是基於主題編碼模板中包含的主題欄位。如果您無法找到您想要的設定,請聯絡您的範本設計師,看看您的範本中包含哪些選項。
以下範例是您主題中可能包含的樣式選項類型的一般指南。如需可能包含在您的範本中的主題欄位的完整參考,請參閱設計師文件。
請注意: 您可以在頁面的富文字模組中自訂字型、顏色和樣式,或在頁面編輯器中覆寫主題的預設樣式。只有當您希望這些樣式套用到使用此主題的所有頁面時,才可以修改這些樣式。
顏色
您主題的顏色設定會將主要、次要和背景顏色套用至主題範本中的所有元素。這些樣式會套用到您網站上的所有元素。
字體
選擇主要和次要字型,套用到您網站的標題、表格、按鈕和正文。支援所有 Google 字型。按一下顏色泡泡 ,自訂主要或次要字體顏色。您可以選擇簡單的顏色值,或按一下「進階 」標籤,使用顏色選擇器選擇特定的十六進位數值。
間距
您的主題間距設定可控制頁面或文章內容的最大寬度,以及不同元素之間的垂直間距。
排版
在排版設定中,您可以控制應用於範本中特定元素的字型。您也可以為主題中的某些標題、字型或連結選擇自訂顏色。
- 標題: 您可以自訂主題中任何標題的字型、顏色、大小和樣式。
- 正文: 僅可自訂頁面正文的字型、顏色或文字大小。
- 連結: 自訂網站上連結的預設顏色。您也可以自訂連結的顏色,以及訪客懸停或點選您的連結時的行為。
按鈕
您可以為網頁和部落格上的按鈕設定自訂顏色、字型和樣式。在特定頁面的頁面編輯器中,您可能可以交換按鈕的尺寸或類型,這取決於您的網站開發人員是如何建立您的主題的。
- 尺寸:指定頁面上小型、普通和大型按鈕的尺寸。
- 主要按鈕:主要按鈕是為了讓訪客在您的頁面上進行最重要的動作。這種顏色應該突出並吸引訪客的注意。
- 次要按鈕:當您的頁面上已有一個主要按鈕時,次要按鈕就會用於相對不太重要的動作。次要按鈕通常應用於頁面上較低優先順序的動作。
- 簡單:這些是應用在頁面中簡單按鈕模組的預設字型和樣式。
表格
自訂表單的預設顏色、字型和文字樣式,以及按鈕樣式。
- 標題: 這是套用在整個表單上方的文字欄位的樣式。這通常包括問候語以及填寫表單的說明。表單上的這些樣式只能在主題的設定中管理。
- 標籤: 應用於顯示在表單欄位上方的標籤的樣式。
- 欄位: 套用在表單欄位名稱本身的樣式。
- 說明文字: 這是顯示在每個表單欄位內的範例內容,說明您的訪客應該提交哪種類型的資訊。
- 提交:選擇應用於表單的按鈕樣式和大小。
- 背景顏色: 套用至您表單的背景顏色。
- 邊框: 表單欄位周圍的邊框顏色。
- 襯墊: 頁面上表單周圍的間距大小。
表格
設定新增至頁面的表格的預設顏色、字型、間距和邊框。進一步瞭解如何在頁面的富文字模組中插入表格。
- 表格標題: 套用在表格標題中字體的顏色,以及表格第一行全寬的預設背景顏色。您也可以設定底部邊框,以沿著表格標頭邊緣的底部使用重點顏色。
- 字體顏色: 表格中字體的預設顏色。
- 背景顏色: 表格儲存格背景的預設背景顏色。
- 邊框: 表格的預設邊框顏色、寬度和樣式。
- Padding (襯墊): 頁面中表格上方和下方的空間大小。
網站標題
這些設定可控制出現在您頁面標頭的顏色和字型,包括您的導覽選單。瞭解如何 在您的帳戶設定中設定 導覽選單 。 若要在主題範本上設定您的公司標誌,請在 品牌 部分的帳戶預設值 中 加入您的標誌圖片 。
- 選單: 選擇瀏覽者檢視、將滑鼠懸停在上方或按一下選單項時,導覽選單的字體顏色和樣式。這些樣式只能在您的主題設定中管理。
- 背景顏色: 選擇網站標題背景的顏色。
- 底部邊框: 如果需要,您可以在網站標題下方加入一條水平線作為邊框。選擇一種樣式來啟動底部邊框,然後選擇邊框的顏色和寬度。
頁尾
這些設定可控制出現在頁尾的顏色和字型,包括任何導覽選單。瞭解如何 在帳戶設定中設定 導覽選單 。
- 選單: 選擇主題頁尾導航選單的顏色和字體樣式。您可以自訂訪客檢視、將滑鼠懸停在上方或按一下選單項時的顏色。這些樣式只能在主題設定中的這裡管理。
- 背景顏色: 選擇網站頁尾背景的顏色。
- 底部邊框: 如果需要,您可以在網站頁尾下方新增一條水平線作為邊框。選擇一種樣式來啟動底部邊框,然後選擇邊框的顏色和寬度。
網誌
這些設定可控制您的列表頁範本和部落格文章範本的樣式。
- 橫幅圖片: 上傳圖片以用於您部落格範本標頭的背景。您可以選擇一張圖片用於您的部落格首頁,以及一張應用於所有部落格文章的圖片。
- 標籤: 設定顯示在部落格文章頂端的部落格標籤預設顏色、字型和樣式。