1. Oracle WebCenter Sitesでの開発
  2. Oracle WebCenter Sitesのカスタマイズ
  3. コンテンツ監査レポートのカスタマイズ

66 コンテンツ監査レポートのカスタマイズ

カスタム・チャートをコンテンツ監査レポートに追加するか、OOTBチャートを変更して、コンテンツ監査レポートをカスタマイズできます。

トピック:

66.1 コンテンツ監査レポートについて

コンテンツ監査レポートは、特定のアセットの訪問者のトラフィックの統計を示すチャートのコレクションです。チャートは、ユーザーがWebサイトの訪問者のデータを表示および分析できる視覚化コンポーネントです。これらのチャート・コンポーネントでは、コンテンツ監査レポートに表示されるデータに対してWebCenter Sitesデータベースに問い合せます。

コンテンツ監査レポートを表示するには、アセットの調査ビューにアクセスして、アセットのツールバーの「レポート」アイコンをクリックします。デフォルトでは、レポートに次のチャートが表示されます。

  • メトリック・バー: 選択した期間中におけるアセットでのサイト訪問またはアクティビティに関する統計を表示する一連のティッカが含まれます。

  • オーサリング統計チャート: このレポートでは、選択した期間中にパブリッシュされたアセットの数と比較した、作成および編集されたアセットの数がプロットされますが、テンプレート・アセットなどの技術アセットは除きます。

  • パブリッシュの詳細レポート: このレポートには、選択した期間中のパブリッシュ履歴と予定パブリッシュ・ジョブに関する詳細が表示されます。

  • 作成者の生産性レポート: このレポートには、特定のコンテンツ管理サイトで、選択した期間中にアセットを作成および編集したコンテンツ・コントリビュータに関する情報が表示されます。

  • コンテンツ・タグ・クラウド: このレポートには、選択した期間範囲内にアセットに適用された最も一般的なタグが表示されます。

  • アセット・タイプ・リスト: このレポートには、特定のコンテンツ管理サイトで、選択した期間範囲内にユーザーが作成および編集操作を実行した上位5つのアセット・タイプのリストが表示されます。

  • 上位内部検索リスト: このレポートには、レポート対象期間範囲内にContributorインタフェースのユーザーが「検索」フィールドに入力した上位10個の単語またはフレーズがリストされます。

『Oracle Fusion Middleware Oracle WebCenter Sitesの使用』のコンテンツ監査レポートの操作に関する項を参照してください。

カスタム・チャートの作成、レポートへのカスタム・チャートの追加、レポートに表示されるデフォルト・チャートのカスタマイズおよびレポートからのチャートの削除によって、コンテンツ監査レポートをカスタマイズできます。デフォルトのコンテンツ監査レポートをカスタマイズしたり、デフォルトのレポートをオーバーライドする独自のコンテンツ監査レポートを作成したりできます。

66.2 コンテンツ監査レポートのカスタマイズ

チャートおよびチャートの実装に使用するレンダリング・エレメントを作成し、そのチャートをレポートに追加することによって、コンテンツ監査レポートをカスタマイズできます。

トピック:

66.2.1 コンテンツ監査レポートのカスタム・チャートの作成

チャートを作成するには、まずチャート・アセットを作成(WCS_Chartアセット・タイプを使用)し、ElementCatalogのCustomElementsの下にレンダリング・エレメントを作成する必要があります。

次の手順では、選択されたアセットのページ訪問の数を表示するカスタム棒グラフの例を使用して、カスタム・チャートを作成する手順を示します。

66.2.1.1 チャート・アセットの作成
  1. WebCenter Sitesにログインしてチャートを作成するサイトを選択し、Adminインタフェースを選択します。
  2. ナビゲーション・ペインで、コンテンツ・バーを選択して、「インサイト」ツリーを開き、「チャート」ノードを開きます。
  3. 「チャート」ノードの下で、「新規追加」をクリックします。

    チャート・アセットの作成フォームが開きます。

  4. 次の各フィールドに値を入力します。

    • 名前: チャートの名前を入力します(「Custom」など)。

    • 説明: チャートの説明を提供します(Custom棒グラフなど)。

  5. 「保存」をクリックします。
66.2.1.2 チャートを実装するレンダリング・エレメントの作成

カスタム・チャートを実装するには、CustomElementsの下にチャートのレンダリング・エレメントを作成する必要があります。UIコントローラは、3つのフェーズ(構成、アクション、プレゼンテーション)でこれらのカスタム・エレメントをテストします。

この例では、CustomElements/avisports/UI/Layout/CenterPane/Insights/Chartsの下にチャート用の<CustomChart>Action.jspおよび<CustomChart>Html.jspエレメントを作成します。この場所では、avisportsサンプル・サイトのコンテンツ監査レポートに表示されるチャートを指定します。

ノート:

UIコントローラが処理する構成設定がないため、この例のチャートでは、構成エレメント(<CustomChart>Config.jsp)が必要ありません。「UIコントローラ」を参照してください。

  1. <CustomChart>Action.jspを作成します。次に例を示します。
    <%@ taglib prefix="cs" uri="futuretense_cs/ftcs1_0.tld" %>
