ヘッダーをスキップ
Oracle® Fusion Middleware Oracle WebCenter Portal開発者用チュートリアル
11g リリース1 (11.1.1.7.0)
B55930-04
  目次へ移動
目次
索引へ移動
索引

前
 
次
 

7 ページのカスタマイズと権限の設定および実行時の編集

このレッスンでは、デザインタイムの開発者として、WebCenter Portal: Frameworkアプリケーションのページ階層内の特定のページのコンテンツをカスタマイズし、そのページおよびコンテンツを階層に追加して、ユーザー・アクセスおよびドキュメント・コンテンツの編集または変更の権限を設定できるようにします。

また、HTML形式のドキュメントをUCMリポジトリから新しい.jspxページの引渡し可能なパネル・コンポーネントにドラッグ・アンド・ドロップし、そのページを「コンテンツ・プレゼンタ」タスク・フローとしてレンダリングします。「コンテンツ・プレゼンタ」タスク・フローでは、ポータル・アプリケーションにコンテンツを追加することが可能で、このケースでは、コンテンツ・リポジトリに保存されたドキュメント・コンテンツをドキュメント・サービスを使用して表示します。ドキュメント・サービスには、実行時にドキュメントを管理、表示および検索するためのわかりやすいインタフェースが用意されています。

最後の手順では、認証済ユーザーが実行時にこれらのコンテキスト内HTMLページのコンテンツを編集できるように設定します。ポップアップ・ウィンドウで、UCMリポジトリに保存されたコンテンツを追加または変更するための編集セッションが開きます。

このレッスンの終了時には、実行時にContact UsページでHTMLコンテンツのコンテキスト内編集が有効化されると、前のレッスンで作成したホーム・ページが図7-1のようになります。

図7-1 実行時の編集が有効化されたポータル・アプリケーションのContact Usページ

図7-1の説明が続く
「図7-1 実行時の編集が有効化されたポータル・アプリケーションのContact Usページ」の説明

概要

このレッスンの手順は次のとおりです。

このレッスンの手順を始める前に、この時点に到るまでのチュートリアルの手順を実行したことを確認します。

手順1: ページのカスタマイズと権限の設定

前のレッスン(第6章)の手順に基づいて、これからWebCenter Portalアプリケーションの特定のページをカスタマイズして、ページ権限およびユーザー・アクセスを設定する手順に進みます。

このタスクを完了するために、まず新しい.jspxページ(このケースではcontacts.jspx)を作成してから、このページをページ階層に追加する必要があります。ページを階層に追加するとページ権限を設定できるため、セキュリティ目的でこれらのページへのユーザー・アクセスを指定できます。

