跳到內容
請注意::這篇文章的翻譯只是為了方便而提供。譯文透過翻譯軟體自動建立,可能沒有經過校對。因此,這篇文章的英文版本應該是包含最新資訊的管理版本。你可以在這裡存取這些內容。

建立自訂編碼範本

上次更新時間: 一月 5, 2024

可与下列任何一种订阅一起使用,除非有说明:

所有產品和版本

開發人員可以使用HTML從頭開始建立部落格、網站頁面、登陸頁面和電子郵件範本。 您還可以將拖放範本版面複製到HTML ,然後將其自訂為編碼範本。

請參閱我們的開發人員文件,深入瞭解如何使用自訂設計。 

請注意:必須擁有行銷中心專業 版或企業版帳戶,才能建立自訂編碼的電子郵件範本。

建立新的HTML和HubL檔案

  • 在你的 HubSpot 帳戶中,瀏覽「行銷」>「檔案和範本」>「設計工具」。
  • 在左側邊欄中,按一下 檔案下拉式選單,然後> 新檔案。 
  • 在對話方塊中,按一下「您今天想要建立什麼?」下拉式選單,然後選取「HTML與HubL」,然後按一下「下一步」。 
design-manager-html-hubl
  • 輸入新檔案的詳細資訊:
    • 選擇範本或範本部分。 模板部分是可以在其他模板中使用的模板。 
    • 點擊範本類型下拉式選單,然後選擇你要編碼的範本類型(頁面、部落格文章/清單、電子郵件或系統頁面)。
    • 在「檔案名稱」欄位中,輸入檔案名稱。 
    • 若要更新檔案的位置,請在「檔案位置」區段中按一下變更並選擇資料夾。 
  • 按一下建立。
  • 在程式碼編輯器中,輸入範本的HTML。
  • 若要顯示HubL的渲染方式,請按一下以切換顯示輸出開關。 右側將打開一個面板,顯示渲染的預覽。
show-output-in-design-manager
  • 若要預覽範本的外觀,請點擊右上角的預覽下拉式選單,然後選擇使用顯示選項進行即時預覽。 
  • 編輯完成後,按一下右上角的發佈變更 。 
  • 如果有任何代碼錯誤,系統會顯示錯誤訊息。 在程式碼編輯器下方的錯誤主控臺中查看有關這些錯誤的更多資訊。 

error-console

新增必要的HubL標籤

自訂編碼範本需要特定的HubL變數才能運作。 如果缺少這些必要變數中的任何一個,當您嘗試發佈範本時,將會顯示錯誤訊息。 

頁面和網誌範本需要以下標籤:

  • {{standard_footer_includes}}
  • {{standard_header_includes}}
電子郵件範本要求以下標籤 符合CAN-SPAM規範
  • {{unsubscribe_link}} {{unsubscribe_link_all}} (包括至少一個)
  • {{unsubscribe_anchor}}
  • {{site_settings.company_name}}
  • {{site_settings.company_street_address_1}}
  • {{site_settings.company_city}} {{site_settings.company_state}}
  • {{site_settings.company_zip}}

將範本複製到HTML

除了從頭開始建立範本外,您還可以將範本拖放複製到HTML。

若要建立現有範本的程式碼版本:

  • 在你的 HubSpot 帳戶中,瀏覽「行銷」>「檔案和範本」>「設計工具」。
  • 在左側邊欄中,開啟要複製的範本。 
  • 單擊操作下拉菜單,然後選擇克隆到HTML。 HTML檔案將在與原始檔案相同的資料夾中建立。 
clone-to-html
這篇文章有幫助嗎?
此表單僅供記載意見回饋。了解如何取得 HubSpot 的協助