ヘッダーをスキップ
Oracle® Fusion Middleware WebCenter Sites開発者ガイド
11gリリース1 (11.1.1.8.0)
E49681-03
  ドキュメント・ライブラリへ移動
ライブラリ
製品リストへ移動
製品
目次へ移動
目次

前
 
次
 

64 Contributorインタフェース: ダッシュボードのカスタマイズ

この章では、WebCenter SitesのContributorインタフェースのダッシュボードをカスタマイズする方法を説明します。ダッシュボードの構成に関する詳細な説明と、この章で説明する手順を実行しながら使用できるサンプル・コードが記載されています。

この章は、次の項が含まれています。

64.1 ダッシュボード・カスタマイズの概要

Contributorインタフェースにログインすると、ダッシュボードが表示されます。デフォルトでは、図64-1に示すような使用準備済のウィジェット(「ブックマーク」、「SmartLists」、「チェックアウト」および「割当て」)がダッシュボードに表示されます。

図64-1 デフォルトのウィジェットが表示されたダッシュボード

図64-1の説明が続きます
「図64-1 デフォルトのウィジェットが表示されたダッシュボード」の説明

ダッシュボードおよびそのウィジェットの次の部分をカスタマイズできます。

64.2 ダッシュボードのカスタマイズ

システム定義のダッシュボードは、コントローラ・エレメントUI/Layout/CenterPane/DashboardContentsConfigによって生成されます。このエレメントをオーバーライドできます。

ダッシュボード構成は、グローバルまたはサイト固有にすることができます。デフォルトのウィジェットのカスタマイズ、新しいウィジェットの追加、および必要でないウィジェットの削除が行えます。

ダッシュボードをカスタマイズするには:

CustomElementsの下に独自のDashBoardContentsConfig.jspを作成し、そのプロパティをカスタマイズすることによって、エレメントUI/Layout/CenterPane/DashBoardContentsConfigをオーバーライドします。


注意:

新しいウィジェットが追加されるか、既存のウィジェットが更新される場合、変更が行われるようにWEM UIのユーザー・プリファレンスを消去する必要があります。


次に、UI/Layout/CenterPane/DashBoardContentsConfigエレメントを示します。表64-1のプロパティの説明が続きます。

エレメントUI/Layout/CenterPane/DashboardContentsConfig

<dashboardconfig>
   <dashboardlayout>
      <numberofcolumns></numberofcolumns>
      <columnwidths></columnwidths>
   </dashboardlayout>
   <components>
      <component id="widgetId"> 
         <name>widgetName</name>
         <url>widgetURL</url>
         <height>height_in_px</height>
         <dragRestriction>true | false </dragRestriction>
         <column>number_of_column_in_which_to_display_widget</column>
     </component>
         …
         … 
         …
   </components>
</dashboardconfig>

表64-1 UI/Layout/CenterPane/DashBoardContentsConfig.jspのプロパティ

プロパティ 説明

<numberofcolumns>

ダッシュボード表示の列数。

0より大きい整数。

システム・デフォルトは2です。

<columnwidths>

列のカンマ区切りの幅。

たとえば、<numberofcolumns>3列ある場合、<columnwidths>30、30、40にすることができます。

<components>

このセクションを使用して、ダッシュボード・ウィジェットを定義します。

なし

<component>

単一ウィジェットの定義に使用します。

なし

<id>

ウィジェットのID。

ウィジェット間で一意な英数字値。特殊文字は許可されません。

<name>

ウィジェットの表示名。

任意の文字列。

<url>

コントローラURL。

UI/Layout/CenterPane/DashBoard/<Your_Element>/ディレクトリにあるウィジェットのファイルの場所。

<height>

ウィジェットの高さ。

高さ(ピクセル単位)。たとえば、300pxと入力します。

<dragRestriction>

ウィジェットのドラッグを制限します。

true | false

<column>

ウィジェットが表示される列。

1からn。ここで、nは<numberofcolumns>で指定された値です。


64.3 ダッシュボードのカスタマイズの例

WebCenter Sites Contributorダッシュボードに新しいウィジェットを追加できます。新しいウィジェットを追加するには、次の2つの基本的な手順を実行します。

  1. ウィジェット・エレメントの作成

  2. カスタムDashBoardContentsConfig.jspエレメントへの新しいウィジェットの登録

この項では、ダッシュボードにウィジェットを追加するプロセスについて説明します。この項には、次の例が含まれています。

64.3.1 'Hello World'ウィジェットの追加

