| Oracle® Fusion Middleware Oracle WebCenter Portal: Spaces用チュートリアル 11g リリース1 (11.1.1.6.0) B55931-03 |
|
 前 |
 次 |
| Oracle® Fusion Middleware Oracle WebCenter Portal: Spaces用チュートリアル 11g リリース1 (11.1.1.6.0) B55931-03 |
|
前 |
次 |
Oracle WebCenter Portal: Spacesには、ポータルに適用できる様々なページ・テンプレートが用意されています。また、デフォルトのページ・テンプレートを拡張して、組織の企業理念およびビジネス目標を反映した新しいページ・テンプレートを作成することもできます。
この章では、管理者がこのチュートリアルの準備の際に有効化したEl Pijuページ・テンプレートを拡張します。ツリー・ナビゲーションおよびメニュー・ナビゲーションによってページ・テンプレートにEl Pijuナビゲーションを関連付け、El Pijuの企業の外観、印象およびレイアウトが表現されるようこのテンプレートにEl Pijuバナーを追加します。最後に、変更したテンプレートをEl Pijuスペースおよびそのサブスペースに適用します。
ページ・テンプレートはWebCenter Portalリソースの一種であり、ページのアーティファクトの一部について、実際のコンテンツに関係なく外観を制御します(コンテンツ自体ではなく、コンテンツに関係するものを制御します)。図5-1は、ページ・テンプレートにヘッダー、フッター、ナビゲーショナル支援機能などを構築し、実際のコンテンツを構成する方法を示しています。スペースにページ・テンプレートを適用することで、そのスペース内のすべてのページが同じルック・アンド・フィールを備えることができます。
ここでは、アプリケーション・レベルでスコープされたElPijuPgTemplate.earファイルを変更します。アプリケーション・レベルでスコープされたリソースは、Spacesインスタンス内で、認可されたすべてのユーザーが使用できます。ただし、ユーザーはリソース自体を変更できるのではなく、リソースをコピーして要件を満たすようそれを変更できます。El Pijuスペースおよびそのサブスペースでこの方法を確認します。
「El Piju - 設定」タブ設定ページの「リソース」タブでは、左側のパネルで「ページ・テンプレート」がデフォルトで選択されています。El Pijuページ・テンプレートのコピーを作成するには、次の手順を実行します。
「作成」をクリックします。
「新規ページ・テンプレートを作成します。」ダイアログが表示されます。
「名前」フィールドに、Copy of El Piju Templateと入力します。
「コピー元」ドロップダウン・リストからElPijuを選択して、「作成」をクリックします。
「リソース」タブの下に新しいテンプレートが表示されます。
「El Pijuページ・テンプレートのコピー」がハイライト表示されている状態で、「編集」メニューから「表示」を選択します。
El Pijuスペースに対してテンプレートが利用可能になりました(図5-2を参照)。
各リソースはポータルのビルディング・ブロックとして機能し、WebCenter Portalのスケーラブルで強力なテクノロジを通してビジネス・ニーズにこたえます。
ここでは、ページ・テンプレートにツリー・ナビゲーションを追加して、テンプレートにナビゲーションの表示方法または表示形式を指定します。後半では、前の手順で作成したEl Pijuナビゲーション・モデルにツリー・ナビゲーションを関連付けることで、テンプレートに表示対象を指定します。
ツリー・ナビゲーションを追加するには、次の手順を実行します。
「El Pijuページ・テンプレートのコピー」がハイライト表示されている状態で、「編集」メニューから「編集」を選択します。
WebCenter PortalのComposerでページ・テンプレートが開かれ、使用可能なリソース・カタログを通してコンテンツを追加できます。
画面は次のようになります。
左上部に、手順2: El Pijuスペースへのロゴの追加で追加したEl Pijuロゴが表示されます。ロゴの内容はユーザーが決定しましたが、ロゴの位置はページ・テンプレート・デザイナによってここに指定されました。また、ページ・テンプレート・デザイナによって、El Pijuのスローガン(「自然建築による持続可能性」)とともに、頻繁に使用されるリンクの列が上部に、数個のリンクがページ中央に追加されました。さらに、構築中のポータルに適切なコンテンツを追加できるように、デザイナによってテンプレートの一部の領域が空白のまま残されました。実際のシナリオでは、必要なコンテンツ領域が作成されるように、JDeveloperでページ・テンプレートを設計するユーザーと緊密に作業します。
左下部の領域(図5-4を参照)で、「コンテンツの追加」をクリックします。
「リソース・カタログ」が表示されます。
「テンプレート開発」の隣にある「オープン」をクリックします。
|
ヒント: 手順3および手順4をスキップして、かわりに「検索」フィールドにNavigation Treeと入力すると、「ナビゲーション・ツリー」オプションが迅速に表示されます。 |
「ナビゲーション」の隣にある「オープン」をクリックします。
「ナビゲーション・ツリー」の隣にある「追加」をクリックし、「閉じる」をクリックします。
デフォルトのツリー・ナビゲーションは図5-5のようになります。
このツリー・ナビゲーションを「ナビゲーション・モデルの設計」で作成したEl Pijuナビゲーションに関連付けるには、ツールバーのレンチ・アイコンの下にマウス・ポインタを移動し、2つ目のレンチ・アイコンをクリックします(図5-6を参照)。
ツリー・ナビゲーションにはデフォルトで、作業しているスペースのナビゲーション項目(ページ、サブスペースおよび「保存された検索」のフォルダ)が表示されます。かわりに、このツリーにEl Piju、AdviceおよびServicesのページを表示します。
「コンポーネント・プロパティ: ナビゲーション・ツリー」ダイアログで「パラメータ」タブをクリックします。
「ナビゲーション」ドロップダウン・リストからEl Pijuナビゲーションを選択します。
「適用」→「OK」の順にクリックします。
デフォルトのナビゲーション・モデルを、El Pijuポータル用に作成したナビゲーション・モデルで置き換えました。画面は図5-7のようになります。
ノードを開くと、El Pijuスペースと2つのサブスペースのそれぞれにホーム・ページが表示されます。El Pijuスペースには、手順3: 「ドキュメント」ページの有効化で有効にした「ドキュメント」システム・ページも含まれます。El Pijuポータルにさらにページを追加すると、各ページがここに表示されて簡単にアクセスできます。
右上部で、「保存」をクリックしてテンプレートの変更を保存します。
ここでは、ポータルにメニューと呼ばれる別のタイプのナビゲーション・ビジュアライゼーションを追加します。メニューには、ナビゲーショナル・リンクがタブ、メニュー、バーおよびボタンとして水平に並んで表示されます。このため、標準的な解像度のwebページでメニューの一部が表示されなかったりメニューが画面全体に広がるのを回避するために、メニューはトップレベルの比較的少ないノードを表示するのに適しています。
引き続き「El Pijuページ・テンプレートのコピー」を編集します。
上から4番目の領域に移動し(図5-8を参照)、「コンテンツの追加」をクリックします。
「リソース・カタログ」が表示されます。
「ナビゲーション・メニュー」の隣にある「追加」をクリックし、「閉じる」をクリックします。
デフォルトのメニュー・ナビゲーションは図5-9のようになります。
このメニュー・ナビゲーションを「ナビゲーション・モデルの設計」で作成したEl Pijuナビゲーションに関連付けるには、メニュー・ナビゲーションのツールバーでレンチ・アイコンの下にマウス・ポインタを移動し(図5-10を参照)、2つ目のレンチ・アイコンをクリックします。
「コンポーネント・プロパティ: ナビゲーション・メニュー」ダイアログで「パラメータ」タブをクリックします。
「ナビゲーション」ドロップダウン・リストからEl Pijuナビゲーションを選択します。
「適用」→「OK」の順にクリックします。
画面は図5-11のようになります。
1つのテンプレートに2つの異なるナビゲーショナル・モデルを使用すると、顧客はより簡単にポータルの情報にアクセスできます。
テンプレートを保存して閉じます。
ツリー・ナビゲーションおよびメニュー・ナビゲーションについて理解しました。Spacesには、ナビゲーション階層における現在の位置を確認できるよう水平または垂直の一連のリンクとしてコンテンツ項目を表示するブレッドクラム・ナビゲーションもあります。ブレッドクラム・ナビゲーションは、ポータルに (4段階以上の)深い階層が含まれる場合に、同じセッション内の以前に表示したページに戻る必要があるシナリオで推奨されます。ブレッドクラム・ナビゲーションを追加する手順は、ツリー・ナビゲーションおよびメニュー・ナビゲーションを追加する手順と同じです。
ここでは、ポータルのすべてのページでEl Pijuの企業のルック・アンド・フィールが反映されるように、ページ・テンプレートにバナー・イメージを追加します。手順4: バナー・イメージのアップロードで「ドキュメント」システム・ページにアップロードしたイメージを使用します。
「El Piju - 設定」ページで作業します。
「コンテンツ」に移動して「ドキュメント」をクリックします。
手順4: バナー・イメージのアップロードでアップロードしたgreenbanner.jpgファイルが表示されます。
greenbanner.jpgリンクを含む行を選択します。
「表示」メニューから「リンクの取得」を選択します。
[Ctrl]を押しながら[C]を押して「ダウンロードURL」パスをコピーし、次の形式で表示されるのを確認して「OK」をクリックします。
http://<host name>:<port number>/webcenter/content/conn/<content repository name>/path/doc/elpiju/greenbanner.jpg
「リソース」タブに戻ります。
「El Pijuナビゲーションのコピー」をハイライト表示し、「編集」メニューから「編集」を選択します。
テンプレートが編集モードで表示されます。
上から5番目の領域で、「コンテンツの追加」をクリックします。
「リソース・カタログ」が表示されます。
「Web開発」の隣にある「オープン」をクリックします。
「イメージ」の隣にある「追加」をクリックします。
リソース・カタログで「閉じる」をクリックします。
5番目の領域で2つ目のレンチ・アイコンをクリックします。
「コンポーネント・プロパティ: イメージ」ダイアログが表示されます。
「表示オプション」タブの「アイコン」フィールドで、デフォルトURLを、手順4でコピーしたURLに置き換えます。
「適用」→「OK」の順にクリックします。
テンプレートにバナーが適用されました(図5-15を参照)。
変更したテンプレートを保存して閉じます。
これで、変更したEl Pijuテンプレートをポータル・ページに適用する準備が整いました。
変更したテンプレートをスペースに適用するには、次の手順を実行します。
El Pijuスペースの「設定」ページで、「一般」タブをクリックします。
「表示設定」セクションで、「ページ・テンプレート」ドロップダウン・リストから「El Pijuテンプレートのコピー」を選択して(図5-16を参照)、「適用」をクリックします。
「スペースに戻る」をクリックします。
ページにテンプレートが適用されたことが確認できます。El Pijuスペースは図5-17のようになります。
テンプレートを確認し、(1時間程度では足りませんが)時間があればこのテンプレートに追加するその他のリソースをビジュアライズして、それらのリソースによってEl Pijuの顧客と組織自体の相互の観点からポータルがどのように改善されるかを確認します。
ServicesサブスペースおよびAdviceサブスペースにページ・テンプレートを適用します。
変更したテンプレートをサブスペースに適用するには、次の手順を実行します。
ツリー・ナビゲーションかメニュー・ナビゲーションのいずれかで、Admin Linksを開いてServices Adminをクリックします。
スペース用に作成したリソースは、サブスペースに対して自動的に有効になっていませんが、サブスペースでも使用できます。その方法を確認します。
「一般」タブで、「ページ・テンプレート」フィールドの隣にある下矢印をクリックし(図5-18を参照)、「式ビルダー」を選択します。
式エディタが表示されます。
「値または式の入力」ボックスに、次を入力します。
#{srmContext.resourceScope['elpiju'].resourceType['siteTemplate'].displayName['Copy of El Piju Template'].singleResult.id}
説明:
resourceScopeは、手順1: スペースの作成の手順5で作成した簡潔なURLです。ここでは、elpijuです。
displayNameは、ページ・テンプレートの名前です。この値は、手順1: El Pijuページ・テンプレートのコピーの作成の手順2で入力した値と同じ値にする必要があります。ここでは、Copy of El Piju Templateです。
「テスト」をクリックします。
値が戻されます(図5-19を参照)。
入力ミスまたは構文ミスがあった場合は、情報メッセージ以外のメッセージが表示されます。戻って、式が手順3で記述した式に完全に一致していることを確認します。
「OK」をクリックします。
「一般」タブで「適用」をクリックします。
「スペースに戻る」をクリックします。
ページにテンプレートが適用されたことが確認できます。
手順1から6を繰り返して、AdviceサブスペースにEl Pijuテンプレートのコピーを適用します。手順1では、Advice Adminリンクをクリックすることに注意してください。
図5-20は、テンプレートが適用された後のAdviceサブスペースを示しています。
El Pijuポータルの基本的なフレームワークが準備できたため、コンテンツの追加を開始できます。
管理リンクがモデレータにのみ表示されることを確認するために、ユーザーの1人をEl Pijuのメンバーにして、El Pijuにログインさせます。El Piju、ServicesおよびAdviceのナビゲーション・バーに管理リンクが表示されます。ただし、リンクをクリックすると、「アクセス権がありません。」というメッセージが表示されます。
アプリケーション・リソースであるEl Pijuページ・テンプレートに基づいて、新しいページ・テンプレートを作成しました。ツリー・ナビゲーションおよびメニュー・ナビゲーションが表示されるようEl Pijuページ・テンプレートのコピーを拡張し、El Pijuバナーを含むようこのテンプレートをカスタマイズしました。最後に、El Pijuのスペースおよびサブスペースにテンプレートを適用しました。これで、ポータルにコンテンツを追加する準備が整いました。