ポータル・アプリケーションでページをカスタマイズしてページ権限を設定するには、次のようにします。

  1. JDeveloperで、「アプリケーション・ナビゲータ」にあるpagesフォルダに移動します。

  2. 「新規」を右クリックして「Web層」を展開し、「JSF」を選択してから「JSFページ」を選択すると、図7-2に示すように、「JSFページの作成」ダイアログが開きます。

  3. 「ファイル名」フィールドにcontacts.jspxと入力し、「XMLドキュメントの作成(*.jspx)」チェック・ボックスが選択されていることを確認します。

    図7-2 Globeページ・テンプレートが選択された「JSFページの作成」ダイアログ

    図7-2の説明が続きます
    「図7-2 Globeページ・テンプレートが選択された「JSFページの作成」ダイアログ」の説明

  4. 「ページ・テンプレート」として、使用可能なテンプレートのリストからGlobeページ・テンプレートを選択します。

  5. 「OK」をクリックします。

  6. contacts.jspxを選択して、「ソース」ビューで開きます(図7-3)。

    図7-3 ソース・ビューで表示されたcontacts.jspxファイル

    図7-3の説明が続きます
    「図7-3 ソース・ビューで表示されたcontacts.jspxファイル」の説明

  7. 「アプリケーション・ナビゲータ」で、pagesフォルダに格納されているhome.jspxファイルを選択し、このファイルを「ソース」ビューで開いて、図7-4に示すように、value属性を指定しているコード行を選択します。これは、実行時に発生するテンプレートの変更をページで取得するために必要な手順です。

    図7-4 ソース・ビューのhome.jspxファイルで選択されたvalue属性

    図7-4の説明が続きます
    「図7-4 ソース・ビューのhome.jspxファイルで選択されたvalue属性」の説明

  8. 図7-4で強調表示されているコード行(ページ・テンプレート・バインディングを指定するvalue属性)をコピーして、図7-5に示すように、value属性が存在するcontacts.jspxファイルにこのコード行をペーストします。

    図7-5 contacts.jspxファイルにペーストされたvalue属性

    図7-5の説明が続きます
    「図7-5 contacts.jspxファイルにペーストされたvalue属性」の説明

  9. 図7-6に示すように、home.jspxファイルを選択し、ファイルを右クリックして、「ページ定義に移動」メニュー項目を選択します。homePageDef.xmlファイルが開きます。

    図7-6 ソース・ビューのhome.jspxファイルでのページ定義の指定

    図7-6の説明が続きます
    「図7-6 ソース・ビューのhome.jspxファイルでのページ定義の指定」の説明

  10. 図7-7および例7-1に示すように、「ソース」ビューのhomePageDef.xmlファイルで、ページ・テンプレートのviewID属性およびページ・テンプレート・バインディングのidを指定するコード・スニペットを選択してコピーします。

    図7-7 viewID属性が選択されたソース・ビューのhomePageDef.xmlファイル

    図7-7の説明が続きます
    「図7-7 viewID属性が選択されたソース・ビューのhomePageDef.xmlファイル」の説明

    例7-1 contactsPageDef.xmlにコピーするコード・スニペット

    <page viewID="${preferenceBean.defaultPageTemplate}"
           id="pageTemplateBinding" Refresh="ifNeeded"/>
    
  11. homePageDef.xmlファイルを開いたときの図7-6のように、contacts.jspxファイルを選択し、ファイルを右クリックして、「ページ定義に移動」メニュー項目を選択します。

  12. 「ソース」ビューでcontactsPageDef.xmlファイルを開き、前の手順でコピーしたコード・スニペットをペーストして、図7-8に示すコード行と置き換えます。これらのコード行は、contactsページ定義ファイルのpath属性およびid属性を指定しています。

    図7-8 contactsPageDef.xmlで選択されたpath属性およびid属性

    図7-8の説明が続きます
    「図7-8 contactsPageDef.xmlで選択されたpath属性およびid属性」の説明

  13. contacts.jspxファイルを選択して「ソース」ビューで開きます。次にJDeveloperで、アプリケーションの右側の列にある「コンポーネント・パレット」(「表示」→「コンポーネント・パレット」を選択)に移動し、「コンポーザ」を選択します。

  14. 図7-9に示すように、コンポーザで、リスト内の項目をPage Customizableコンポーネントまで移動し、このコンポーネントをcontacts.jspxファイルのコード行<f:facet name="content">の後にドラッグ・アンド・ドロップします。


    ヒント:

    Page Customizableコンポーネントは、ページのカスタマイズ可能な部分を示し、実行時に「編集」モードで「コンポーザ」ツールバーに表示されます。Page Customizableコンポーネントに囲まれているコンポーネントは、カスタマイズおよび編集が可能です。


    図7-9 contacts.jspxに追加されるPanel Customizableのコード・スニペット

    図7-9の説明が続きます
    「図7-9 contacts.jspxに追加されるPanel Customizableのコード・スニペット」の説明

  15. 図7-10に示すように、JDeveloperでUCM接続を展開し、contactus.htmlファイルをpanelCustomizableコンポーネントにドラッグ・アンド・ドロップします。

    図7-10 Contact Usフォルダで選択されたcontactus.htmlファイル

    図7-10の説明が続きます
    「図7-10 Contact Usフォルダで選択されたcontactus.htmlファイル」の説明

  16. 図7-11に示すように、ポップアップ・メニューが表示されたら「作成」メニュー項目を選択し、「ドキュメント - コンテンツ・プレゼンタ」タスク・フロー・サブ・メニュー項目に移動して、HTMLコンテンツをレンダリングします。


    ヒント:

    「コンテンツ・プレゼンタ」タスク・フローを使用すると、ポータル・アプリケーションに効率的にコンテンツを追加できるようになります。単一のコンテンツ・アイテム、複数のコンテンツ・アイテムまたはコンテンツの問合せを選択してから、アプリケーションのページでそのコンテンツをレンダリングするためのテンプレートを選択します。これにより、「コンテンツ・プレゼンタ」を使用して、WebCenter Portalアプリケーションのコンテンツの選択および表示を正確にカスタマイズできます。

    「コンテンツ・プレゼンタ」タスク・フローは、接続されるコンテンツ・リポジトリがOracle Content Serverで、WebCenterの管理者が前提条件の構成を完了している場合のみ使用可能です。コンテンツ・リポジトリおよびUCMの管理の詳細は、Oracle Fusion Middleware Oracle WebCenter Portal管理者ガイドを参照してください。

    ドキュメント・サービスを使用すると、コンテンツ・サーバーまたはファイル・システムのコンテンツをアプリケーションで直接表示できます。エンド・ユーザーは、ドキュメントをはじめ、コンテンツ・リポジトリに保存されている他のタイプのコンテンツも表示および管理できます。


    図7-11 「作成」で選択された「ドキュメント - コンテンツ・プレゼンタ」タスク・フロー

    図7-11の説明が続きます
    「図7-11 「作成」で選択された「ドキュメント - コンテンツ・プレゼンタ」タスク・フロー」の説明

  17. 図7-12に示すように、「タスク・フロー・バインディングの編集」ダイアログが表示されます。「入力パラメータ」セクションのdatasourceフィールドに、UCM値があります。

    図7-12 データ・ソース値としてUCMドキュメント名が表示された「タスク・フロー・バインディングの編集」ダイアログ

    図7-12の説明が続きます
    「図7-12 データ・ソース値としてUCMドキュメント名が表示された「タスク・フロー・バインディングの編集」ダイアログ」の説明

  18. 「OK」をクリックします。

  19. ポータル・アプリケーションに戻り、pagehierarchyフォルダに移動します。図7-13に示すように、pages.xmlファイルを開きます。

    図7-13 page.xmlファイルの「ページ階層」の「ルート」ノード

    図7-13の説明が続きます
    「図7-13 page.xmlファイルの「ページ階層」の「ルート」ノード」の説明

  20. pages.xmlの「ページ階層」ペインが開いたら、contacts.jspxファイルを「ルート」ノードにドラッグ・アンド・ドロップします(図7-14)。

    図7-14 「ルート」ノードでcontactsが選択されたpages.xmlの「ページ階層」

    図7-14の説明が続きます
    「図7-14 「ルート」ノードでcontactsが選択されたpages.xmlの「ページ階層」」の説明

  21. 「ルート」ノードでcontactsを選択し、「ページ階層」ペインで表示可能チェック・ボックスの選択を解除します(図7-14では選択されています)。

  22. 図7-15に示すように、navigationsフォルダのdefault-navigation-model.xmlファイルに移動し、「設計」ビューで開きます。

    図7-15 設計ビューで表示されたdefault-navigation-model.xmlファイル・ペイン

    図7-15の説明が続きます
    「図7-15 設計ビューで表示されたdefault-navigation-model.xmlファイル・ペイン」の説明

  23. pagesフォルダに移動してcontacts.jspxファイルを選択し、default-navigation-modelノードにドラッグします(図7-16)。

    図7-16 ナビゲーション・モデルに追加された連絡先リンク

    図7-16の説明が続きます
    「図7-16 ナビゲーション・モデルに追加された連絡先リンク」の説明

  24. 「ページ・リンク」アイテムを選択し、「新しいノードを追加します」アイコンを選択してリンクをナビゲーション・モデルに追加し、Default-navigation-modelの下に新たに生成されたアイテム「Contacts」をクリックします。

  25. 図7-17に示すように、「ID」フィールドにcontactsと入力された「ナビゲーション」ダイアログが開きます。「URL属性」ペインで、「表示値」にContact Usと入力します。

    図7-17 IDとしてContactsおよび表示値としてContact Usが指定された「ナビゲーション」ペイン

    図7-17の説明が続きます
    「図7-17 IDとしてContactsおよび表示値としてContact Usが指定された「ナビゲーション」ペイン」の説明

  26. 「アプリケーション・ナビゲータ」に戻り、Portalプロジェクトを選択し、「実行」を右クリックして、Webブラウザでアプリケーションを起動します。

    Figure 7-18に示すように、ナビゲーション・モデルの一部としてContact Usと表示されたアプリケーションがWebブラウザで開きます。ページにコンポーザからのコンテンツが移入されます。

    「コンテンツ・プレゼンタ」タスク・フローの作成と追加およびテンプレートの表示の詳細は、『Oracle Fusion Middleware Oracle WebCenter Portal開発者ガイド』の「コンテンツ・プレゼンタの表示テンプレートの作成」の章を参照してください。

    図7-18 ナビゲーションにContact Usリンクが追加されてWebブラウザに表示されたMyPortalApplication

    図7-18の説明が続きます
    「図7-18 ナビゲーションにContact Usリンクが追加されてWebブラウザに表示されたMyPortalApplication」の説明

