容器元件

「核心元件容器」元件允許在頁面上為多個附加元件建立容器。

使用狀況

「核心元件容器」元件允許為頁面上的多個附加元件建立容器，並可用於對其他元件進行分組並應用公共樣式或佈局。

• 可在 配置對話框。
• 在將容器元件添加到頁面時，可以在 設計對話框。

版本和相容性

容器元件的當前版本為v1，該版本於2019年6月隨核心元件2.5.0版一同推出，本文檔對此進行了說明。

下表詳細說明了元件的所有受支援版本、AEM元件版本與之相容的版本，以及指向早期版本文檔的連結。

有關核心元件版本和版本的詳細資訊，請參閱文檔 核心元件版本。

元件輸出示例

要體驗容器元件，並查看其配置選項以及HTML和JSON輸出的示例，請訪問 元件庫。

技術詳細資訊

有關容器元件的最新技術文檔 可在GitHub上找到。

有關開發核心元件的詳細資訊，請參閱 核心元件開發人員文檔。

配置對話框

配置對話框允許內容作者定義容器項目及其行為和對頁面訪問者的顯示方式。

• 佈局 — 此選項定義容器元件的行為或佈局行為。
  • 簡單 — 將容器定義為元件的簡單集合
  • 響應網格 — 將容器定義為 響AEM應佈局
• 背景顏色 — 可定義為自由格式RGB值或使用拾色器 取決於配置
• 背景影像 — 為容器定義背景顏色， 取決於配置
• ID — 此選項允許控制HTML和 資料層。
  • 如果留空，則系統會為您自動生成唯一ID，並通過檢查生成的頁面來找到它。
  • 如果指定了ID，則作者有責任確保其唯一。
  • 更改ID可能會影響CSS、JS和資料層跟蹤。

設計對話框

設計對話框允許模板作者定義使用「容器元件」的內容作者可用的選項。

允許的元件頁籤

的 允許的元件 頁籤用於定義哪些元件可以由內容作者作為項目添加到容器元件中。

「允許的元件」頁籤的功能與同名的頁籤在 在模板編輯器中定義佈局容器的策略和屬性。

預設元件頁籤

「預設元件」頁籤用於定義在容器上放置特定資產類型時將哪個元件添加到元件中，類似於 如何在頁面模板上定義預設元件。

響應設定頁籤

• 列 — 定義生成容器網格中的列數。

背景頁籤

• 背景影像
  • 啟用背景影像 — 選擇此選項可使內容作者為容器定義背景影像。
• 背景色彩
  • 啟用背景顏色 — 選擇此選項可使內容作者為容器定義背景顏色。
  • 僅色板 — 選擇此選項僅允許內容作者從容器背景顏色的預定義顏色色板中進行選擇。
    • 僅在 啟用背景顏色 已選中
• 允許的色板 — 定義內容作者可以從中選擇容器背景顏色的預定義顏色
  • 使用 添加 按鈕。 添加後，將向清單中添加一個條目，該清單包含以下列：
  • 值 — 通過RGB值手動定義顏色
    • 點擊或按一下顏色選取器，通過調整單個RGB值或定義十六進位值，更輕鬆地選擇顏色。
  • 刪除 — 點擊或按一下以刪除色板。
  • 重新排列 — 點擊或按一下並拖動以重新排列色板的順序。

樣式頁籤

容器元件支AEM持 樣式系統。