知識庫

構造和自定義模板布局

作者:HubSpot Support | Nov 21, 2022 12:33:25 PM

了解如何設定和自訂現有的拖放範本,以及如何將模組、羣組和欄位作為範本的構建基塊。

構建您的模板

通過使用設計管理器中的布局編輯器,您可以快速構建內容布局,而無需編寫任何HTML。

  • 在搜尋器中,按一下範本 以編輯。

添加和拖拽模組

若要將模組新增至佈局,請按一下佈局檢視器頂部的 +新增。 搜索或選擇 模組,然後將其拖動到您希望模組在佈局中呈現的位置。 將模組拖曳到其他模組之上將會建立欄位或組合模組。

更改列寬

若要變更欄位的寬度,請在模組之間懸停,然後單擊並水平拖動。

Group modules

模組組是組成頁面不同部分的模組單位。

若要組合兩個模組,請按一下第一個模組,然後按住Control/Command鍵並選擇第二個模組。 如果您要組合兩個以上的模組,請重複此步驟。 接下來,按一下模 組檢查器中的羣組圖示groupModule。  

請注意:模塊組不能跨越部分分隔符或包含部分選擇的模塊組。

水平拆分模組

拆分一個模組會將模組分成兩半,形成兩個模組。 若要拆分模組,請按一下該模組,然後按一下模組檢查器 中的 拆分模組圖示splitModule。 或者,您可以右鍵單擊佈局中的模塊,然後選擇拆分模塊。

中心模數

使用橫向間隔,您可以在頁面上將模組和羣組居中,或在其兩側添加空白空格。 若要新增橫向間隔,請按一下佈局檢視器頂部的+新增。 找到 Horizontal Spacer ,然後將其拖放到模板中。

若要變更橫向間隔器的大小,請變更將其與其他模組分開的欄位的寬度。 若要使模組或羣組居中,請在每邊添加水平間隔物。 

添加靈活的列

靈活的列旨在使內容創作者更容易在頁面級別進行內容管理。 當一個靈活的列被添加到HubSpot頁面範本時,用戶將可以在單個頁面編輯器中添加,刪除 和重新排序模組。 此功能允許設計師創建更少的模板,同時仍然允許營銷人員靈活地定制每個頁面以滿足他們的需求。

若要新增靈活的欄位,請按一下佈局檢查員頂部的+新增 。 找到 Flexible Column ,然後將其拖放到模板中。

請注意:
  • 彈性欄位只能新增至頁面範本,而無法新增至電子郵件或部落格範本。
  • 添加到靈活列的模組不能有CSS類別、內嵌樣式或與它們相關聯的包裝HTML。 樣式選項需要添加到靈活的欄位本身。

 


自定義模板

一旦你構建了範本的總體佈局,你就可以交換模組並進行其他範本自訂。

編輯模組選項

您可以點擊佈局編輯器中的模組來編輯 模組的選項。 在右側的模組檢查器中,您將看到模組的可編輯選項。 這些選項通常包括樣式、預設內容和編輯器選項,並可能因特定類型的模組而有所不同。 了解更多關於編輯模組CSS和預設內容和設置

Swap module

在範本中添加模板後,您可以選擇將其替換為另一個模板。 在佈局編輯器 中右鍵按一下該模組,然後按一下交換模組。 在出現的下拉菜單中,選擇要替 換原始模組的模組。

轉換為全局模組

您可以將範本中的模板轉換為全局模板,可以在多個範本中使用。 當您以某種方式設計模組時,和/或在模組中具有要在其他模板中重複使用的預設內容時,這非常有用。

  • 按一下版式編輯器中的模組 。
  • 在模組檢查器中,按一下更多下拉式選單,然後選擇轉換為全局模組。
  • 在對話方塊中,輸入全局模組名稱,然後按一下建立。

刪除模組

若要刪除模組,請按一下佈局編輯器中的模組,然後按一下模組檢查員 中的垃圾桶圖示 刪除。 或者,您可以右鍵按一下模組,然後選擇刪除模組。

在Finder中管理模板

除了模板選項外,您還可以根據模板執行幾項操作。

  • 在範本右上角,按一下 資料夾圖示資料夾
  • 右鍵單擊模板 的名稱 。 在下拉菜單中,您可以自訂以下選項:
    • 複製到入口網站:將範本複製到另一個入口網站,在那裡您也是用戶。 從Marketplace購買的範本將無法複製到其他入口網站。
    • 複製範本:這會創建與範本完全重複的範本,並且在您想要創建現有範本的變體時非常有用。
    • 複製到HTML :這將創建模板的單獨HTML版本。 如果您需要對標記進行更多控制,或者您想進一步了解範本的編碼方式,這將非常有幫助。
    • 查看模板來源:查看模板的源代碼HTML。 與「複製到HTML」選項不同,這不會 創建模板的單獨HTML版本。
    • 重命名範本:編輯範本的內部名稱。
    • 顯示家屬:查看目前使用此範本的所有網頁、電子郵件或部落格。
    • 顯示修訂記錄:查看範本的修訂記錄,並選擇將範本還原為先前發佈的版本。
    • 建立電子郵件/頁面:直接從範本建立電子郵件或登陸頁面/網站頁面。
    • 刪除模板:這將刪除模板。 一旦刪除,模板將保留 30天,之後將永久刪除。 若要還原模板,您需要聯絡客戶支援。 
  • 您也可以從上方的「檔案」 「操作」下拉式選單中存取這些選項。