建立自訂模組，以便在報價模板中使用

為報價模板建立自訂模組，以自訂外觀、內容和邏輯。利用這些模組根據您的業務需求自訂報價模板。

開始之前

在開始使用自訂模組之前，請先了解應預先採取的步驟，以及此功能的限制與使用時可能產生的後果。

了解需求

• 請熟悉HubSpot 開發人員版內容中心。

• 若您不熟悉React、HTML、JavaScript 及 CSS，請與開發人員合作來建立自訂模組。

限制與注意事項

• 無法透過API 建立自訂程式碼模組或將其新增至報價單。API 使用者可選擇已內建自訂模組的範本。

• 系統僅提供一個拖放區域。不支援複雜的頁面佈局，例如將單一模組作為整個報價單的側邊欄。

• 您必須使用報價單的固定容器。可透過更新網站頁首的 HTML來調整拖放區域的寬度。

• 您可以使用自訂 CSS 來隱藏報價單頂部的狀態列。

建立模組

進一步了解如何建置 CMS React 模組，包括必要的目錄結構、定義欄位以及資料處理。

常見使用情境

自訂模組提供多種方式來靈活自訂報價單範本。請參閱以下常見使用情境。

建立明細項目表格模組

建立符合您業務需求的自訂明細表模組。例如：

• 新增區段：根據屬性將明細項目分區顯示。例如，將產品與服務，或一次性與定期的明細項目分別歸類至不同區段。

• 自訂總計模組：顯示報價摘要或自訂計算結果。

• 顯示帳單時間表：根據報價中的明細項目建立時間表。

• 可選明細項目： 將明細項目設為可選。買方可透過 無伺服器函式 更新報價單及交易金額 。

• 價格遞增機制： 依據預先設定的時程表，顯示明細項目隨時間變動的價格。例如，某項產品第一年價格為 5,000 美元，第二年為 10,000 美元。您也可以對某項明細項目在前三個月套用折扣，並於第四個月恢復標準價格。

  請注意：自訂 編寫的模組僅能遵循計費起始日期，無法處理漸進式定價所衍生的計費影響。

建立條件式條款與條件模組

根據報價資料顯示不同的條款或內容。例如，您可以根據買家的國家顯示特定地區的法律條款，或在新增特定明細項目時加入產品專屬條款。

建立「交易方」區塊

隱藏標準的「當事方」模組，並建立具有您專屬品牌標識與格式設定的自訂模組。您亦可整合自訂資料，例如運送地址或子公司屬性。

建立自訂導覽選單

新增導覽選單，協助買家瀏覽冗長的報價單。

要求確認各區段

新增互動式自訂程式碼模組，透過核取方塊或按鈕，讓買家在接受報價前確認特定模組。

模組樣式設定

建立模組時，可自訂圖片格式、陰影、圓角、品牌標識等設計元素。

刪除自訂程式碼模組

您可以從開發者專案中刪除自訂程式碼模組。請參閱下方，進一步了解刪除模組對報價單及報價單範本的影響。

刪除報價模組的影響

當自訂程式碼模組從開發者專案中刪除後，便無法再用於新的報價單或報價單範本中。

報價單行為

• 報價草稿：當編輯並儲存報價草稿時，已刪除的模組及其內容將一併移除。
• 已發佈的報價單：模組內容將予以保留。
• 已調用報價單：當報價單經調用後進行編輯並儲存時，已刪除的模組及其內容將被移除。更新後的已發佈報價單將不會包含該模組或其內容。

報價單範本行為

• 未發佈的報價模板： 當編輯並儲存未發佈的報價模板時，已刪除的模組及其內容將會被移除。
  
  

• 已發佈的範本： 模組及其內容將保留，直到該範本被取消發佈為止。
  
  

還原已刪除的模組

進一步了解如何還原已刪除的模組。