在設計模式下配置元件

當實AEM例安裝在現成可用時，元件瀏覽器中會立即提供選取的元件。

除了這些外，還有各種其他元件可供使用。您可以使用「設計」模式來啟用／停用此類元件。啟用並位於頁面上時，您可以使用「設計」模式來編輯屬性參數，以設定元件設計的各個方面。🔗

注意

編輯這些元件時必須小心。設計設定通常是整個網站設計的一部份，因此只有擁有適當權限和經驗的人才能變更這些設定，通常是管理員或開發人員。如需詳細資訊，請參閱開發元件。

注意

設計模式僅適用於靜態範本。使用可編輯的模板建立的模板應使用模板編輯器進行編輯。

注意

設計模式僅適用於儲存為(/etc)下的內容的設計配置。

從AEM6.4開始，建議將設計儲存為/apps下的設定資料，以支援持續部署藍本。儲存在/apps下的設計在執行時期無法編輯，非管理員使用者將無法使用設計模式來建立此類範本。

這包括添加或刪除頁面段落系統中允許的元件。段落系統(parsys)是包含所有其他段落元件的複合元件。段落系統可讓作者將不同類型的元件新增至包含所有其他段落元件的頁面。每個段落類型都表示為元件。

例如，產品頁面的內容可能包含包含下列內容的段落系統：

產品的影像（影像或文欄位落的形式）
產品說明（文欄位）
具有技術資料的表（作為表段）
表單使用者填寫（表單開頭、表單元素和表單結尾段落）

注意

如需parsys的詳細資訊，請參閱開發元件和使用範本和元件的准則。

注意

使用本文所述的設計模式編輯設計是定義靜態範本設計的建議方式

例如，在CRX DE中修改設計並非最佳做法，而且這種設計的應用可能與預期行為不同。如需詳細資訊，請參閱開發人員檔案頁面範本- Static。

啟用／禁用元件

要啟用或禁用元件，請執行以下操作：

選擇Design模式。
點選或按一下元件。選取此元件時，元件會有藍色邊框。
按一下或點選Parent表徵圖。

這將選擇包含當前元件的段落系統。
段落系統的Configure圖示將顯示在父級的操作欄中。

選擇此選項以顯示對話框。
使用對話方塊定義在編輯目前頁面時，元件瀏覽器中可用的元件。

對話框有兩個頁籤：
- 允許的元件
- 設定
允許的元件

在允許的元件頁籤上，定義哪些元件可用於參數。
- 這些元件依其元件群組分組，可展開和收合。
- 您可以勾選整個群組，方法是勾選群組名稱，而取消勾選所有群組即可取消勾選。
- 減號表示至少選取一個項目，但並非選取群組中的所有項目。
- 可使用搜尋來依名稱篩選元件。
- 列在元件群組名稱右側的計數代表這些群組中選取的元件總數，而不考慮篩選。
您可以定義每個頁面元件的設定。如果子頁面使用相同的範本和／或頁面元件（通常對齊），則相同的組態會套用至對應的段落系統。

注意

最適化表單元件設計為可在Adaptive Form Container中運作，以利用Forms生態系統。因此，這些元件必須僅用於最適化表單編輯器中，而不能在「網站」頁面編輯器中運作。

設定

在Settings標籤上，您可以定義其他選項，例如為每個元件繪製錨點，以及定義每個容器的儲存格間距。
選擇Done以保存配置。

配置元件的設計

選擇Design模式。
點選或按一下具有藍色邊框的元件。在此示例中，選擇了英雄影像元件。
使用Configure表徵圖開啟對話框。

在設計對話框中，可根據可用的設計參數配置元件。

對話方塊有三個標籤：
- 主要
- 功能
- 樣式
屬性

使用Properties頁籤可以配置元件的重要設計參數。例如，對於影像元件，您可以定義允許的影像最大和最小大小。

功能

功能標籤可讓您啟用或停用元件的其他功能。例如，對於影像元件，您可以定義影像的方向、可用的裁切選項，以及是否可以上傳影像。

樣式

Styles標籤允許您定義要與元件一起使用的CSS類和樣式。

使用Add按鈕，將其他條目添加到多條目對話框清單。

使用刪除表徵圖從多條目對話框清單中刪除條目。

使用移動表徵圖重新排列多條目對話框清單中條目的順序。
按一下或點選Done表徵圖以保存並關閉對話框。