建立頁面範本

建立頁面時，您必須選取範本，此範本將用作建立新頁面的基礎。 範本會定義結果頁面的結構、任何初始內容，以及可使用的元件。

使用范 本編輯器，建立和維護範本不再是開發人員專屬的工作。也可以涉及一種稱為模板作 者的權​力用戶。開發人員仍需要設定環境、建立用戶端程式庫和建立要使用的元件，但是當這些基本功能準備就緒後，範本作者就可以彈性地建立和設定範本，而不需要開發專案。​

Templates Console​允許模板作者：

• 建立新範本或複製現有範本。
• 管理模板的生命週期。

範本編輯器​可讓範本作者：

• 將元件新增至範本，並將它們置於互動式格線上。
• 預先設定元件。
• 定義哪些元件可在使用範本建立的頁面上編輯。

本檔案說明​範本作者​如何使用範本主控台和編輯器來建立和管理可編輯的範本。

如需可編輯範本在技術層級運作的詳細資訊，請參閱開發人員檔案頁面範本以取得詳細資訊。

啟動之前

在您開始之前，請務必考慮建立新範本需要共同作業。 因此，會為每個任務指示角色。 這不會影響您實際使用範本建立頁面的方式，但會影響頁面與其範本的關聯方式。

角色

使用「模板控制台」和「模 板編輯器 」建立新模板時 ​​，需要在以下角色之間協作：

• 管理員:
  • 為模板建立新資料夾需要admin權限。
  • 這類工作通常也可由開發人員完成
• 開發人員:
  • 重點介紹技術／內部細節
  • 需要開發環境的經驗。
  • 提供範本作者必要的資訊。
• 範本作者:
  • 此作者是群組template-authors的成員
    • 這會分配所需的權限和權限。
  • 可以配置元件的使用和其他需要的高級詳細資訊：
    • 一些技術知識
      • 例如，在定義路徑時使用圖樣。
    • 開發人員的技術資訊。

由於某些任務的性質（如建立資料夾），因此需要開發環境，這需要知識／經驗。

本文檔中詳述的任務將列出負責執行這些任務的角色。

建立和管理模板

建立新的可編輯範本時：

• 使用​Template​控制台。 這可在​工具​控制台的​一般​區段中使用。
  • 或直接在：https://<host>:<port>/libs/wcm/core/content/sites/templates.html/conf
• 如有必要，可以為模板建立資料夾
• 建立新範本，此範本一開始會是空的
• 視需要 為範本定義其他屬性
• 編輯范 本以定義：
  • 結構 -在使用範本建立的頁面上無法變更的預先定義內容。
  • 初始內容 -可在使用範本建立之頁面上變更的預先定義內容。
  • 版面 -適用於各種裝置。
  • 樣式 -定義要與模板及其元件一起使用的樣式。
• 啟用范 本，以便在建立頁面時使用
• 允許 您網站的必要頁面或分支的範本
• 發佈范 本，使其可在發佈環境中使用

建立模板資料夾——管理

應為您的專案建立範本資料夾，以存放專案專用的範本。 這是一項管理任務，在文檔頁面模板中有說明。—>

建立新模板——模板作者

