頁面元件

頁面元件是可擴充的頁面元件,其設計可與範本編輯器搭配使用,並可讓頁首/頁尾和結構元件與範本編輯器組合。

使用狀況

頁面元件是使用核心元件設計的所有頁面以及可編輯範本的基礎。 使用頁面元件,頁首、頁尾和頁面結構就可使用其他核心元件定義為範本。

使用設計對話方塊,可為頁面定義自訂用戶端程式庫。 與具有可直接從元件訪問的編輯對話框的其他元件不同,因為頁面元件是頁面本身,所以頁面元件的edit對話框是頁面屬性窗口。

漸進式網頁應用程式支援

核心元件2.15.0版提AEM供對Cloud Service內建漸進式網頁應用程式(PWA)功能的支援。 透過網站層級的簡單設定,將您的體AEM驗轉變為PWA!

版本和相容性

目前的頁面元件版本為v2,此版本於2018年1月隨核心元件2.0.0版推出,並在本檔案中加以說明。

下表詳細說明所有支援的元件版本、元AEM件版本相容的版本,以及舊版檔案的連結。

元件版本 AEM 6.4 AEM 6.5 AEM as a Cloud Service
v2 相容 相容 相容
v1 相容 相容 -

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

技術詳細資訊

有關頁面元件的最新技術檔案可在GitHub上找到。

有關開發核心元件的詳細資訊,請參閱核心元件開發人員檔案

編輯對話框

由於元件代表整個頁面,因此通常在編輯對話框中的設定會出現在頁面屬性窗口中。

設計對話框

由於元件代表整個頁面,因此在編輯頁面模板時可通過​頁面資訊->頁面策略​訪問設計對話框。

頁面原則

注意

在舊版中AEM,頁面原則​稱為​頁面設計

屬性頁籤

使用「頁面設計」視窗,您可以定義要載入的用戶端程式庫以及頁面的網頁資源程式庫。

  • Client Libraries —— 這定義要載入的用戶端程式庫類別。JavaScript會新增至內文結尾,而CSS則會新增至頁面標題。

  • 用戶端程式庫JavaScript頁面標題 -這會定義要載入頁面標題中的JavaScript用戶端程式庫類別。

    • 此處定義的類別也會出現在​用戶端程式庫​欄位中,其JavaScript將載入頁面標題中,而非載入內文結尾。
    • 除非​用戶端程式庫​欄位中也包含類別,否則不會載入CSS。
  • Web資源客戶端庫 -用於提供Web資源(如Favicon)的客戶端庫類別。

  • 跳至主要內容元素選擇器 -用作協助工具功能,可直接跳至頁面的主要內容

頁面元件設計對話方塊

可以為​客戶端庫​和​客戶端庫JavaScript頁面標題​欄位配置庫,如下所示:

  • 若要新增欄位,請按一下或點選欄位下方的​新增​按鈕。
  • 若要移除欄位點按或點選要移除欄位旁的垃圾桶圖示。
  • 若要重新排列載入順序,請按一下或點選並拖曳要移動之欄位旁的控點。

有關使用客戶端庫的詳細資訊,請參閱使用客戶端庫

注意

核心元件版本2.2.0中,已引入為頁首個別定義用戶端程式庫的功能。

樣式標籤

頁面元件支AEM持樣式系統

Adobe客戶端資料層

頁面元件支援Adobe客戶端資料層。

本頁內容

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now