この項では、図64-2に示す、単純なウィジェットを作成および登録します。

図64-2 'Hello World'ウィジェット

図64-2の説明が続きます
「図64-2 'Hello World'ウィジェット」の説明

ウィジェットをダッシュボードに追加するには

  1. ウィジェットを作成します。

    1. CustomElementsの下にJSPエレメントを作成します。この例では、エレメントにHelloWorldHtmlという名前を付けます。

    2. ウィジェット・コードについては、このガイドで提供されているサンプル・ファイルに移動して、その内容をコピーできます。

  2. ウィジェットを登録します(ダッシュボードに追加します)。

    1. カスタムDashBoardContentsConfig.jspを開き、<components>セクションを見つけて、新しく作成されたウィジェットの仕様を追加します。例:

      <component id="helloworld">
        <name>Hello World</name>
        <url>Path_to_your_widget_under_CustomElements</url>
        <height>300px</height>
        <closable>false</closable>
        <open>true</open>
        <dragRestriction>true</dragRestriction>
        <style>checkoutPortlet</style>
        <column>2</column>
      </component>
      
    2. <applicationServer_install_directory>/webapps/<cs_context>/WEB-INF/classes/ReqAuthConfig.xmlファイルに移動して、excludedControllerElementsリストの下にあるサンプル・エレメントへのパスを追加します。この例では、パスは次のとおりです。

      <property name="excludedControllerElements">
         <list>
             <value>/UI/Layout/CenterPane/DashBoard/HelloWorld</value>
         </list>
      </property> 
      
    3. Contributorインタフェースのホームページをリフレッシュします。新しいウィジェットがダッシュボードに表示されます(図64-2)。

64.3.2 最近変更されたアセットを表示するウィジェットの追加

この項では、前の週に変更されたアセットを表示するウィジェットを作成します。この項の手順を完了したら、ダッシュボードに図64-3のようなウィジェットが表示されます。

図64-3 「最近変更されたアセット」ウィジェット

図64-3の説明が続きます
「図64-3 「最近変更されたアセット」」の説明

ウィジェットをダッシュボードに追加するには

  1. ウィジェットを作成します。

    1. CustomElementsの下にAction JSPエレメントを作成します。この例では、エレメントにRecentlyModifiedAssetsAction.jspという名前を付けます。ウィジェット・コードについては、このガイドで提供されるサンプル・ファイルに移動して、その内容をコピーできます。

    2. 前の手順で作成したアクション・エレメントのJson JSPエレメントを作成します。この例では、エレメントにRecentlyModifiedAssetsJson.jspという名前を付けます。コードについては、このガイドで提供されるサンプル・ファイルに移動して、その内容をコピーできます。このエレメントをRecentlyModifiedAssetsAction.jspエレメントと同じ場所にエレメントを置きます。

    3. ウィジェットのCustomElementsの下にプレゼンテーション・エレメントを作成します。ウィジェット・エレメントと同じ名前を付けます。この例では、表示エレメントにRecentlyModifiedAssetsHtml.jspという名前を付けます。コードについては、このガイドで提供されるサンプル・ファイルに移動して、その内容をコピーできます。


      注意:

      プレゼンテーション・エレメントはRecentlyModifiedAssetsAction.jspエレメントをコールします。そのエレメントへのパスを入力します。


  2. ウィジェットを登録します(ダッシュボードに追加します)。

    1. カスタムDashBoardContentsConfig.jspを開き、<components>セクションを見つけて、新しく作成されたウィジェットの仕様を追加します。例:

      <component id="myrecent">
      <!-- a unique identifier for the component. This must be unique among all the components. It can be alpha numeric but no special characters allowed --> 
            <name>Recently Modified Assets</name>
            <url>Path_to_your_custom_widget's presentation_element</url>
            <height>300px</height>
            <closable>false</closable>
            <open>true</open>
            <dragRestriction>false</dragRestriction>
            <style>checkoutPortlet</style>
            <column>2</column>
      </component>
      
    2. <applicationServer_install_directory>/webapps/<cs_context>/WEB-INF/classes/ReqAuthConfig.xmlファイルに移動して、excludedControllerElementsリストの下にあるサンプル・エレメントへのパスを追加します。この例では、パスは次のとおりです。

      <property name="excludedControllerElements">
         <list>
            <value>/UI/Layout/CenterPane/DashBoard/RecentlyModifiedAssets</value>
         </list>
      </property> 
      
    3. ダッシュボードをリフレッシュして、新しく構成されたウィジェットを表示します。例については、図64-3を参照してください。