1. 開啟范 本主控台 (透過工具-> 一 般 ​)，然後導覽至所需的檔案夾。

   注意

   在標準AEM例項中，範本主控台中已存在​global​資料夾。 如果當前資料夾中未找到策略和／或模板類型，則此選項將保留預設模板並充當備援。

   建議使用為您的項目](/docs/experience-manager-cloud-service/implementing/developing/full-stack/components-templates/templates.html?lang=zh-Hant#template-folders)建立的[模板資料夾的最佳做法。

2. 選擇​建立，然後選擇​建立模板​以開啟嚮導。

3. 選擇​模板類型，然後選擇​Next。

   注意

   範本類型是預先定義的範本版面，可視為範本的範本。 這些是由開發人員或系統管理員預先定義的。 如需詳細資訊，請參閱開發人員檔案頁面範本.—>

4. 完成​Template Details:

   • 範本名稱
   • 說明

5. 選擇 建立。將顯示確認資訊，選擇​Open​開始編輯模板，或選擇​Done​返回模板控制台。

   注意

   建立新範本時，在主控台中會標示為​Draft，這表示該範本尚未可供頁面作者使用。

定義模板屬性——模板作者

範本可以有下列屬性：

• 影像
  • 影像將用作範本的縮圖，以協助選取，例如在「建立頁面」精靈中。
    • 可上傳
    • 可根據範本內容產生
• 標題
  • 用於標識模板的標題，如​建立頁​嚮導中。
• 說明
  • 提供範本及其使用的詳細資訊的選用說明，例如在​建立頁面​精靈中。

要查看和／或編輯屬性：

1. 在​範本控制台​中，選擇範本。
2. 從工 具欄中選擇 「查看屬性」(View Properties)或快速選項以開啟對話框。
3. 您現在可以檢視或編輯範本屬性。

範本縮圖影像

要定義模板縮覽圖，請執行以下操作：

1. 編輯範本屬性。
2. 選擇您要上傳縮圖或是從範本內容產生縮圖。
   • 如果您想要上傳縮圖，請按一下或點選「上傳影像」。
   • 如果您想要產生縮圖，請按一下或點選「產生預覽」(Generate Preview)​
3. 對於這兩種方法，都會顯示縮圖的預覽。
   • 如果不滿意，請按一下或點選​Clear​以上傳其他影像或重新產生縮圖。
4. 當您對縮圖感到滿意時，按一下或點選​儲存並關閉。

啟用和允許模板——模板作者

若要在建立頁面時能夠使用範本，您必須：

• 啟用范 本，讓它可供建立頁面時使用。
• 允許范 本指定可使用範本的內容分支。

啟用模板——模板作者

可以啟用或停用範本，以便在​建立頁面​精靈中提供或無法使用範本。

1. 在​範本控制台​中，選擇範本。
2. 從工具欄中選擇​啟用​或​禁用，然後在確認對話框中再次選擇。
3. 現在，當建立新頁面時，您可以使用範本，不過您可能會想要根據您的需求編輯範本](#editing-templates-template-authors)。[

允許範本——作者

範本可供某些頁面分支使用或無法使用。

1. 開啟頁面屬性，以查看希望模板可用的分支的根頁面。

2. 開啟​進階​標籤。

3. 在「 範本設定 」下 ，使用「新增」欄位 ，指定範本的路徑。

   路徑可以是明確的或使用模式。 例如：

   /conf/<your-folder>/settings/wcm/templates/.*

   路徑順序不相關，所有路徑都將被掃描，並檢索任何模板。

   注意

   如果​允許的模板​清單為空，則樹將一直上升，直到找到值／清單。

   請參閱範本可用性 —— 允許範本的原則保持不變。

4. 按一下​保存​保存對頁面屬性的更改。

發佈範本——範本作者

當轉譯頁面時參考範本時，必須發佈已完全設定的範本，以便在發佈環境中使用。

1. 在​範本控制台​中，選擇範本。
2. 從工具列選擇​Publish​以開啟精靈。
3. 選擇要串聯發佈的​內容策略。
4. 從工具列選擇​Publish​以完成動作。

編輯模板——模板作者

建立或編輯範本時，您可以定義多個方面。 編輯範本類似於頁面製作。

工具列中的​Mode​選擇器允許您選擇和編輯模板的適當方面：

• 結構
• 初始內容
• 配置

雖然​頁面資訊​功能表上的​頁面原則​選項可讓您選擇所需的頁面原則](#page-policies):[

範本屬性

可以編輯模板的以下屬性：

結構

添加到structure的元件不能由頁面作者從合成頁面中移動／刪除。 如果您希望頁面作者能夠將元件新增及移除至產生的頁面，則必須將段落系統新增至範本。

當元件鎖定時，您可以新增內容，頁面作者無法編輯這些內容。 您可以解除鎖定元件，以允許定義初始內容。

初始內容

解除鎖定元件後，您可以定義將複製到結果頁面（從範本建立）的初始內容。 這些解鎖的元件可在產生的頁面上編輯。

配置

使用版 面 ，您可以預先定義所需裝置格式的範本版面。範本製作的 「版面」模式與頁面製作的「版面 ​ 」模式功能相同。

頁面原則

頁面 策略可以將預定義的頁面策略連接到頁面。這些頁面原則可定義各種設計組態。

樣式

Style System允許模板作者在元件的內容策略中定義樣式類，以便內容作者在編輯頁面上的元件時能夠選擇它們。 這些樣式可以替代元件的視覺變化，讓元件更具彈性。

如需詳細資訊，請參閱Style System說明檔案。

編輯模板——結構——模板作者

在​結構​模式中，您定義模板的元件和內容，並定義模板及其元件的策略。

• 在範本結構中定義的元件無法在產生的頁面上移動，也無法從任何產生的頁面刪除。
• 如果您希望頁面作者能夠新增和移除元件，請將段落系統新增至範本。
• 可以解除鎖定並再次鎖定元件，以允許您定義初始內容。
• 定義了元件和頁面的設計策略。

在模板編輯器的「結構」( Structure )模式下，可以執行一些操作，並可以執行一些功能來幫助您：

添加元件

有幾種機制可將元件新增至範本：

• 從側面板的​Components​瀏覽器。
• 使用範本上 元件工具列上的「插入元件 」(Insert Component )選項或「拖曳元件至此 」(Drag components here)方塊。
• 將資產（從側面板的​Assets​瀏覽器）直接拖曳至範本上，就地產生適當的元件。

新增後，每個元件都會標示為：

• 邊框
• 顯示元件類型的標籤
• 要在元件已解鎖時顯示的標籤

元件操作

將元件新增至範本後，請對元件採取動作。 每個單獨實例都有一個工具欄，允許您訪問可用操作，該工具欄取決於元件類型。

它也可以取決於所採取的操作，例如當策略與元件關聯時，設計配置表徵圖變為可用。

編輯和配置

透過這兩個動作，您可以將內容新增至元件。

用邊框表示結構

當在​Structure​模式下工作時，橙色邊框表示當前選擇的元件。 虛線也表示父元件。

策略和屬性（一般）

內容（或設計）原則可定義元件的設計屬性。 例如，可用元件或最小／最大尺寸。 這些範本（和使用範本建立的頁面）適用。

為元件建立內容策略或選擇現有策略。

這可讓您定義設計詳細資訊。

配置窗口分為兩個部分。

• 在對話框的左側，在​Policy​下，您可以選擇現有策略或選擇現有策略。
• 在對話框的右側​Properties​下，可以設定特定於元件類型的屬性。

可用的屬性取決於所選元件。 例如，對於文本元件，屬性定義了複製和貼上選項、格式設定選項和段落樣式等選項。

政策

內容（或設計）原則可定義元件的設計屬性。 例如，可用元件或最小／最大尺寸。 這些範本（和使用範本建立的頁面）適用。

在​Policy​下，您可以通過下拉清單選擇要應用於元件的現有策略。

通過選擇​選擇策略​下拉清單旁邊的添加按鈕，可以添加新策略。 然後，應在​Policy Title​欄位中指定新標題。

選擇策略​下拉清單中選定的現有策略可以使用下拉清單旁的複製按鈕作為新策略進行複製。 然後，應在​Policy Title​欄位中指定新標題。 預設情況下，複製的策略的標題為​Copy of X ，其中X是複製策略的標題。

策略說明在​策略說明​欄位中是可選的。

在​也使用所選策略​部分的其他模板中，您可以輕鬆查看哪些其他模板使用在​選擇策略​下拉菜單中選擇的策略。

屬性

在​Properties​標題下，您可以定義元件的設定。 標題包含兩個標籤：

• 主要
• 功能

主要

在​Main​標籤上，定義了元件的最重要設定。

例如，對於影像元件，可定義允許的寬度，並啟用延遲載入。

如果設定允許多個配置，請按一下或點選​添加​按鈕以添加另一個配置。

要刪除配置，請按一下或點選配置右側的​Delete​按鈕。

要刪除配置，請按一下或點選​Delete​按鈕。

功能

功能​標籤可讓您啟用或停用元件的其他功能。

例如，對於影像元件，您可以定義裁切比例、允許的影像方向，以及允許上傳。

原則與屬性（版面容器）

版面容器的原則和屬性設定與一般用途類似，但有些差異。

配置窗口分為兩個部分，與窗口的一般用法相同。

政策

內容（或設計）原則可定義元件的設計屬性。 例如，可用元件或最小／最大尺寸。 這些範本（和使用範本建立的頁面）適用。

在​Policy​下，您可以通過下拉清單選擇要應用於元件的現有策略。 此功能與一般使用視窗時的功能相同。

屬性

在​屬性​標題下，您可以選擇哪些元件適用於版面容器並定義其設定。 標題有三個標籤：

• 允許的元件
• 預設元件
• 回應式設定

允許的元件

在​允許的元件​標籤上，您定義哪些元件可用於版面容器。

• 這些元件依其元件群組分組，可展開和收合。
• 您可以勾選整個群組，方法是勾選群組名稱，而取消勾選所有群組即可取消勾選。
• 減號表示至少選取一個項目，但並非選取群組中的所有項目。
• 可使用搜尋來依名稱篩選元件。
• 列在元件群組名稱右側的計數代表這些群組中選取的元件總數，而不考慮篩選。

預設元件

在​預設元件​標籤中，您定義哪些元件會自動與指定的媒體類型關聯，如此當作者從資產瀏覽器拖曳資產時，AEM就知道要將資產與哪個元件關聯。 請注意，只有具有放置區域的元件可用於此類配置。

按一下或點選​添加映射​以添加全新的元件和MIME類型映射。

在清單中選取元件，然後按一下或點選「 新增類型 」，將其他MIME類型新增至已映射的元件。按一下「 刪除 」圖示以移除MIME類型。

回應式設定

在​回應式設定​標籤上，您可以設定版面容器的產生格線中的欄數。

解鎖和鎖定元件

您可以解除鎖定／鎖定元件，以定義內容是否可在​初始內容​模式中進行變更。

當元件已解除鎖定時：

• 邊框中顯示開啟的掛鎖指示符。
• 元件工具列會隨之調整。
• 已輸入的任何內容將不再顯示在​Structure​模式中。
  • 已輸入的內容被視為初始內容，且僅在​初始內容​模式中顯示。
• 無法移動、剪切或刪除解鎖元件的父代。

這包括解除鎖定容器元件，以便在初始內容模式或產生的頁 面中新增其他元件 。如果您在解除鎖定容器之前已將元件/內容新增至容器，則這些元件/內容在「結構」模式中將不再顯示，但會以「初始內容 ​​​ 」模式顯示。在「 結構模式」中，只有容器元件本身會顯示其「允許的元 件」清單。

為節省空間，版面容器不會擴充以容納允許的元件清單。 容器會變成可捲動的清單。

可配置的元件以「策略」表徵圖顯示 ​​，可以點選或按一下該表徵圖以編輯該元件的策略和屬性。

與現有頁面的關係

如果在根據範本建立頁面後更新結構，則這些頁面將反映範本的變更。 工具列中會顯示警告，提醒您此事以及確認對話方塊。

編輯模板——初始內容——作者

初始 內容模式用於定義在首次根據範本建立頁面時將顯示的內容。然後頁面作者就可以編輯初始內容。

雖然在「結構 」模式下建立的所有內容在「初始內容」中都可 見 ​，但只能選擇和編輯已解鎖的元件。

• 標籤可供編輯的解鎖元件。 選取後，它們會有藍色邊框：

  

• 解除鎖定的元件有工具列，可讓您編輯和設定內容：

  

• 如果容器元件已解除鎖定(在「結 構 」模式中)，則您可以在「初始內容 ​​」模式中新增元件至容器。在「初始內 容」模式中新增的元件 ，可在產生的頁面上移動或從中刪除。

  您可以使用「拖曳元件到此處 」區域，或從適當容器的工具列 中使用「插入新元件 ​​」選項來新增元件。

  
  

• 如果在根據範本建立頁面後更新範本的初始內容，則這些頁面不會受到範本中初始內容變更的影響。

編輯模板——佈局——模板作者

您可以為各種裝置定義範本版面。 範本 的互動式版面運作方式與網頁製作相同。

編輯模板——頁面策略——模板作者／開發人員

「頁面資訊」功能表的「頁面政策」選項下會維護包含必要用戶端程 式庫的頁面原 則 ​​。

要訪問​頁策略​對話框：

1. 從​模板編輯器​中，從工具欄中選擇​頁資訊 ，然後選擇​頁策略​開啟對話框。

2. 頁面策略​對話框開啟，分為兩個部分：

   • 左半部分定義頁面原則
   • 右半部分定義頁面屬性

   

頁面原則

您可以將內容原則套用至範本或結果頁面。 這定義了頁面上主要段落系統的內容原則。

• 您可以從​選擇策略​下拉式清單中選擇該頁的現有策略。

  

  通過選擇​選擇策略​下拉清單旁邊的添加按鈕，可以添加新策略。 然後，應在​Policy Title​欄位中指定新標題。

  

  選擇策略​下拉清單中選定的現有策略可以使用下拉清單旁的複製按鈕作為新策略進行複製。 然後，應在​Policy Title​欄位中指定新標題。 預設情況下，複製的策略的標題為​Copy of X ，其中X是複製策略的標題。

  

• 在​策略標題​欄位中定義策略的標題。 必須有原則才能擁有標題，才能在​選擇原則​下拉式清單中輕鬆選取。

  

• 策略說明在​策略說明​欄位中是可選的。

• 在​也使用所選策略​部分的其他模板中，您可以輕鬆查看哪些其他模板使用在​選擇策略​下拉菜單中選擇的策略。

  

頁面內容

使用頁面屬性，您可以使用​頁面設計​對話方塊來定義所需的用戶端程式庫。 這些用戶端程式庫包括要載入範本的樣式表和javascript，以及使用該範本建立的頁面。

• 指定您要套用至使用此範本所建立之頁面的用戶端程式庫。 在​用戶端程式庫​區段的文字欄位中輸入程式庫名稱。

  

• 如果需要多個庫，請按一下「添加」按鈕為庫名稱添加其他文本欄位。

  

  視需要為用戶端程式庫新增多個文字欄位。

• 使用拖曳控點拖曳欄位，以視需要定義程式庫的相對位置。

  

編輯模板——初始頁面屬性——作者

使用​初始頁面屬性​選項，可以定義在建立結果頁面時使用的初始頁面屬性。

1. 從模板編輯器中，從工具欄中選擇​頁面資訊，然後選擇​初始頁面屬性​以開啟該對話框。

2. 在對話方塊中，您可以定義要套用至使用此範本建立之頁面的屬性。

   

3. 使用​Done​確認您的定義。

最佳作法

建立範本時，您應考慮：

1. 從範本建立頁面後，範本變更的影響。

   以下列出範本上可能的不同作業，以及它們對從它們建立的頁面有何影響：

   • 結構變更：

     • 這些會立即套用至產生的頁面。
     • 訪客仍需要發佈已變更的範本，才能看到變更。

   • 變更內容原則和設計組態：

     • 這些項目會立即套用至產生的頁面。
     • 訪客需要發佈變更才能看到變更。

   • 初始內容的變更：

     • 這些僅適用於在範本變更後建立的頁面。

   • 版面的變更取決於修改的元件是否屬於：

     • 僅限結構——立即應用
     • 包含初始內容——僅限在變更後建立的頁面上

   在下列情況下，請格外小心：

   • 鎖定或解除鎖定啟用範本上的元件。

   • 這可能會產生副作用，因為現有的頁面已經在使用它。 通常：

     • 現有頁面上將遺失解除鎖定的元件（已鎖定）。
     • 鎖定元件（可編輯）將隱藏該內容，使其無法顯示在頁面上。
   注意

   AEM在變更不再是草稿之範本上元件的鎖定狀態時，會顯式提供警告。

2. 建立您自己 的網站特定範本資料夾。

3. 從「範本」 主控台發佈 ​​您的範本。