手順2: 実行時のドキュメントの編集

アプリケーションの連絡先ページをカスタマイズし、contacts.htmlドキュメントをUCMリポジトリからcontacts.jspxpanelCustomizableコンポーネントにドラッグ・アンド・ドロップして、「コンテンツ・プレゼンタ」タスク・フローとしてレンダリングする手順が完了しましたので、ここからはドキュメントのコンテキスト内HTML編集機能を有効化するタスクに進みます。

コンテキスト内ドキュメント編集を使用すると、認証済ユーザーは、ドキュメント・コンテンツにより簡単にアクセスして管理できるようになります。ただし、この機能は実行時にのみ使用可能です。

実行時にドキュメントを編集するには、次のようにします。

  1. 「アプリケーション・ナビゲータ」でPortalプロジェクトを選択し、「実行」を右クリックして、Webブラウザでアプリケーションを起動します。

  2. パスワードとしてweblogic1を指定してweblogic (これにより管理権限が付与されます)としてログインし(図7-19)、バナーにある「Contact Us」リンクをクリックして「Contact Us」ページに移動します。

    図7-19 Home Webページへのログイン

    図7-19の説明が続きます
    「図7-19 Home Webページへのログイン」の説明

  3. 「Contact Us」ページが表示されたら、ページのコンテンツをクリックして、キーボードで[Ctrl] + [Shift] + [C]を押します。「Contact Us」ページは、Webブラウザの中央に表示され、破線の輪郭と、ナビゲーション・バーの下の右上角には編集アイコンが表示されます。これは「Contact Us」ページの輪郭の内側部分がドキュメント・コンテンツ用に編集可能であることを示します(図7-20参照)。


    ヒント:

    [Ctrl] + [Shift] + [C]キーを押すと、コンテンツ・コントリビューション・モードが有効化され、UCMコンテンツ・リポジトリに保存されたコンテキスト内のHTMLコンテンツを編集できるようになります。コンポーザを使用してページを編集する必要はありません。

    ページの編集またはカスタマイズには別のツールおよびプロシージャのセットが必要で、これにより、たとえばタスクフローやポートレットを追加したり、または実行時にページのドキュメント・コンテンツだけではなく、ページ自体を変更したりできるようになります。


    図7-20 コンテンツ編集が有効化されたWebブラウザ上のMyPortalApplication

    図7-20の説明が続きます
    「図7-20 コンテンツ編集が有効化されたWebブラウザ上のMyPortalApplication」の説明

  4. 図7-21に示すように、ブラウザ・ページの枠内部分の編集アイコンに移動し、アイコンをクリックして編集を有効化します。

    図7-21 ホーム・ページ・ドキュメント・コンテンツの編集を有効化するために選択された編集アイコン

    図7-21の説明が続きます
    「図7-21 ホーム・ページ・ドキュメント・コンテンツの編集を有効化するために選択された編集アイコン」の説明

  5. 図7-22に示すように、認証済ユーザーがコンテンツをcontactus.htmlページに追加し、リッチ・テキスト・エディタを使用してコンテンツを編集できる、「編集」ポップアップ・ウィンドウがページの中央に表示されます。ドキュメント・コンテンツは、アクセスおよび取得を簡単にするために、UCMコンテンツ・リポジトリに保存されます。

    図7-22 HTMLコンテンツのコンテキスト内編集を行う「編集」ウィンドウ

    図7-22の説明が続きます
    「図7-22 HTMLコンテンツのコンテキスト内編集を行う「編集」ウィンドウ」の説明

  6. ユーザーは、ウィンドウの左上角にある「保存」ボタンをクリックすることにより、編集内容を保存できます(図7-23)。

    図7-23 コンテキスト内HTMLドキュメント・コンテンツを保存する「編集」-「保存」ウィンドウ

    図7-23の説明が続きます
    「図7-23 コンテキスト内HTMLドキュメント・コンテンツを保存する「編集」-「保存」ウィンドウ」の説明

このレッスンでは、WebCenter Portal: Frameworkアプリケーションのページ階層内の特定のページをカスタマイズする方法、およびそのページを階層に追加して、ユーザー・アクセス権限を設定する方法を学習しました。また、新しいコンテンツをページに追加し、実行時に編集可能にすることにより、UCMリポジトリに保存されているドキュメント・コンテンツを実行時に簡単にHTML編集できることも学習しました。