如何使用模板管理？

Webayt 內容管理系統 (CMS) 中的範本管理用於建立可重複使用的 HTML 和 CSS 內容。這樣，您就可以建立模板並使用簡碼將其新增至相關區域，而無需在不同的頁面上重複編寫相同的設計或內容區塊。

範本可用於價格表、呼叫標牌、自訂資訊框、語言模擬、套餐比較、活動區域或重複使用的自訂設計部分。

模板管理有什麼用途？

範本管理功能可讓您集中管理網站上常用的設計和內容元素。建立模板後，您可以使用短代碼在支援的 HTML 內容區域中呼叫它。

當多個頁面使用相同內容時，這種結構尤其有用。您對範本所做的任何更新都會反映在所有使用該範本的區域。

模板管理的一大優點在於，它能更安全地處理複雜的 HTML 結構。如果整個 HTML 程式碼都納入翻譯過程，標籤結構、類別名稱或設計佈局有時可能會被破壞。但使用範本管理，HTML 結構得以保留，只有定義為參數的文字欄位才會被翻譯。

例如，可以將以下的可重複使用結構準備為範本：

• 包裝對比表
• 價格卡或服務卡
• CTA區域
• 資訊框
• 自訂 HTML 部分
• Google 可見性或多語言模擬
• 重複的宣傳活動或促銷活動

如何存取模板管理頁面？

要管理模板，您可以從 Webayt 管理面板左側選單存取模板管理部分。

範本管理

此頁面列出了先前建立的範本。您可以新增模板、編輯或刪除現有模板，或查看其短代碼。

模板清單螢幕

在範本管理主介面，已建立的範本會以表格形式列出。此表格顯示範本名稱、短代碼、參數資訊和狀態資訊。

清單畫面通常會顯示以下資訊：

• 範本名稱：這是在面板中以及選擇範本時顯示的範本名稱。
• 短代碼：用於在內容區域中呼叫模板的特殊程式碼。
• 參數：指示模板中使用的變數數量或參數狀態。
• 狀態：指示模板是開啟還是關閉。
• 編輯：用於更新範本資訊。
• 刪除：用於移除相關模板。

模板短代碼用於在頁面內容中呼叫相關模板。例如，模板短代碼可能如下所示：

 { { template:mock_template_name } }

如何新增模板？

若要建立新模板，請前往「新增模板」標籤。在此畫面上，您可以定義範本的名稱、短代碼、HTML/CSS 內容、參數和狀態。

1. 登入Webayt管理面板。
2. 從左側選單中，前往模板管理。
3. 點選「新增模板」標籤。
4. 輸入模板名稱和短代碼密鑰。
5. 將您的HTML或CSS內容新增至範本區域。
6. 如有必要，請定義參數欄位。
7. 將範本狀態設定為開啟或關閉。
8. 點選「新增」按鈕儲存範本。

模板插入字段

模板添加或編輯界麵包含一些關鍵字段，這些字段決定了模板的運作方式。

模板名稱

模板名稱將顯示在面板和模板選擇清單中。此欄位應填寫描述性名稱，以便您日後輕鬆識別範本。

模板範例名稱：

 CTA套餐
谷歌搜尋頁面
網站管理模板
多語言支援

短代碼鍵

短代碼鍵是用於在內容欄位中呼叫模板的唯一密鑰。此欄位通常使用小寫字母、數字、連字號和底線來建立。

例如，如果短代碼鍵為management_plans ，則可以在上下文欄位中使用以下短代碼呼叫此模板：

 { { template:mock_template_name } }

建議簡短的程式碼清晰明了，並解釋模板的用途。

模板區域

模板區域用於編寫您想要建立的 HTML 或 CSS 結構。此部分包含決定模板在前端顯示效果的程式碼。

模板區域可以包含 HTML 和 CSS 標籤。 HTML 選項卡用於結構化內容，而 CSS 選項卡用於視覺化編輯。

如果要在 HTML 範本中使用可編輯字段，可以用花括號將其定義起來。

 {標題}
{描述}
{button_text}

這些變數可以自動列在範本的參數欄位中，並可針對不同語言分別進行編輯。

參數

「參數」區域用於管理 HTML 範本中定義的變數。範本中使用的變數會在此部分列出，並且可以輸入與這些變數對應的文字。

例如，如果在 HTML 範本中定義了{title}變量，則可以在參數欄位中輸入與該變數對應的標題文字。類似地，也可以為{description} 、 {button_text}或類似變數建立單獨的參數欄位。

參數的主要目的是確保在翻譯過程中只翻譯這些欄位中輸入的文字。這樣可以防止模板的整個 HTML 程式碼被包含在翻譯中。

這種結構在包含複雜 HTML 程式碼的模板中尤其重要。如果將整個 HTML 程式碼傳送到自動翻譯流程，HTML 標籤、類別名稱、自訂程式碼或設計結構在某些情況下可能會損壞。但是，如果使用參數，HTML 和 CSS 結構將保持不變；只有使用者可見的文字內容會被翻譯。

因此，對於自訂設計區塊、多列欄位、價格表、套餐比較、進階 CTA 部分或包含複雜 HTML 的內容，建議使用範本管理。

情況

該狀態決定了模板是否可以在網站上使用。

• 清晰：即使用於模板內容，也會顯示在網站上。
• 已停用：即使在內容中使用，該範本也不會顯示在網站上。

如果需要暫時停用某個模板，將其狀態設為「關閉」可能比刪除它更安全。

如何在內容中使用模板？

在模板管理中建立的模板可以透過在可以輸入 HTML 的內容欄位中使用短代碼來呼叫。