<%@ taglib prefix="ics" uri="futuretense_cs/ics.tld" %>
<%@ taglib prefix="satellite" uri="futuretense_cs/satellite.tld" %>
<%@ taglib prefix="controller" uri="futuretense_cs/controller.tld"%>
<%@page import="java.util.*"%>
<%@page import="java.text.*"%>
<%@page import="org.codehaus.jackson.map.ObjectMapper"%>
<%@page import="com.fatwire.cs.ui.framework.UIException"%>
<%@page import="com.fatwire.ui.util.GenericUtil"%>
<cs:ftcs>
<controller:callelement elementname="UI/Layout/CenterPane/Insights/Charts/DateRange">
</controller:callelement>
<%
try{

    // BUSINESS LOGIC TO RETRIEVE DATA FOR THE CHART
    //convert the results to json string and set in the request attribute.
    ObjectMapper m = new ObjectMapper();
      // CONVERT OBJECT TO JSON
    //String json = m.writeValueAsString(mainList); 
    request.setAttribute("json", json); 
} catch(UIException e) {
    request.setAttribute(UIException._UI_EXCEPTION_, e);
    throw e;
} catch(Exception e) {
    UIException uie = new UIException(e);
    request.setAttribute(UIException._UI_EXCEPTION_, uie);
    throw uie;
}
%>
</cs:ftcs>
  2. CustomHtml.jspを作成します。次に例を示します。
    <%@ taglib prefix="cs" uri="futuretense_cs/ftcs1_0.tld" %>
<%@ taglib prefix="ics" uri="futuretense_cs/ics.tld" %>
<cs:ftcs>
<div id='<%=ics.GetVar("chartId")%>'>
<h3 style="text-align:center">Custom Page Visit Bar Chart</h3>
    <div data-bind="ojComponent: {
    component: 'ojChart',
    type: 'bar',
    selection: 'multiple',
    series: visitsValue,
    groups: timestampValue,
    timeAxisType: 'enabled',
    animationOnDisplay: 'auto',
    legend: {position: 'top'}
    }"
    style="width:100%;height:100%;">
    </div>
</div>

<script>
    require( ['ojs/ojcore', 'knockout', 'jquery', 'ojs/ojknockout', 'ojs/ojcomponents', 'ojs/ojchart'],
            function(oj, ko, $)
            {  
               function ChartModel() {				
                   var data = <%=request.getAttribute("json")%>;

                   var visits = [];				
                   for(var i=0; i<data.length; i++){
                       visits.push({name:data[i].name, items:data[i].items});					
                   }
                   var timestamps = (data.length > 0) ? data[0].timestamps : [];
                   this.visitsValue = ko.observableArray(visits);
                   this.timestampValue = ko.observableArray(timestamps);
               }
               var chartModel = new ChartModel();
               $(document).ready(
                   function()
                   {
                       ko.applyBindings(chartModel, document.getElementById('<%=ics.GetVar("chartId")%>'));
                   }
               );
            }
    );
</script>
</cs:ftcs>

    この例のエレメントは、チャートをプロットします。このエレメントにより、Oracle JetライブラリおよびCustomAction.jspで取得されたデータを使用して棒グラフが作成されます。

    Contributorインタフェースでチャートを表示するために、コンテンツ監査レポートに追加します(ReportHtml.jsp)。

66.2.1.3 レポートへのチャートの追加

Contributorインタフェースでこのチャートを表示するために、コンテンツ監査レポートに追加します。「レポートへのカスタム・チャートの追加」を参照してください。

66.2.2 チャートのレンダリング・エレメントの変更

  1. ElementCatalogで、ElementCatalogに同じパスでUI/Layout/CenterPane/Insights/Charts/<ChartName>からCustomElementsにチャートのレンダリング・エレメントをコピーします。たとえば、CustomElements/UI/Layout/CenterPane/Insights/Charts/<ChartName>などです。
  2. テキスト・エディタでレンダリング・エレメントを開き、JSPファイルに変更を加えます。「カスタム・エレメント」を参照してください。

66.2.3 レポートへのカスタム・チャートの追加

  1. カスタム・チャートをコンテンツ監査レポートに追加します。

    • チャートをカスタム・コンテンツ監査レポートに追加するには、次の行をカスタムReportHtml.jspに挿入します。 

      <!-- Include the charts here -->
<div class="block box event-box">
<div id="PageVisitRankContainer" class="siteinsightschart" 
data-chartname="Custom"></div>
</div>

    • チャートをデフォルトのコンテンツ監査レポートに追加するには、次の行をUI\Layout\CenterPane\Insights\Dashboard\ContentAuditHtml.jspに挿入します。

      ノート:

      変更を行う前にこのエレメントのコピーをCustomElementsに作成します。 
      <div class="siteinsightschart" data-chartname="<ChartName>"></div>

  2. チャートがコンテンツ監査レポートに適切に表示されていることを確認します。

    1. WebCenter Sitesにログインしてavisportsサンプル・サイトを選択し、「コントリビュータ」アイコンを選択します。

    2. 記事アセットまたはページ・アセットを開き、「レポート」アイコンをクリックします。

      カスタム・レポートでカスタム・チャートがロードされます。

      図66-1 カスタム・チャートを使用したカスタム・コンテンツ監査レポート

      図66-1の説明が続きます
      「図66-1 カスタム・チャートを使用したカスタム・コンテンツ監査レポート」の説明