11 ページでのWeb開発コンポーネントの使用
権限:
この章のタスクを実行するには、ポータル・マネージャであるか、ポータル・レベルのBasic Services: Edit Page Access, Structure, and Content
(標準権限)またはPages: Edit Pages
(アドバンスト権限)のいずれかの権限を持つポータル・メンバーであることが必要です。
権限の詳細は、「ポータルのロールと権限について」を参照してください。
Web開発コンポーネントについて
Web開発コンポーネントでは、イメージ、HTML、リンクなどの動的コンテンツに加え、言語の選択や独自のコンテンツの追加領域など、エンド・ユーザーが実行時に変更可能なコンポーネントもページに追加します。これらのコンポーネントを使用すると、企業ブランドの強化(イメージ)、ミッション・ステートメントの提供(テキスト)、関連情報へのユーザーの誘導(リンクおよびハイパーリンク)、およびユーザーがコンテンツを追加または使用する領域の提供(ボックス)が可能です。
注意:
テキストおよびイメージ・コンポーネントは、「コンテンツ管理」フォルダの下のデフォルトのリソース・カタログ内にあります。テキストまたはイメージ・コンポーネントのページ・スタイルまたはページへの追加方法の詳細は、「ページ・スタイルまたはページへのテキスト・コンポーネントの追加」および「ページ・スタイルまたはページへのイメージ・コンポーネントの追加」を参照してください。
ページへのWeb開発コンポーネントの追加
Web開発コンポーネントをページに追加するプロセスは、「ページへのコンポーネントの追加」の説明のとおり、リソース・カタログ・コンポーネントでのプロセスと同じです。
-
ページ・エディタのリソース・カタログで、「Web開発」の横にある「開く」リンクをクリックして、Web開発コンポーネントの選択内容を表示します。
-
ページを追加するコンポーネントの横にある「追加」をクリックします。
-
新しいコンポーネントのプロパティを設定します。
ヒント:
一部のコンポーネントはページ・インフラストラクチャの一部として提供されており、リソース・カタログで明確に公開されているとはかぎりません。この例では、spacer
コンポーネントが該当します。ページにこれ以上の追加はできないものの、プロパティの構成は可能です。詳細は、「レイアウト・コンポーネントの使用」を参照してください。
ボックス・コンポーネントの使用
ボックス・コンポーネントは、ページ上で他のコンポーネントの配置に使用可能なコンテンツ領域です。これと比較される移動可能ボックスとは異なり、ボックスは、アプリケーションの実行時にページ上での移動ができません。ボックス・コンポーネントは、ページに追加するタスク・フロー、ポートレットその他のコンポーネントを配置する場所となります。
ページ・エディタでは、ボックスは単に破線で構成された四角形としてレンダリングされ、ここでユーザーは「コンテンツの追加」をクリックしてリソース・カタログを開き、コンポーネントを追加できます。
言語の変更コンポーネントの使用
詳細は、「「言語の変更」タスク・フローのページへの追加」を参照してください。
HTMLマークアップ・コンポーネントの使用
この項では、HTMLマークアップ・コンポーネントの概要を示し、その関連プロパティをリストして説明します。また、ここでは、YouTubeのビデオをページに埋め込む場合の使用例を示します。
この項では、次の内容について説明します。
HTMLマークアップ・コンポーネントについて
HTMLマークアップ・コンポーネントは、HTMLの<script>
タグに埋め込まれたJavaScriptなど、RAWテキストやHTMLタグを入力するためのシンプルなエディタです。
エディタのコンポーネント・プロパティを使用してマークアップを次のように入力します。
-
適切なHTMLマークアップでJavaScriptを囲みます。HTMLは、有効なXHTMLである必要があります。
次に例を示します。
<script type="text/javascript"> document.write("Welcome to the club"); </script>
-
XHTML以外を入力する場合は、適切にカッコで囲む(つまり、CDATAで囲む)必要があります。たとえば、
<![CDATA[
non-conforming HTML
]]>
のようにします。 -
JavaScriptは、完全なURLページのリクエストによってページがレンダリングされる場合にのみ実行されます。ポータルのタブからページに移動した場合は、JavaScriptは実行されません。この制限を回避するには、JavaScriptをそのロード時に実行するようにページ・スタイルを作成します。
警告:
このコンポーネントは、適切に使用しないとページを壊す可能性があるため、慎重に使用する必要があります。エラーの解決が必要な場合は、ログアウトしてもう一度ログインし、ページ・エディタをリセットできます。
エディタのヘッダーはページ・エディタでは表示されますが、ページ・ビュー・モードでは表示されません。これにより、Welcome #{securityContext.userName}!
などの個別化されたメッセージは、コンポーネント・ヘッダーでメッセージが乱雑になることなく、ページ上に配置できます。
ヒント:
#{securityContext.userName}
などのEL式を入力する場合、出力はその式の値となります。この場合では現在のユーザー名となります。
HTMLマークアップ・コンポーネントのプロパティの設定
HTMLマークアップ・コンポーネントで「表示オプション」および「スタイル」プロパティを設定できます。
HTMLマークアップ・コンポーネントのプロパティを設定するには、次の手順を実行します。
HTMLマークアップ・コンポーネントの表示オプション
次の表は、HTMLマークアップ・コンポーネントの表示オプションをリストして説明しています。
表11-1 HTMLマークアップ・コンポーネントの表示オプション
プロパティ | 説明 |
---|---|
|
特殊文字のリテラル評価を有効または無効にするチェック・ボックス。 このプロパティを使用すると、出力が安全または非安全になります。安全は、
|
|
テキストの折返しを有効または無効にするチェック・ボックス。
|
|
HTMLマークアップ・コンポーネントのツールチップ・テキストを入力するフィールド。 コンポーネント上にマウス・ポインタを置くと、そのテキストがツールチップとして表示されます。 |
|
このコンポーネントでレンダリングするコンテンツを指定するフィールド。 テキストに加えて、このプロパティでは、JavaScript、式言語(EL)式およびHTMLを使用して、ビデオ、音楽、Googleガジェット、およびその他の種類のコンテンツをアプリケーション・ページに公開することもできます。次に例を示します。 <object width="640" height="385"> <param name="movie" value="http://www.youtube.com/v/cAYw2zcSIPw?fs=1&hl=en_US" /> <param name="allowFullScreen" value="true" /> <param name="allowscriptaccess" value="always" /> <embed src="http://www.youtube.com/v/cAYw2zcSIPw?fs=1&hl=en_US" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="640" height="385" /> </object> 変更を保存して、ページ・エディタを閉じると、HTMLマークアップ・コンポーネントには評価されたマークアップの値が表示されます。 |
関連項目:
表示オプション・プロパティでは、式言語(EL)エディタにアクセスすることもできます。このエディタを使用すると、EL値の入力およびテストができます。ELのサポートが必要な場合は、アプリケーション開発者がEL式を指定できます。Oracle WebCenter Portalの開発の「式言語式」を参照してください。
ハイパーリンク・コンポーネントの使用
この項では、ハイパーリンク・コンポーネントの概要を示し、その固有のプロパティをリストして説明します。次のサブセクションが含まれます:
ハイパーリンク・コンポーネントについて
ハイパーリンク・コンポーネントを使用してページにリンクを追加します。ハイパーリンクは、アプリケーションの内部または外部のいずれかの場所を指すことができます。
ハイパーリンク・コンポーネントは、リンク・テキストおよびリンクURLの2つの要素で構成され、両方ともコンポーネント・プロパティを使用して追加します。
ハイパーリンクは、内部および外部のリンク・ターゲットを取ることができます。内部ターゲットの場合は、相対ディレクトリ・パスを使用できます。外部ターゲット(ポータル外部のターゲット)の場合は、常に完全なURLを使用します。
注意:
注意: WebCenter Portalが外部URLを有効と判断するには、システム管理者がそのURLをvalid-link-url.xml
ファイルの有効なURLのリストに追加する必要があります。 『Oracle WebCenter Portalの管理』の有効な外部URLのリストの追加に関する項を参照してください。このファイルに外部URLがリストされていない場合は、次のエラー・メッセージが表示されます。
入力したURLが、有効なURLのリストにありません。有効なURLのリストについては、システム管理者に連絡してください。
ヒント:
ポータル・ページの相対ディレクトリ・パスを簡単に取得するには、ターゲット・ページに移動し、そのページをお気に入りに追加する一連の動作を行います。デフォルトでは、「お気に入りの追加」ダイアログに現在のページの相対URLが指定されています。この情報をそのままコピーして、ハイパーリンク・ターゲットの定義に使用します。ポータルにお気に入りを追加する処理の詳細は、『Oracle WebCenter Portalでのポータルの使用』の「お気に入りの管理」を参照してください。
ポータル・ページへのダイレクトURLを簡単に取得するには、そのページ情報設定にアクセスします。詳細は、「ページ設定の表示および変更」を参照してください。
ハイパーリンク・コンポーネントのプロパティの設定
ハイパーリンク・コンポーネントで「表示オプション」および「スタイル」プロパティを設定できます。
ハイパーリンク・コンポーネントのプロパティを設定するには、次の手順を実行します。
ハイパーリンク・コンポーネントの表示オプション
次の表は、ハイパーリンク・コンポーネントの表示オプションをリストして説明しています。
表11-2 ハイパーリンク・コンポーネントの表示オプション
プロパティ | 説明 |
---|---|
|
ハイパーリンク・テキストを指定するフィールド。 リンク・テキストとして使用する単語またはフレーズを入力します。 |
|
ハイパーリンクのターゲットURLを入力するフィールド。 リンクするページのWebアドレスを入力します。 |
|
リンク・ターゲットのオープン動作を決定するオプション。
|
Show Component |
選択して(デフォルト)、ページにコンポーネントを表示します。 選択を解除すると、コンポーネントはビューから非表示になります。 |
関連項目:
表示オプション・プロパティでは、式言語(EL)エディタにアクセスすることもできます。このエディタを使用すると、EL値の入力およびテストができます。ELのサポートが必要な場合は、アプリケーション開発者がEL式を指定できます。Oracle WebCenter Portalの開発の「式言語式」を参照してください。
リンク・コンポーネントの使用
この項では、リンク・コンポーネントに関する情報、その設定方法およびそのプロパティの構成方法について説明します。次のサブセクションが含まれます:
リンク・コンポーネントについて
ページにリンク・コンポーネントを追加するには、リソース・カタログで「Web開発」の横にある「開く」リンクをクリックして、Web開発コンポーネントの選択内容を表示します。リンク・コンポーネントの横にある「追加」をクリックします。
リンク・コンポーネントを使用して、ナビゲーション・インスタンスをページに追加します。リンク・コンポーネントのナビゲーションには、ページ、外部Webサイトおよびポータル・コンテンツへのリンクを含めることができます。リンク・ターゲットを特定するプロセスを単純化するには、参照機能を使用できます。ファイルなどのアプリケーション・オブジェクトを特定する際の支援には、拡張検索機能も使用できます。
リンク・コンポーネントにより、規定された構造のポータル・ナビゲーション外で、ナビゲーション・リンクをページに追加できます。
リンク・コンポーネントは、その配置されるページまたはテンプレートに関連付けられています。リンク・コンポーネントをページに置いていくつかのリンクを追加すると、それらのリンクはそのページに関連付けられます。つまり、リンク・コンポーネントのライフサイクルは、それが配置されるページまたはテンプレートに準じます。次に例を示します。
-
リンクを含むページをコピーすると、そのリンクもすべてコピーされ、そのページ・コピーは独自のリンク・セットを所有することになります。元のページのリンクを変更しても、ページ・コピーへの影響はありません。ページ・テンプレートのリンクについても同様です。
-
ページが削除されると、そのページに関連付けられたリンクもすべて削除されます。ページ・テンプレートのリンクについても同様です。
-
ポータル・テンプレートにリンク付きのページが含まれる場合、そのテンプレートに基づいて新しいポータルを作成すると、事実上テンプレートのクローンが作成されます。これによって、新しいポータルには独自のリンク・セットが含まれるようになり、ポータル内でこれらのリンクを変更できます。
-
ポータルをエクスポートまたはインポートすると、ポータル・ページに関連付けられているリンクもすべてエクスポートまたはインポートされます。
各リンクで指定のリンクのプロパティを構成したり、リンクを削除したりするコントロールもあります。
リンク・コンポーネントの「リンクの追加」、「リンクの編集」および「リンクの削除」アクションは、ページ・ビュー・モードでのみ使用できます。Edit Page
権限を持つユーザーは、リンクを追加、変更または削除できます。Edit Page
権限を持たないユーザーは、追加されたナビゲーション・リンクを表示できますが、これらを追加、変更または削除できません。
リンク・コンポーネントのプロパティでは、リンク・コンポーネント・インスタンスの動作とルック・アンド・フィールを制御できます。
警告:
リンク・コンポーネントのNavigation
およびStart Path
の各パラメータは事前定義されており、変更はしないでください。これらのパラメータを変更すると、ページが壊れる可能性があります。
リンク・コンポーネントを使用したナビゲーション・リンクの追加
リンク・コンポーネントを使用してポータル・ナビゲーション・リンクを追加するには、次の手順を実行します。
-
「リンクの追加」メニューをクリックして、次のリンク・タイプを選択します。
-
ページ・リンク: アプリケーション・ページをターゲットにするリンクを追加します。
-
外部リンク: アプリケーションの外部にあるサイトをターゲットにするリンクを追加します。
-
コンテンツ・リンク: コンテンツ・リポジトリのドキュメントをターゲットにするリンクを追加します。
-
ページ・リンクを追加する手順は次のとおりです。
-
「ページ・リンク」をクリックして、「新規ページ・リンク」ダイアログを開きます。
-
「名前」フィールドに、リンクの表示名を入力します。
-
「パス」の場合は、「検索」アイコンをクリックして、「ページの選択」ダイアログを開きます。
-
指定のオプションからページを選択するか、「検索」をクリックして、使用可能なページのリストでページを特定します。
ヒント:
ホーム・ポータルでは、ホーム・ポータルのビューで使用可能なページから選択できます。その他のポータルでは、現在のポータルの範囲内で使用可能なページから選択できます。
-
「選択」をクリックします。
-
「OK」をクリックします。
外部リンクを追加する手順は次のとおりです。
-
「外部リンク」を選択して、「新規外部リンク」ダイアログを開きます。
-
「名前」フィールドに、リンクの表示名を入力します。
-
「URL」フィールドに、リンク・ターゲットのURLを入力します。例:
http://www.mywebdestination.com
注意: WebCenter Portalが外部URLを有効と判断するには、システム管理者がそのURLを
valid-link-url.xml
ファイルの有効なURLのリストに追加する必要があります。 『Oracle WebCenter Portalの管理』の有効な外部URLのリストの追加に関する項を参照してください。このファイルに外部URLがリストされていない場合は、次のエラー・メッセージが表示されます。入力したURLが、有効なURLのリストにありません。有効なURLのリストについては、システム管理者に連絡してください。
-
現在のページ・テンプレートのコンテキスト内にあるリンク・ターゲット・コンテンツを表示するには、「ページ・テンプレートでのレンダリング」を選択します。
このチェック・ボックスを選択解除すると、現在のページがリンク・ターゲットにリダイレクトされます。
-
「OK」をクリックします。
コンテンツ・リンクを追加する手順は次のとおりです。
-
「コンテンツ・リンク」を選択して、「新規コンテンツ・リンク」ダイアログを開きます。
-
「名前」フィールドに、リンクの表示名を入力します。
-
「パス」の場合は、「検索」アイコンをクリックして、「ドキュメントの選択」ダイアログを開きます。
必要に応じて、リンク・ターゲットを検索します。より詳細な検索を行う場合は、「詳細設定」をクリックします。詳細は、「コンテンツ・リンクの拡張検索の構成」を参照してください
-
「選択」をクリックします。
-
「OK」をクリックし、「新規コンテンツ・リンク」ダイアログを閉じます。
コンテンツ・リンクの拡張検索の構成
リンク・コンポーネントでのリンクの構成
ページの編集権限を持つユーザーは、リンクをページに構成して、そのリンクの名前およびターゲットを変更できます。リンクの右側に「構成」アイコンが表示されている場合は、リンクの構成権限が付与されています(図11-13)。
リンクを構成する手順:
ナビゲーション・リンクの再順序付け
ページ・エディタで、またはページを表示している際に、リンク・コンポーネントでナビゲーション・リンクを再順序付けするには、次の手順を実行します。
- リンクをクリックしたままにします。
- リンクをリスト内の新しい位置にドラッグします。
- リンクを放します。
リンク・コンポーネントからのリンクの削除
権限を持つユーザーは、指定のリンクの削除コントロールにアクセスして、リンク・コンポーネントからリンクを削除できます。各リンクの右側に「削除」アイコンが表示されている場合は、リンクを削除する権限が付与されています。
リンク・コンポーネントからリンクを削除するには、次の手順を実行します。
- リンク・コンポーネントで、対象のリンクの横にある「削除」アイコンをクリックします。
- 確認ダイアログで「削除」をクリックします。
移動可能ボックス・コンポーネントの使用
この項では、移動可能ボックスの概要を示します。次のサブセクションが含まれます:
移動可能ボックス・コンポーネントについて
ページに移動可能ボックス・コンポーネントを追加するには、リソース・カタログで「Web開発」の横にある「開く」リンクをクリックして、Web開発コンポーネントの選択内容を表示します。移動可能ボックス・コンポーネントの横にある「追加」をクリックします。
移動可能ボックスは、ボックスの周りを囲むコンテナです。これにより、ページでのコンテンツの配置が可能になるだけでなく、そのコンテンツをページ・エディタ(「デザイン」ビュー)とビュー・モードの両方で一度にすべて移動できるようになります。
ページ・エディタで、またはページを表示している際に、移動可能ボックスのヘッダーをクリックして、ヘッダーとそのすべてのコンテンツをページの新しい位置にドラッグできます。また、移動可能ボックスはサイズの変更もできます。
ヒント:
ポートレットを移動可能ボックス・コンポーネントに追加しないでください。これにより、エラーを誘発する可能性のある不要な冗長性が生じます。
セパレータ・コンポーネントの使用
この項では、セパレータ・コンポーネントの概要を示し、その関連プロパティをリストして説明します。次のサブセクションが含まれます:
セパレータ・コンポーネントについて
ページにセパレータ・コンポーネントを追加するには、リソース・カタログで「Web開発」の横にある「開く」リンクをクリックして、Web開発コンポーネントの選択内容を表示します。セパレータ・コンポーネントの横にある「追加」をクリックします。
セパレータ・コンポーネントは、水平線の形式でページ上に視覚的な分割を示します。
Webページ・コンポーネントの使用
この項では、Webページ・コンポーネントの概要を示し、その関連プロパティをリストして説明します。次のサブセクションが含まれます:
Webページ・コンポーネントについて
ページにWebページ・コンポーネントを追加するには、リソース・カタログで「Web開発」の横にある「開く」リンクをクリックして、Web開発コンポーネントの選択内容を表示します。Webページ・コンポーネントの横にある「追加」をクリックします。
Webページ・コンポーネントにより、ポータル・ページのコンテキスト内に別のWebページを表示することができます。
Webページ・コンポーネントを使用して公開されるコンテンツには、公開されたWebページに関連付けられたすべてのコントロールが保持されています。たとえば、コンポーネントにより、ユーザーは公開したコンテンツの種類に応じて、ビデオのボリュームの制御、wikiの編集、ブログへのエントリの投稿などが可能になります。
Webページには、内部および外部のリンク・ターゲットを使用できます。内部ターゲットの場合は、相対ディレクトリ・パスを使用できます。
ヒント:
ポータルで、アプリケーション・ページの相対ディレクトリ・パスを簡単に取得するには、ターゲット・ページに移動し、そのページをお気に入りに追加する一連の動作を行います。デフォルトでは、「お気に入りの追加」ダイアログに現在のページの相対URLが指定されています。この情報をそのままコピーして、Webページのターゲットの定義に使用します。
詳細は、『Oracle WebCenter Portalでのポータルの使用』の「お気に入りの管理」を参照してください。
Webページ・コンポーネントにより、組込みの「Webページ」ページ・スタイル(詳細は表19-1を参照)にバリエーションを加えることができます。「Webページ」ページ・スタイルは、完全な外部Webページのエクスペリエンスを提供するのに役立ちます。一方、Webページ・コンポーネントは、Webページ・コンテンツを他のコンテンツ・タイプとともにページに含める場合に役立ちます。
Webページ・コンポーネントのプロパティの設定
Webページ・コンポーネントで「表示オプション」および「スタイル」プロパティを設定できます。
Webページ・コンポーネントのプロパティを設定するには、次の手順を実行します。
Webページ・コンポーネントの表示オプション
次の表は、Webページ・コンポーネントの表示オプションをリストして説明しています。
表11-3 Webページ・コンポーネントの表示オプション
プロパティ | 説明 |
---|---|
|
Webページ・コンポーネントの表示名。 |
|
Webページ領域の Webページ・コンポーネントでは、マウス・ポインタをコンポーネントの境界線上に置いた場合にのみ padding-top:30px; |
|
Webページ領域にレンダリングするソースWebコンテンツの完全修飾URLを入力するフィールド。 次に例を示します。 http://www.oracle.com
注意: 表示領域の幅および高さを調整するには、コンポーネントの「スタイル」プロパティを使用します(詳細は、「スタイル・プロパティおよびコンテンツ・スタイル・プロパティの使用」を参照)。 別のポータル・ページのコンテンツを表示する場合は、相対アドレスを使用できます。詳細は、「Webページ・コンポーネントについて」を参照してください |
関連項目:
表示オプション・プロパティでは、式言語(EL)エディタにアクセスすることもできます。このエディタを使用すると、EL値の入力およびテストができます。ELのサポートが必要な場合は、アプリケーション開発者がEL式を指定できます。Oracle WebCenter Portalの開発の「式言語式」を参照してください。