例如，當您將以下短代碼新增至受支援的內容編輯器時，對應的範本會自動顯示在該欄位中：

 { { template:mock_template_name } }

此功能可讓您快速將先前建立的設計新增至不同的頁面。

模板通常可用於可以輸入 HTML 內容的區域。例如，在資訊頁面、章節頁面、分類頁面、內容頁面和自訂 HTML 內容區域中，模板短代碼都是不錯的選擇。

透過編輯器選擇模板

在 CMS 編輯器中，您可以透過下拉清單或範本選擇區域來查看可用範本。您可以從該區域選擇所需的模板，並將短代碼新增至編輯器。

選擇模板後，其短代碼會加入編輯器。但是，當頁面在前端顯示時，顯示的是模板的實際 HTML 程式碼，而不是該短代碼。

如何使用模板預覽？

您可以使用模板編輯畫面上的預覽選項來查看模板的外觀。

預覽視窗可協助您查看範本在前端的顯示效果。這樣，您可以在發布範本之前檢查設計、文字和佈局。

預覽模板，尤其是包含 HTML 和 CSS 的模板，有助於發現錯誤的佈局或缺少的參數。

在模板中使用參數的優勢

參數使模板更加靈活安全。當您只想管理標題、描述、按鈕文字或類似的編輯內容，同時保持相同的 HTML 結構時，參數尤其有用。

在範本中，可修改欄位使用花括號定義。例如， {title} 、 {description}或{button_text}等欄位可以用作參數。

參數最重要的優點之一在於，自動翻譯過程中只會翻譯這些參數的內容。因此，模板的整個 HTML 結構不會被納入翻譯過程。

對於包含複雜 HTML 程式碼的設計，這一點尤其重要。如果整個 HTML 程式碼都進行翻譯，標籤結構、類別名稱、自訂程式碼或佈局在某些情況下可能會損壞。但是，如果使用範本管理，則可以保留 HTML 結構，並且僅翻譯參數欄位中輸入的文字。

因此，建議使用範本管理來建立自訂設計區塊、進階 HTML 結構、多列欄位、價格表、比較表或可重複使用的自訂內容部分。

例如，假設您正在建立一個 CTA（行動號召）欄位。如果您將標題、描述和按鈕文本等欄位定義為參數，則可以在不破壞設計結構的情況下使用不同的文本，並確保在翻譯過程中僅翻譯這些特定的文本。

在多語言網站上使用模板

在內容管理系統（CMS）中，範本中使用的參數文字可以翻譯成不同的語言。這使得相同的模板結構可以在多語言網站上用於不同語言的內容。

在範本管理中，HTML 和 CSS 結構保持不變；翻譯過程是根據輸入到參數欄位中的文字進行的。這種結構有助於防止複雜的 HTML 程式碼在翻譯過程中損壞。

因此，在使用自訂 HTML 為多語言網站建立內容時，透過範本管理進行操作可能比直接將冗長複雜的 HTML 程式碼新增至頁面編輯器更有益。

修改範本後，可能需要更新相關清單。有關更新清單和選擇翻譯語言的詳細信息，請參閱「如何使用清單進行更新？」指南。

更新模板時應考慮哪些因素？

更新範本時，使用該範本的頁面外觀也可能受到影響。因此，在進行任何更改之前，尤其是對正在使用的範本進行更改之前，請務必先查看現有的使用模式。

• 檢查模板在哪些頁面上使用。
• 修改 HTML 和 CSS 後，預覽變更。
• 請確保參數欄位中沒有缺失或錯誤的文字。
• 請確保模板狀態已啟用。
• 必要時更新相關清單。
• 如果啟用了緩存，請刷新該頁面的快取。

使用模板時應考慮哪些因素？

範本管理是一個強大的工具，可以簡化重複性內容的創建。然而，模板的組織性和易懂性至關重要。

• 在面板中選擇一個易於理解的模板名稱。
• 請用簡潔明了的方式寫出簡短的程式碼。
• 保持HTML和CSS代碼的條理性和組織性。
• 以易於理解的方式定義參數名稱。
• 盡可能將待翻譯文字定義為參數。
• 注意參數的使用，以防止複雜的 HTML 程式碼在自動翻譯過程中被破壞。
• 避免為相同目的建立多個不必要的模板。
• 在刪除未使用的模板之前，請檢查它們是否正在活躍頁面上使用。
• 發布前請先預覽模板。

何時應該使用範本管理？

如果您需要在多個地方使用相同的設計區塊，或者您的內容中重複使用自訂 HTML 結構，那麼使用範本管理就非常有用。

在以下情況下，建立模板可能是個好主意：

• 當您想要在不同的頁面上使用相同的 CTA 欄位時
• 當您需要集中管理套餐、價格或比較欄位時。
• 當您不想重複輸入自訂 HTML 程式碼區塊時
• 當您想要在多語言內容中使用相同的設計搭配不同的文字時
• 當您想要防止複雜的 HTML 程式碼在自動翻譯過程中被損壞。
• 當您想要將現成的設計模組新增至編輯器時

概括

模板管理是 Webayt CMS 中用於建立可重複使用 HTML 和 CSS 內容的區域。建立的範本可用於可透過簡碼輸入 HTML 的內容區域。

透過在範本中使用參數，您可以定義可編輯字段，確保在自動翻譯過程中僅翻譯這些參數的內容，從而防止複雜的 HTML 結構被破壞。這種結構使您能夠在不同的頁面和不同的語言中更安全地使用相同的設計模板。

修改範本後，如有必要，請記得在「要更新的清單」部分更新相關清單。