使用 AEM 可以管理多种不同类型的内容(如页面、资产)。AEM 功能板提供一种简单易用的自定义方式来定义主要显示综合数据的页面。
AEM 功能板是基于每位用户创建的,因此用户只能访问他们自己的功能板。
但是,功能板模板可用于共享常用配置和功能板布局。
要创建新的功能板,可按照以下步骤进行操作:
在工具区域中,单击配置控制台。
在树中,双击功能板。
单击新建功能板。
键入标题(例如“我的功能板”)和名称。
单击创建。
建议您创建多个功能板,以便在不同的视图中快速查看与内容有关的信息。为了帮助您创建新功能板,AEM 提供了一种克隆功能,可用于复制现有的功能板。要克隆功能板,请按照以下步骤执行操作:
在工具区域中,单击配置控制台。
在树中,单击功能板。
单击要克隆的功能板。
单击克隆。
键入新功能板的名称。
在工具区域中,单击配置控制台。
在树中,单击功能板。
单击要删除的功能板。
单击删除。
单击是以确认。
功能板组件只是常规的AEM组件。 本节介绍随 AEM 一起推出的报表组件。
AEM附带一组组件,这些组件可渲染SiteCatalyst数据的多个量度。 这些组件在功能板区域下方的 Sidekick 中列出。
每个报表组件提供至少三个选项卡:
基本:包含主配置。
报表:包含每个组件的特定配置。
样式:包含样式配置,如图表大小和边距。
报表组件会初始化为默认配置,这有助于您快速设置功能板。
基本选项卡提供对以下配置条目的访问权:
标题功能板上显示的标题。
请 求类型请求数据的方式。
SiteCatalyst配置(可选) 要用于连接到SiteCatalyst的配置。如果未提供,则认为该配置是在功能板页面上进行配置的(通过页面属性)。
报表包ID(可选) 要用于生成图形的SiteCatalyst报表包。
为了显示网站分析,您需要定义想要获取的数据的日期范围。报表选项卡提供两个用于定义该范围的字段。
若设置一个较大的日期范围,会降低功能板的响应能力。
从 中获取数据的绝对或相对日期。
Date To Absolute或相对日期,从中获取数据。
每个组件还定义特定设置。
X轴 的日期粒度时间单位(例如,日、小时)。
量度要显示的事件列表。
元素用于划分图表中量度数据的元素列表。
元素:用于划分图表中量度数据的元素。
量度要显示的事件。
否. 排名最前的项目报表显示的项目数。
量度要显示的事件。
元素:用于划分图表中量度数据的元素。
该组件显示一个图形,图中又根据以下配置显示网站中访问量较大的区域。
否. 排名最前的项目报表中显示的节数。
X轴 的日期粒度时间单位(例如,日、小时)。
量度要显示的事件。
元素:用于划分图表中量度数据的元素。
功能板是普通页面 (cq:Page
),因此任何组件都可用于构建功能板。
有一个默认的组件组Dashboard
,其中包含分析报表组件,默认情况下,该组件组在模板中处于启用状态。
模板定义新功能板的默认内容。您可以使用多个模板来创建不同类型的功能板。
功能板模板的创建方式与其他页面模板类似,只是它们存储在/libs/cq/dashboards/templates/
下。 请参阅创建内容页面模板部分。
功能板模板可在用户之间共享。
开发功能板组件包括创建一个常用 AEM 组件。本节介绍用于显示头 10 位参与者的组件示例。
顶级创作组件存储在位于/apps/geometrixx-outdoors/components/reporting
的存储库中,由以下组成:
一个 jsp
文件,它可读取数据并定义 html
占位符。
一个客户端库,其中包含一个可对数据进行获取或排序,然后填充 js
占位符的 html
文件。
以下Javascript文件在geout.reporting.topauthors
客户端库中定义为组件本身的子项。
QueryBuilder用于查询存储库以读取cq:AuditEvent
节点。 查询结果是一个可从其中提取作者投稿的 JSON 对象。
$.ajax({
url: "/bin/querybuilder.json",
cache: false,
data: {
"orderby": "cq:time",
"orderby.sort": "desc",
"p.hits": "full",
"p.limit": 100,
"path": "/var/audit/com.day.cq.wcm.core.page/",
"type": "cq:AuditEvent"
},
dataType: "json"
}).done(function( res ) {
var authors = {};
// from JSON to Object
for(var r in res.hits) {
var userId = res.hits[r].userId;
if(userId == undefined) {
continue;
}
var auth = authors[userId] || {userId : userId};
auth.contrib = (auth.contrib || 0) +1;
authors[userId] = auth;
}
// order by contribution
var orderedByContrib = [];
for(var a in authors) {
orderedByContrib.push(authors[a]);
}
orderedByContrib.sort(function(a,b){return b.contrib - a.contrib});
// produce the list
for (var i=0, tot=orderedByContrib.length; i < tot; i++) {
var current = orderedByContrib[i];
$("<div> #" + (i + 1) +" "+ current.userId + " (" + current.contrib +" contrib.)</div>").appendTo("#authors-list");
}
});
JSP
包括global.jsp
和clientlib
。
<%@page session="false" contentType="text/html; charset=utf-8" %><%
%><%
%><%@include file="/libs/foundation/global.jsp" %><%
%>
<ui:includeClientLib categories="geout.reporting.topauthors" />
<%
String reportletTitle = properties.get("title", "Top Authors");
%>
<html>
<h3><%=xssAPI.encodeForHTML(reportletTitle) %></h3>
<div id="authors-list"></div>
</html>