自訂網站主控台(傳統UI)

新增自訂欄至網站(網站管理員)主控台

網站管理控制台可延伸,以顯示自訂欄。 主控台是根據JSON物件建置,可透過建立實作ListInfoProvider介面的OSGI服務來擴充。 此類服務會修改傳送至用戶端的JSON物件,以建置主控台。

本逐步教學課程說明如何透過實作ListInfoProvider介面,在「網站管理控制台」中顯示新欄。 它包含下列步驟:

  1. 建立OSGI服 務並將包含該服務的套件組合部署至AEM伺服器。
  2. (選用)發出JSON呼叫以要求用於建置主控台的JSON物件,以測試新服務
  3. 通過擴展儲 存庫中控制台的節點結構來顯示新列。
注意

本教學課程也可用來擴充下列管理主控台:

  • 數位資產主控台
  • 社群主控台

建立OSGI服務

ListInfoProvider介面定義兩種方法:

  • updateListGlobalInfo,以更新清單的全局屬性,
  • updateListItemInfo,以更新單一清單項目。

這兩種方法的引數為:

  • request,相關的Sling HTTP要求物件,
  • info,即要更新的JSON物件,分別是全域清單或目前清單項目,
  • resource,即Sling資源。

以下是範例實作:

  • 為每個項目新增​星形​屬性,如果頁面名稱以​e​開頭,則為true,否則為false

  • 新增​stardedCount​屬性,此屬性是清單的全域屬性,並包含星號清單項目的數量。

若要建立OSGI服務:

  1. 在CRXDE Lite中,建立套件
  2. 新增下列范常式式碼。
  3. 建立套件組合。

新服務已啟動並正在運行。

package com.test;

import com.day.cq.commons.ListInfoProvider;
import com.day.cq.i18n.I18n;
import com.day.cq.wcm.api.Page;
import org.apache.felix.scr.annotations.Component;
import org.apache.felix.scr.annotations.Service;
import org.apache.sling.api.SlingHttpServletRequest;
import org.apache.sling.api.resource.Resource;
import org.apache.sling.commons.json.JSONException;
import org.apache.sling.commons.json.JSONObject;

@Component(metatype = false)
@Service(value = ListInfoProvider.class)
public class StarredListInfoProvider implements ListInfoProvider {

    private int count = 0;

    public void updateListGlobalInfo(SlingHttpServletRequest request, JSONObject info, Resource resource) throws JSONException {
        info.put("starredCount", count);
        count = 0; // reset for next execution
    }

    public void updateListItemInfo(SlingHttpServletRequest request, JSONObject info, Resource resource) throws JSONException {
        Page page = resource.adaptTo(Page.class);
        if (page != null) {
            // Consider starred if page name starts with 'e'
            boolean starred = page.getName().startsWith("e");
            if (starred) {
                count++;
            }
            I18n i18n = new I18n(request);
            info.put("starred", starred ? i18n.get("Yes") : i18n.get("No"));
        }
    }

}
注意
  • 您的實作應根據提供的要求和/或資源,決定是否應將資訊新增至JSON物件。
  • 如果您的ListInfoProvider實作定義了回應物件中已存在的屬性,則其值將由您提供的屬性覆寫。

您可以使用服務排名來管理多個ListInfoProvider實作的執行順序。

測試新服務

當您開啟網站管理主控台並瀏覽您的網站時,瀏覽器會發出ajax呼叫,以取得用來建置主控台的JSON物件。 例如,當您瀏覽至/content/geometrixx資料夾時,會傳送下列要求至AEM伺服器以建置主控台:

https://localhost:4502/content/geometrixx.pages.json?start=0&limit=30&predicate=siteadmin

要確保新服務在部署包含該服務的包後運行:

  1. 將瀏覽器指向以下URL:
    https://localhost:4502/content/geometrixx.pages.json?start=0&limit=30&predicate=siteadmin

  2. 回應應會依下列方式顯示新屬性:

screen_shot_2012-02-13at163046

顯示新列

最後一步是調整網站管理控制台的節點結構,以透過覆蓋/libs/wcm/core/content/siteadmin來顯示所有Geometrixx頁面的新屬性。 按如下步驟進行:

  1. 在CRXDE Lite中,使用類型sling:Folder的節點建立結構/apps/wcm/core/content以反映結構/libs/wcm/core/content

  2. 複製節點/libs/wcm/core/content/siteadmin並貼到/apps/wcm/core/content下方。

  3. 將節點/apps/wcm/core/content/siteadmin/grid/assets複製到/apps/wcm/core/content/siteadmin/grid/geometrixx並更改其屬性:

    • 移除​pageText

    • 將​pathRegex​設為/content/geometrixx(/.*)?
      這會使網格設定在所有geometrixx網站中都處於作用中狀態。

    • 將​storeProxySuffix​設為.pages.json

    • 編輯​storeReaderFields​多值屬性並新增starred值。

    • 若要啟用MSM功能,請將下列MSM參數新增至multi-String屬性​storeReaderFields:

      • msm:isSource
      • msm:isInBlueprint
      • msm:isLiveCopy
  4. /apps/wcm/core/content/siteadmin/grid/geometrixx/columns下添加starred節點(類型為​nt:unstructured),其屬性如下:

    • dataIndex: starred 類型字串

    • 標題: Starred 類型字串

    • xtype: gridcolumn 類型字串

  5. (可選)將您不想顯示在/apps/wcm/core/content/siteadmin/grid/geometrixx/columns的列拖放

  6. /siteadmin 虛名路徑,預設會指 /libs/wcm/core/content/siteadmin向若要將此重新導向至您/apps/wcm/core/content/siteadmin上的網站管理員版本,請定義屬性sling:vanityOrder,使其值高於/libs/wcm/core/content/siteadmin上定義的值。 預設值為300,因此任何高於的值都合適。

  7. 前往「網站管理」主控台,並導覽至Geometrixx網站:
    https://localhost:4502/siteadmin#/content/geometrixx.

  8. 名為​Starded​的新列可用,按如下所示顯示自定義資訊:

screen_shot_2012-02-14at104602

注意

如果多個網格配置與​pathRegex​屬性定義的請求路徑匹配,則將使用第一個網格配置,而不是最具體的網格配置,這表示配置的順序非常重要。

示例包

本教學課程的結果可在Customizing the Websites Administration Console套件共用上取得。

本頁內容