プライマリ・コンテンツに移動
Oracle® Fusion Middleware Oracle WebCenter Sitesでの開発
12c (12.2.1.2.0)
E82734-02
目次へ移動
目次
前
前 		次
次

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

ダッシュボードのカスタマイズを開始する前に、その構成について理解します。また、サンプル・コードを使用してダッシュボードのカスタマイズを試してみることもできます。

トピック:

70.1 ダッシュボードのカスタマイズについて

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

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

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

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

  • 列の数

  • 列幅

  • 表示名、高さおよびダッシュボード位置

  • ウィジェットの数

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

ダッシュボードをカスタマイズするとき、システム定義のダッシュボードを生成するコントローラ・エレメントをオーバーライドできます。グローバル設定でダッシュボードを構成するか、ダッシュボードをサイト固有にすることができます。ダッシュボードでは、デフォルトのウィジェットのカスタマイズ、新しいウィジェットの追加、およびコンテンツ・チームとマーケティング・チームが必要としなくなったウィジェットの削除を行うことができます。

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

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

注意:

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

次に、UI/Layout/CenterPane/DashBoardContentsConfigエレメントを示します。表70-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>

表70-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>で指定された値です。

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

コンテンツ・チームおよびマーケティング・チームに、生産性を上げるのに役立つウィジェットを確認することをお薦めします。Contributorダッシュボードにそれらのウィジェットを追加できます。

新しいウィジェットを追加するには:

  1. ウィジェット・エレメントを作成します。
  2. カスタムDashBoardContentsConfig.jspエレメントに新しいウィジェットを登録します。

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

次の手順では、図70-2に示す、単純なウィジェットを作成および登録する方法を示します。

図70-2 Hello Worldウィジェット

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

ダッシュボードにウィジェットを追加するには、次のようにウィジェットを作成します。

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

  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インタフェースのホームページをリフレッシュします。新しいウィジェットがダッシュボードに表示されます(図70-2)。

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

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

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

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

ダッシュボードにウィジェットを追加するには、次のようにウィジェットを作成します。

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

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

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

    注意:

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

ウィジェットを登録(ダッシュボードに追加)するには:

  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. ダッシュボードをリフレッシュして、新しく構成されたウィジェットを表示します。図70-3に示す例を参照してください。
前
前 		次
次
目次へ移動
目次