プライマリ・コンテンツに移動
Oracle® Fusion Middleware Oracle WebCenter Portalでのポータルの構築
11gリリース1 (11.1.1.9.0)
E50013-05
  ドキュメント・ライブラリへ移動
ライブラリ
製品リストへ移動
製品
目次へ移動
目次

前
 
次
 

15 ページでのWeb開発コンポーネントの使用

この章では、デフォルトのリソース・カタログにおける「Web開発」セクションでのコンポーネントの追加方法および使用方法について説明します。

WebCenterポータルの様々なタイプのページに関する概念情報については、第1.3.7項「ページとは」を参照してください。

この章の内容は、次のとおりです。


権限:

この章のタスクを実行するには、ポータルレベルの権限Basic Services: Edit Page Access, Structure, and Content (標準権限)またはPages: Edit Pages (アドバンスト権限)が必要です。ポータル・モデレータは、デフォルトでこの権限を持っています。

権限の詳細は、第29.1項「ポータルのロールと権限について」を参照してください。


15.1 Web開発コンポーネントについて

Web開発コンポーネントでは、イメージ、HTML、リンクなどの動的コンテンツに加え、言語の選択や独自のコンテンツの追加領域など、エンド・ユーザーが実行時に変更可能なコンポーネントもページに追加します。これらのコンポーネントを使用すると、企業ブランドの強化(イメージ)、ミッション・ステートメントの提供(テキスト)、関連情報へのユーザーの誘導(リンクおよびハイパーリンク)、およびユーザーがコンテンツを追加または使用する領域の提供(ボックス)が可能です。

15.2 ページへのWeb開発コンポーネントの追加

Web開発コンポーネントをページに追加するプロセスは、第14.2項「ページへのコンポーネントの追加」の説明のとおり、リソース・カタログ・コンポーネントでのプロセスと同じです。

Webデプロイメント・コンポーネントをページに追加する手順:

  1. ページ・エディタ(コンポーザ)のリソース・カタログで、「Web開発」の横にある「開く」リンクをクリックして、Web開発コンポーネントの選択内容を表示します(図15-1)。

  2. ページを追加するコンポーネントの横にある「追加」をクリックします。

  3. 新しいコンポーネントのプロパティを設定します。

図15-1 リソース・カタログのWeb開発コンポーネント

図15-1の説明が続きます
「図15-1 リソース・カタログのWeb開発コンポーネント」の説明


ヒント:

一部のコンポーネントはページ・インフラストラクチャの一部として提供されており、リソース・カタログで明確に公開されているとはかぎりません。この例では、spacerコンポーネントが該当します。ページにこれ以上の追加はできないものの、プロパティの構成は可能です。詳細は、第16章「ページでのレイアウト・コンポーネントの使用」を参照してください。

15.3 ボックス・コンポーネントの使用

この項では、ボックス・コンポーネントの概要を示し、その関連プロパティをリストして説明します。次のサブセクションが含まれます:

15.3.1 ボックス・コンポーネントについて

ページにボックス・コンポーネントを追加するには、第15.2項「ページへのWeb開発コンポーネントの追加」を参照してください。

ボックスは、ページ上で他のコンポーネントの配置に使用可能なコンテンツ領域です。これに対応する移動可能ボックス(第15.9.1項「移動可能ボックス・コンポーネントについて」を参照)とは異なり、ボックスは、アプリケーションの実行時にページ上での移動ができません(そのコンテンツの再配置は可能です)。ボックス・コンポーネントは、ページに追加するタスク・フロー、ポートレットその他のコンポーネントを配置する場所となります。

このコンポーネントの共通アクティビティにより、「スタイル」タブの「コンポーネント・プロパティ」ダイアログで実行する背景色の設定およびパディングの変更が行われます。第14.3.6項「スタイル・プロパティおよびコンテンツ・スタイル・プロパティの使用」を参照してください。

コンポーザでは、ボックスは通常、点線から成る長方形としてレンダリングされ、「ボックスを追加」「編集」および「削除」の各アイコンが含まれます(図15-2)。

図15-2 移動可能ボックス・コンポーネントの上のボックス・コンポーネント

図15-2の説明が続きます
「図15-2 移動可能ボックス・コンポーネントの上のボックス・コンポーネント」の説明

常時、すべてのボックス・コントロールが表示されるわけではありません。表示内容は、権限や、ボックスが最上位ボックス(削除ができないため、「削除」アイコンは表示されません)であるかどうか、ボックスがストレッチされているかどうか(ストレッチしている場合は、他のボックスを追加できないため、追加用のコントロールは表示されません)およびボックス・プロパティが特定のコントロールを表示するかどうかによって異なります(詳細は、表15-1「ボックス・コンポーネントの表示オプション」を参照してください)。

ボックス内にはコンテンツを配置でき、1つ以上のボックスをボックス内に配置できます(ただし、ボックスが、そのコンテンツをストレッチするように構成(ボックス・プロパティのLayoutstretch)されていない場合)。コンテンツを水平方向または垂直方向に表示するか、ストレッチして表示するようにボックス・プロパティを構成できます。スクロールバーを表示するように指定するか、またはそのすべての領域を単一コンポーネントが使用するようにボックスを設定する(ストレッチ)ことができます。ボックス・コントロールを使用すると、指定のボックスの上、下またはいずれかのサイドにボックスを追加したり、ボックス内にタブまたはタブ・セットを追加できます。


関連項目:

タブ・セットの追加およびタブの構成の詳細は、第12.4.6項「タブを使用した階層化されたコンテンツ・リージョンの作成」を参照してください。

必要に応じて、リソース・カタログから複数のボックスを追加するのではなく、1つのボックスをページに追加し、そのコントロールを使用して必要なすべてのボックスおよびタブを追加することもできます(第15.2項「ページへのWeb開発コンポーネントの追加」を参照してください)。

15.3.2 ボックス・コンポーネントのプロパティの設定

ボックス・コンポーネントのプロパティにより、ボックス・コンテンツの位置合せおよび方向の指定、ボックス・コンポーネントの再配置、およびボックスでのツールチップ・テキストの指定ができます。

ボックス・コンポーネントのプロパティには、ボックス・コンテンツの非表示、表示および再配置用のオプションが付いた「子コンポーネント」タブがあります。詳細は、第14.3.5項「子コンポーネントの使用」を参照してください。

「スタイル」タブは、コンポーネント・インスタンスのスタイルの設定に使用できます。ここで設定するスタイルは、コンポーネントの外観を制御する他のスタイル(主にアプリケーション・スキンにより提供されるスタイル)をオーバーライドします。ボックス・スタイルのプロパティは、他の多くのコンポーネントに共通しています。共通のスタイル・プロパティは、第14.3.6項「スタイル・プロパティおよびコンテンツ・スタイル・プロパティの使用」にリストされ、説明が示されています。

表15-1は、ボックス・コンポーネントの表示オプション(図15-3)をリストして説明しています。

図15-3 ボックス・コンポーネントのプロパティ

図15-3の説明が続きます
「図15-3 ボックス・コンポーネントのプロパティ」の説明

表15-1 ボックス・コンポーネントの表示オプション

プロパティ 説明

Horizontal Alignment

ボックス・コンテンツをその左と右の境界線間でどのように位置合せするかを指定します。

  • start: コンテンツを先頭位置でそろえます。これは、選択した言語の読取り順序で決定されます。この値は、双方向言語をサポートする環境に対応するために提供されています。

  • center: コンテンツをボックスの中央にそろえます。

  • end: コンテンツを終了位置でそろえます。これは、選択した言語の読取り順序で決定されます。この値は、双方向言語をサポートする環境に対応するために提供されています。

  • left: コンテンツをボックスの左側でそろえます。

  • right: コンテンツをボックスの右側でそろえます。

Layout

ボックス・コンテンツの向きを指定します。

  • vertical: ボックス・コンテンツを縦方向に(つまり、オブジェクトの列として)そろえます。

  • horizontal: ボックス・コンテンツを横方向に(つまり、オブジェクトの行として)そろえます。Layouthorizontalに設定する場合は、子コンポーネントをストレッチする親コンポーネントにより、このコンポーネントをストレッチすることはできません。

  • scroll: ボックス・コンテンツを垂直スクロールバーを使用して垂直方向にそろえます。コンテンツの高さがボックスの高さを超えると、スクロールバーがレンダリングされます。

  • stretch: 指定したボックスのサイズに合せてボックス・コンテンツをストレッチします。ボックスにheight(第14.3.6項「スタイル・プロパティおよびコンテンツ・スタイル・プロパティの使用」を参照)が指定されていない場合は、ボックスが別のストレッチ・コンポーネント内に配置されていないかぎり、高さはデフォルトの200ピクセルに設定されます。この場合、ボックスの高さはその親によって制御されます(ただし、horizontalを参照)。stretchを選択した場合、コンテンツをボックス内にドラッグ・アンド・ドロップすることはできません。また、Layout値をstretchに設定してボックスを分割することはできません。

  • auto: 親コンポーネントによりボックスがストレッチされた場合にのみ、子コンポーネントがストレッチされます。それ以外の場合は、コンテンツがスクロール表示されます。

Short Desc

ボックスのツールチップ・テキストを指定します。

ボックス上にマウス・ポインタを移動すると、ツールチップ・テキストが表示されます。

Show Component

次のように、ページ上でのコンポーネントの非表示と表示を切り替えます。

  • 選択すると、コンポーネントが表示されます。

  • 選択解除すると、コンポーネントは非表示になります。

この方法でコンポーネントを非表示にすると、子コンポーネントもすべて非表示になります。コンポーネントは、コンポーザの「構造」ビューを使用して再び表示できます(第12.4.1.3項「コンポーザの「構造」ビューについて」を参照してください)。「構造」ビューで、非表示のコンポーネントを右クリックし、表示されるコンテキスト・メニューから「コンポーネントの表示」を選択します。

Vertical Alignment

ボックス・コンテンツをその上と下の境界線間でどのように位置合せするかを指定します。

  • top: コンテンツをボックスの上部にそろえます。

  • middle: コンテンツをボックスの中央にそろえます。

  • bottom: コンテンツをボックスの下部にそろえます。

  • baseline: 一番下よりわずかに上にあるボックスのベースラインにコンテンツをそろえます。

Vertical Alignmentは、レイアウトが水平の場合にのみ適用されます。



関連項目:

表示オプション・プロパティでは、式言語(EL)エディタにアクセスすることもできます。このエディタを使用すると、EL値の入力およびテストができます。EL式に関してサポートが必要な場合、アプリケーション開発者がEL式を提供できます。詳細は、Oracle WebCenter PortalおよびOracle JDeveloperでのポータルの開発の式言語式に関する付録を参照してください。

15.4 言語の変更コンポーネントの使用

第61.3.1項「言語の変更タスク・フロー」のページへの追加」を参照してください。

15.5 HTMLマークアップ・コンポーネントの使用

この項では、HTMLマークアップ・コンポーネントの概要を示し、その関連プロパティをリストして説明します。また、ここでは、YouTubeのビデオをページに埋め込む場合の使用例を示します。

この項の内容は、次のとおりです。

15.5.1 HTMLマークアップ・コンポーネントについて

ページにHTMLマークアップ・コンポーネントを追加するには、第15.2項「ページへのWeb開発コンポーネントの追加」を参照してください。

HTMLマークアップ・コンポーネントは、HTMLの<script>タグに埋め込まれたJavaScriptなど、RAWテキストやHTMLタグを入力するためのシンプルなエディタです(図15-4)。

図15-4 HTMLマークアップ・コンポーネント

図15-4の説明が続きます
「図15-4 HTMLマークアップ・コンポーネント」の説明

エディタのコンポーネント・プロパティを使用してマークアップを次のように入力します。

  • 適切なHTMLマークアップでJavaScriptを囲みます。HTMLは、有効なXHTMLである必要があります。

    たとえば、次のようになります(図15-5)。

    <script type="text/javascript">
       document.write("Welcome to the club");
    </script>
    
  • XHTML以外を入力する場合は、適切にカッコで囲む(つまり、CDATAで囲む)必要があります。たとえば、<![CDATA[non-conforming HTML]]>のようにします。

  • JavaScriptは、完全なURLページのリクエストによってページがレンダリングされる場合にのみ実行されます。ポータルのタブからページに移動した場合は、JavaScriptは実行されません。この制限を回避するには、JavaScriptをそのロード時に実行するようにページ・スタイルを作成します。


警告:

このコンポーネントは、適切に使用しないとページを壊す可能性があるため、慎重に使用する必要があります。エラーを解決する必要がある場合は、「構造」ビューでコンポーネントを削除するか(第12.4.1.3項「コンポーザの「構造」ビューについて」を参照)、ログアウトして、再度ログインすることでコンポーザをリセットできます。


図15-5 HTMLマークアップの表示オプションにおけるJavaScriptの例

図15-5の説明が続きます
「図15-5 HTMLマークアップの表示オプションにおけるJavaScriptの例」の説明

エディタのヘッダーはコンポーザでは表示されますが、ページ・ビュー・モードでは表示されません。これにより、Welcome #{securityContext.userName}!などの個別化されたメッセージは、コンポーネント・ヘッダーでメッセージが乱雑になることなく、ページ上に配置できます。


ヒント:

#{securityContext.userName}などのEL式を入力する場合、出力はその式の値となります。この場合では現在のユーザー名となります。

15.5.2 HTMLマークアップ・コンポーネントのプロパティの設定

HTMLマークアップ・コンポーネントのプロパティを使用すると、簡単なHTMLマークアップ、JavaScript、テキストまたは式言語(EL)を入力できます。

コンテンツ・エントリに加え、「コンポーネント・プロパティ」ダイアログの「表示オプション」タブのプロパティ(図15-2)を使用することにより、テキスト・エントリの動作を制御し、ツールチップ・テキストを(Short Descプロパティで)指定します。

HTMLマークアップ・コンポーネントのプロパティには、コンポーネント・インスタンスでスタイルを設定するオプションの付いた「スタイル」タブが含まれています。ここで設定するスタイルは、コンポーネントの外観を制御する他のスタイルをオーバーライドします。これには、コンポーネントの親コンテナ、現在のページおよびアプリケーションで設定されているスタイルが含まれます。HTMLマークアップのスタイル・プロパティは、他の多くのコンポーネントに共通しており、第14.3.6項「スタイル・プロパティおよびコンテンツ・スタイル・プロパティの使用」にリストされ、説明が示されています。

表15-2は、HTMLマークアップ・コンポーネントの表示オプション(図15-5)をリストして説明しています。

表15-2 HTMLマークアップ・コンポーネントの表示オプション

プロパティ 説明

Escape

特殊文字のリテラル評価を有効または無効にするチェック・ボックス。

このプロパティを使用すると、出力が安全または非安全になります。安全は、<script>などの任意のタグが&lt;script&gt;にエスケープされるため、実行されないことを意味します。非安全は、valueに入力した値は、それが必要のない値でもすべてページに入力されることを意味します。

  • 選択した場合(true)、山カッコ(<|>)やHTML特殊文字などの文字のリテラル評価が有効化されます。たとえば、ユーザーが&#8212;と入力すると、&#8212;とレンダリングされます。

  • 選択解除した場合(false)、特殊文字のリテラル解釈が無効になります。たとえば、ユーザーが&#8212;と入力すると、—とレンダリングされます。falseがデフォルト値です。

No Wrap

テキストの折返しを有効または無効にするチェック・ボックス。

  • 選択した場合(true)、テキストの折返しが無効になります。ユーザーは、手動で改行を入力する必要があります。

  • 選択解除した場合(false)、テキストの折返しが有効になります。コンポーネントの幅に応じて行が折り返されます。falseがデフォルト値です。

Short Desc

HTMLマークアップ・コンポーネントのツールチップ・テキストを入力するフィールド。

コンポーネント上にマウス・ポインタを置くと、そのテキストがツールチップとして表示されます。

Show Component

ページ上のコンポーネントを表示または非表示にするオプション。

  • 選択すると、コンポーネントが表示されます。

  • 選択解除すると、コンポーネントは非表示になります。

この方法でコンポーネントを非表示にすると、子コンポーネントもすべて非表示になります。コンポーネントは、コンポーザの「構造」ビューに再び表示できます(第12.4.1.3項「コンポーザの「構造」ビューについて」を参照してください)。「構造」ビューで、非表示のコンポーネントを右クリックし、表示されるコンテキスト・メニューから「コンポーネントの表示」を選択します。

Value

このコンポーネントでレンダリングするコンテンツを指定するフィールド。

テキストに加えて、このプロパティでは、JavaScript、式言語(EL)式およびHTMLを使用して、ビデオ、音楽、Googleガジェット、およびその他の種類のコンテンツをアプリケーション・ページに公開することもできます。例:

<object width="640" height="385">
  <param name="movie"
      value="http://www.youtube.com/v/cAYw2zcSIPw?fs=1&amp;hl=en_US" />
  <param name="allowFullScreen" value="true" />
  <param name="allowscriptaccess" value="always" />
  <embed src="http://www.youtube.com/v/cAYw2zcSIPw?fs=1&amp;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およびOracle JDeveloperでのポータルの開発の式言語式に関する付録を参照してください。

15.6 ハイパーリンク・コンポーネントの使用

この項では、ハイパーリンク・コンポーネントの概要を示し、その固有のプロパティをリストして説明します。次のサブセクションが含まれます:

15.6.1 ハイパーリンク・コンポーネントについて

ページにハイパーリンク・コンポーネントを追加するには、第15.2項「ページへのWeb開発コンポーネントの追加」を参照してください。

ハイパーリンク・コンポーネントを使用してページにリンクを追加します。ハイパーリンクは、アプリケーションの内部または外部のいずれかの場所を指すことができます。

ハイパーリンク・コンポーネント(図15-6)は、リンク・テキストおよびリンクURLの2つの要素で構成され、両方ともコンポーネント・プロパティを使用して追加します。

図15-6 ハイパーリンク・コンポーネント

図15-6の説明が続きます
「図15-6 ハイパーリンク・コンポーネント」の説明

ハイパーリンクは、内部および外部のリンク・ターゲットを取ることができます。内部ターゲットの場合は、相対ディレクトリ・パスを使用できます。外部ターゲット(ポータルの外部のターゲット)の場合は、常に完全なURLを使用します。


ヒント:

ポータル・ページの相対ディレクトリ・パスを簡単に取得するには、ターゲット・ページに移動し、そのページをお気に入りに追加する一連の動作を行います。デフォルトでは、「お気に入りの追加」ダイアログに現在のページの相対URLが指定されています。この情報をそのままコピーして、ハイパーリンク・ターゲットの定義に使用します。ポータルにお気に入りを追加する処理の詳細は、Oracle WebCenter Portalの使用の「お気に入りの管理」を参照してください。

ポータル・ページへのダイレクトURLを簡単に取得するには、そのページの「ページ情報」ダイアログにアクセスします。詳細は、第13.6項「ページに関する情報の表示」を参照してください。


ハイパーリンク・コンポーネントのプロパティには、コンポーネント・インスタンスでスタイルを設定するオプションの付いた「スタイル」タブが含まれています。ここで設定するスタイルは、コンポーネントの外観を制御する他のスタイルをオーバーライドします。これには、コンポーネントの親コンテナ、現在のページおよびアプリケーションで設定されているスタイルが含まれます。ハイパーリンク・スタイルのプロパティは、他の多くのコンポーネントに共通しています。共通のスタイル・プロパティは、第14.3.6項「スタイル・プロパティおよびコンテンツ・スタイル・プロパティの使用」にリストされ、説明が示されています。

15.6.2 ハイパーリンク・コンポーネントのプロパティの設定

ハイパーリンク・コンポーネントのプロパティでは、リンク・テキスト、ターゲットの宛先およびオープン動作を指定できます。

表15-3は、ハイパーリンク・コンポーネントの表示オプション(図15-7)をリストして説明しています。

図15-7 ハイパーリンク・コンポーネントのプロパティ

図15-7の説明が続きます
「図15-7 ハイパーリンク・コンポーネントのプロパティ」の説明

表15-3 ハイパーリンク・コンポーネントの表示オプション

プロパティ 説明

Destination

ハイパーリンクのターゲットURLを入力するフィールド。

リンクするページのWebアドレスを入力します。

新規ウィンドウで開く

リンク・ターゲットのオープン動作を決定するオプション。

  • 選択すると、リンク・ターゲットを新しいブラウザ・タブまたはウィンドウで開きます。

  • 選択解除すると、リンク・ターゲットを現在のブラウザ・タブまたはウィンドウで開きます。

Show Component

ページ上のコンポーネントを表示または非表示にするオプション:

  • 選択すると、コンポーネントが表示されます。

  • 選択解除すると、コンポーネントは非表示になります。

この方法でコンポーネントを非表示にすると、子コンポーネントもすべて非表示になります。コンポーネントは、コンポーザの「構造」ビューに再び表示できます(第12.4.1.3項「コンポーザの「構造」ビューについて」を参照してください)。「構造」ビューで、非表示のコンポーネントを右クリックし、表示されるコンテキスト・メニューから「コンポーネントの表示」を選択します。

Title

ハイパーリンク・テキストを指定するフィールド。

リンク・テキストとして使用する単語またはフレーズを入力します。



関連項目:

表示オプション・プロパティでは、式言語(EL)エディタにアクセスすることもできます。このエディタを使用すると、EL値の入力およびテストができます。EL式に関してサポートが必要な場合、アプリケーション開発者がEL式を提供できます。詳細は、Oracle WebCenter PortalおよびOracle JDeveloperでのポータルの開発の式言語式に関する付録を参照してください。

15.7 イメージ・コンポーネントの使用

次のいずれかの方法を使用して、ポータルにイメージを追加できます。

  • イメージ・コンポーネント。クリックしたときに別の場所にリンクするようオプションで設定できます。イメージ・コンポーネントを検索で返すことはできません。この項では、イメージ・コンポーネントについて説明します。

  • イメージ・ファイル。接続されているコンテンツ・リポジトリから選択して、スタンドアロン・ページまたは「コンテンツ・プレゼンタ」タスク・フローに表示します。イメージ・ファイルは、検索で返すことができます。イメージ・ファイルをページに追加するには、第34.3項「選択したフォルダまたはファイルのページへの追加」を参照してください。

  • イメージは、イメージの埋込みツールまたはリッチ・テキスト・エディタを使用してWikiドキュメントまたはWikiページに追加されます。イメージをWikiに追加するには、『Oracle Fusion Middleware Oracle WebCenter Portalの使用』のリッチ・テキスト・エディタのツールバーについてに関する項を参照してください。

この項では、イメージ・コンポーネントの概要を示し、その関連プロパティをリストして説明します。この項の内容は、次のとおりです。


関連項目:

ドキュメント・サービスのイメージの使用方法の詳細は、第34.2項「ドキュメント・コンポーネントについて」を参照してください。

15.7.1 イメージ・コンポーネントについて

ページにイメージ・コンポーネントを追加するには、第15.2項「ページへのWeb開発コンポーネントの追加」を参照してください。

イメージ・コンポーネントを使用して、ピクチャ、ロゴ、別の場所にリンクされたイメージ(Webサイトやポータル・ページなど)などのグラフィック・アイテムを追加します(図15-8)。

図15-8 イメージ・コンポーネント(デフォルトのアイコンを表示)

図15-8の説明が続きます
「図15-8 イメージ・コンポーネント(デフォルトのアイコンを表示)」の説明

接続されているコンテンツ・リポジトリやURLなど、任意のアクセス可能な場所にあるWeb互換イメージを使用します。認証を必要とする外部サーバーのイメージは使用しないでください。


ヒント:

リンクされておらず、検索で返されるイメージを表示する場合は、イメージ・ファイルの使用を検討してください(第34.3項「選択したフォルダまたはファイルのページへの追加」を参照してください)。

15.7.2 イメージ・コンポーネントのプロパティの設定

イメージ・コンポーネントのプロパティでは、イメージ・ファイルの場所、オプションのハイパーリンク・ターゲット、ALTテキストおよびハイパーリンクのターゲット・フレームを指定できます。

イメージ・コンポーネントのプロパティには、コンポーネント・インスタンスでスタイルを設定するオプションの付いた「スタイル」タブが含まれています。ここで設定するスタイルは、コンポーネントの外観を制御する他のスタイルをオーバーライドします。これには、コンポーネントの親コンテナ、現在のページおよびアプリケーションで設定されているスタイルが含まれます。イメージ・スタイルのプロパティは、他の多くのコンポーネントに共通しています。共通のスタイル・プロパティは、第14.3.6項「スタイル・プロパティおよびコンテンツ・スタイル・プロパティの使用」にリストされ、説明が示されています。

表15-4は、イメージ・コンポーネントの表示オプション(図15-9)をリストして説明しています。

図15-9 イメージ・コンポーネントのプロパティ

図15-9の説明が続きます
「図15-9 イメージ・コンポーネントのプロパティ」の説明

表15-4 イメージ・コンポーネントの表示オプション

プロパティ 説明

Destination

イメージのリンク・ターゲットの宛先のURL

リンク・ターゲットには、アプリケーションの内部または外部のいずれかのURLを指定できます。内部ターゲット(ポータル・ページ)の場合は、アプリケーション・ルート・ディレクトリとの相対ディレクトリ・パスを使用できます。

実行時の動作は、この値が内部または外部のどちらのURLに設定されているかによって異なります。

  • 内部URL(たとえば、http://host:port/webcenter/spaces/page/myPage)の場合は、イメージをクリックすると、ターゲット・ページを表示する新規ウィンドウが開きます。イメージを再びクリックすると、クリックのたびに新規ウィンドウが開きます。

  • 外部URL(たとえば、http://www.google.com)の場合は、イメージをクリックすると、ターゲット・サイトを表示する新規ウィンドウが開きます。イメージを再びクリックすると、クリックのたびに同じウィンドウがリフレッシュされます。

Icon

アクティブで、クリックされていない状態のイメージを表すイメージ・ファイルへのURL。

任意の内部の場所またはパブリックにアクセス可能な場所から、任意のWeb互換イメージを使用します。

Short Desc

ALTテキストのイメージ。

ALTテキストは、マウス・ポインタをイメージ上に置いた際にツールチップとして表示されます。

Show Component

ページ上のコンポーネントを表示または非表示にするオプション:

  • 選択すると、コンポーネントが表示されます。

  • 選択解除すると、コンポーネントは非表示になります。

この方法でコンポーネントを非表示にすると、子コンポーネントもすべて非表示になります。コンポーネントは、コンポーザの「構造」ビューに再び表示できます(第12.4.1.3項「コンポーザの「構造」ビューについて」を参照してください)。「構造」ビューで、非表示のコンポーネントを右クリックし、表示されるコンテキスト・メニューから「コンポーネントの表示」を選択します。

Target Frame

リンク・ターゲットのオープン動作。

次のような標準のブラウザ・ターゲットを入力します。

  • _top: (現在のフレームではなく)現在のブラウザ・ウィンドウにリンク・ターゲットをロードします。

  • _parent: 現在のフレームの親フレームにリンク・ターゲットをロードします。

  • _self: リンクを含むフレームと同じフレーム内にリンク・ターゲットをロードします。

  • _blank: 元のページまたはウィンドウを閉じることなく、新しいブラウザ・タブまたはブラウザ・ウィンドウにリンク・ターゲットをロードします。

Text

イメージに付随するオプションのテキスト・ラベル。

Icon Position値により、ここで指定したテキストの前にイメージを配置するか、後に配置するかを決定します。



関連項目:

表示オプション・プロパティでは、式言語(EL)エディタにアクセスすることもできます。このエディタを使用すると、EL値の入力およびテストができます。EL式に関してサポートが必要な場合、アプリケーション開発者がEL式を提供できます。詳細は、Oracle WebCenter PortalおよびOracle JDeveloperでのポータルの開発の式言語式に関する付録を参照してください。

15.8 リンク・コンポーネントの使用

この項では、リンク・コンポーネントに関する情報、その設定方法およびそのプロパティの構成方法について説明します。次のサブセクションが含まれます:

15.8.1 リンク・コンポーネントについて

ページにリンク・コンポーネントを追加するには、第15.2項「ページへのWeb開発コンポーネントの追加」を参照してください。

リンク・コンポーネントを使用して、ナビゲーション・インスタンスをページに追加します。リンク・コンポーネントのナビゲーションには、ページ、外部Webサイトおよびアプリケーション・コンテンツへのリンクを含めることができます。リンク・ターゲットを特定するプロセスを単純化するには、参照機能を使用できます。ファイルなどのアプリケーション・オブジェクトを特定する際の支援には、拡張検索機能も使用できます。

リンク・コンポーネントにより、ナビゲーションの単一インスタンスをアプリケーション・ページに追加できます。ただし、よりフォーマルな構造のポータル・ナビゲーションの場合はこの対象外となります(図15-10)。

図15-10 リンク・コンポーネント

図15-10の説明が続きます
「図15-10 リンク・コンポーネント」の説明

リンク・コンポーネントは、その配置されるページまたはテンプレートに関連付けられています。リンク・コンポーネントをページに置いていくつかのリンクを追加すると、それらのリンクはそのページに関連付けられます。つまり、リンク・コンポーネントのライフサイクルは、それが配置されるページまたはテンプレートに準じます。例:

  • リンクを含むページをコピーすると、そのリンクもすべてコピーされ、そのページ・コピーは独自のリンク・セットを所有することになります。元のページのリンクを変更しても、ページ・コピーへの影響はありません。ページ・テンプレートのリンクについても同様です。

  • ページが削除されると、そのページに関連付けられたリンクもすべて削除されます。ページ・テンプレートのリンクについても同様です。

  • ポータル・テンプレートにリンク付きのページが含まれる場合、そのテンプレートに基づいて新しいポータルを効果的に作成すると、テンプレートのクローンが作成されます。これによって、新しいポータルには独自のリンク・セットが含まれるようになり、ポータル内でこれらのリンクを変更できます。

  • ポータルをエクスポートまたはインポートすると、ポータル・ページに関連付けられているリンクもすべてエクスポートまたはインポートされます。

リンク・コンポーネントの「リンクの追加」「リンクの編集」および「リンクの削除」の各アクションは、ページのEdit Page権限を持つユーザーによってページ・ビュー・モードおよびページ編集モード(コンポーザ)の両方で使用できます。Edit Page権限がないユーザーには、追加されたナビゲーション・リンクのみが表示されます。編集モードおよびビュー・モードでの変更は、ページの表示が可能なすべてのユーザーに表示されます。つまり、リンクの追加はユーザー・カスタマイズの制約から外れ、ページ・ビュー・モードで行われた変更は、変更を行ったユーザーにのみ表示されます。

コントロールは、リンク・ターゲットを現在のページ・テンプレートのコンテキスト内に開くのか、または起動されたページのかわりに開くのかを指定する場合に使用できます。各リンクで指定のリンクのプロパティを構成したり、リンクを削除したりするコントロールもあります(図15-11)。

図15-11 個々のリンクのコントロール

図15-11の説明が続きます
「図15-11 個々のリンクのコントロール」の説明

リンク・コンポーネントのプロパティでは、リンク・コンポーネント・インスタンスの動作とルック・アンド・フィールを制御できます。詳細は、第15.8.7項「リンク・コンポーネントのプロパティの設定」を参照してください。


警告:

リンク・コンポーネントのNavigationおよびStart Pathの各パラメータは事前定義されており、変更はしないでください。これらのパラメータを変更すると、ページが壊れる可能性があります。


15.8.2 リンク・コンポーネントを使用したナビゲーション・リンクの追加

リンク・コンポーネントを使用してポータル・ナビゲーション・リンクを追加する手順:

  1. 「リンクの追加」メニュー(図15-11)をクリックして次のリンク・タイプを選択します。

    • ページ・リンク: アプリケーション・ページをターゲットにするリンクを追加します。

    • 外部リンク: アプリケーションの外部にあるサイトをターゲットにするリンクを追加します。

    • コンテンツ・リンク: コンテンツ・リポジトリのドキュメントをターゲットにするリンクを追加します。

    ページ・リンクを追加する手順は次のとおりです。

    1. 「ページ・リンク」を選択して、「新規ページ・リンク」ダイアログを開きます(図15-12)。

      図15-12 「新規ページ・リンク」ダイアログ

      図15-12の説明が続きます
      「図15-12 「新規ページ・リンク」ダイアログ」の説明

    2. 「名前」フィールドに、リンクの表示名を入力します。

    3. 「パス」の場合は、「検索」アイコンをクリックして、「ページの選択」ダイアログを開きます(図15-13)。

      図15-13 「ページの選択」ダイアログ

      図15-13の説明が続きます
      「図15-13 「ページの選択」ダイアログ」の説明

    4. 指定のオプションからページを選択するか、「検索」をクリックして、使用可能なページのリストでページを特定します。


      ヒント:

      ホーム・ポータルでは、ホーム・ポータルのビューで使用可能なページから選択できます。その他のポータルでは、現在のポータルの範囲内で使用可能なページから選択できます。

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

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

    外部リンクを追加する手順は次のとおりです。

    1. 「外部リンク」を選択して、「新規外部リンク」ダイアログを開きます(図15-14)。

      図15-14 「新規外部リンク」ダイアログ

      図15-14の説明が続きます
      「図15-14 「新規外部リンク」ダイアログ」の説明

    2. 「名前」フィールドに、リンクの表示名を入力します。

    3. 「URL」フィールドに、リンク・ターゲットのURLを入力します。例:

      http://www.mywebdestination.com
      
    4. 現在のページ・テンプレートのコンテキスト内にあるリンク・ターゲット・コンテンツを表示するには、「ページ・テンプレートでのレンダリング」を選択します。

      このチェック・ボックスを選択解除すると、現在のページがリンク・ターゲットにリダイレクトされます。

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

    コンテンツ・リンクを追加する手順は次のとおりです。

    1. 「コンテンツ・リンク」を選択して、「新規コンテンツ・リンク」ダイアログを開きます(図15-15)。

      図15-15 「新規コンテンツ・リンク」ダイアログ

      図15-15の説明が続きます
      「図15-15 「新規コンテンツ・リンク」ダイアログ」の説明

    2. 「名前」フィールドに、リンクの表示名を入力します。

    3. 「パス」の場合は、「検索」アイコンをクリックして、「ドキュメントの選択」ダイアログを開きます。

      必要に応じて、「フィルタ」機能を使用して、リンク・ターゲットを特定できます。より詳細な検索を行う場合は、「詳細設定」をクリックします。詳細は、第15.8.3項「コンテンツ・リンクの拡張検索の構成」を参照してください。

      図15-16 「ドキュメントの選択」ダイアログ

      図15-16の説明が続きます
      「図15-16 「ドキュメントの選択」ダイアログ」の説明

    4. 「選択」をクリックします。

    5. 「OK」をクリックし、「新規コンテンツ・リンク」ダイアログを閉じます。

15.8.3 コンテンツ・リンクの拡張検索の構成

リンク・コンポーネントの拡張検索機能には、コンテンツ・リンクの検索に追加の検索条件およびフィルタを指定するコントロールが用意されています。「ドキュメントの選択」ダイアログ(図15-16)で、「詳細設定」をクリックして、「拡張検索」ダイアログ(図15-17)を開きます。

図15-17「拡張検索」ダイアログ

図15-17の説明が続きます
「図15-17 「拡張検索」ダイアログ」の説明

この検索は、拡張ドキュメント検索によく似ています。Oracle WebCenter Portalの使用の拡張ドキュメント検索の実行に関する項を参照してください。

15.8.4 リンク・コンポーネントでのリンクの構成

ページの編集権限を持つユーザーは、リンクをページに構成して、そのリンクの名前およびターゲットを変更できます。リンクの右側に「構成」アイコンが表示されている場合は、リンクの構成権限が付与されています(図15-18)。

図15-18 リンクの「構成」アイコン

図15-18の説明が続きます
「図15-18 リンクの「構成」アイコン」の説明

リンクを構成する手順:

  1. リンク・コンポーネントで、「構成」アイコンをクリックして、「typeリンクの編集」ダイアログを開きます(図15-19)。

    図15-19 「外部リンクの編集」ダイアログ

    図15-19の説明が続きます
    「図15-19 「外部リンクの編集」ダイアログ」の説明

  2. 必要に応じて値を変更します。


    注意:

    各種のリンク・タイプには様々なフィールドが表示されており、異なる値が必要です。

    typeリンクの編集」フィールドで必要な値の詳細は、第15.8.2項「リンク・コンポーネントを使用したナビゲーション・リンクの追加」を参照してください。


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

15.8.5 ナビゲーション・リンクの再順序付け

コンポーザで、またはページを表示している際に、リンク・コンポーネントでナビゲーション・リンクを再順序付けする手順は次のとおりです。

  1. リンクをクリックしたままにします。

  2. リンクをリスト内の新しい位置にドラッグします。

  3. リンクを放します。

15.8.6 リンク・コンポーネントからのリンクの削除

権限を持つユーザーは、指定のリンクの削除コントロールにアクセスして、リンク・コンポーネントからリンクを削除できます。各リンクの右側に「削除」アイコンが表示されている場合は、リンクを削除する権限が付与されています(図15-20)。

図15-20 リンクの「削除」アイコン

図15-20の説明が続きます
「図15-20 リンクの「削除」アイコン」の説明

リンク・コンポーネントからリンクを削除するには、次の手順を実行します。

  1. 対象となるリンク・コンポーネントのインスタンスに移動します。

  2. 対象のリンクの横にある「削除」アイコンをクリックします。

  3. 確認ダイアログの「削除」ボタンをクリックします。

15.8.7 リンク・コンポーネントのプロパティの設定

リンク・コンポーネントで設定する表示オプション・プロパティは、特定のインスタンスのみに影響を与えます。リンク表示オプション・プロパティは、他の多くのコンポーネントに共通です。共通の表示オプションは、第14.3.4項「コンポーネントの表示オプションの使用」にリストされ、説明が示されています。

同様に、リンク・コンポーネントのスタイル・プロパティは、他の多くのコンポーネントに共通です。共通のスタイル・プロパティは、第14.3.6項「スタイル・プロパティおよびコンテンツ・スタイル・プロパティの使用」にリストされ、説明が示されています。リンク・コンポーネントで設定するスタイルは、コンポーネントの外観を制御する他のスタイルをオーバーライドします。これには、コンポーネントの親コンテナ、現在のページおよびアプリケーション・スキンで設定されているスタイルが含まれます。

15.9 移動可能ボックス・コンポーネントの使用

この項では、移動可能ボックスの概要を示します。次のサブセクションが含まれます:

15.9.1 移動可能ボックス・コンポーネントについて

ページに移動可能ボックス・コンポーネントを追加するには、第15.2項「ページへのWeb開発コンポーネントの追加」を参照してください。

移動可能ボックス(図15-21)は、ボックスの周りを囲むコンテナです。これにより、ページでのコンテンツの配置が可能になるだけでなく、そのコンテンツをコンポーザ(「デザイン」ビュー)とビュー・モードの両方で一度にすべて移動できるようになります。

図15-21 ボックス・コンポーネントの下の移動可能ボックス・コンポーネント

図15-21の説明が続きます
「図15-21 ボックス・コンポーネントの下の移動可能ボックス・コンポーネント」の説明

コンポーザ(「デザイン」ビュー)で、またはページを表示している際に、移動可能ボックスのヘッダーをクリックして、ヘッダーとそのすべてのコンテンツをページの新しい位置にドラッグできます。また、移動可能ボックスはサイズの変更もできます。


ヒント:

ポートレットを移動可能ボックス・コンポーネントに追加しないでください。これにより、エラーを誘発する可能性のある不要な冗長性が生じます。

15.9.2 移動可能ボックス・コンポーネントのプロパティの設定

移動可能ボックスに関連付けられた表示オプションでは、移動可能ボックス・ヘッダーの非表示または表示、ヘッダー・テキストの指定、マウス・ポインタをヘッダー上に置いた際に表示されるツールチップの移動可能ボックスへの追加などが可能です。

移動可能ボックスの表示オプションは他の多くの種類のコンポーネントと共通しており、そのリストは、表14-1「表示オプション・プロパティ」に示されています。

移動可能ボックスの表示オプションは、「基本」および「詳細設定」の2つのサブタブに表示されます(図15-22)。

図15-22 移動可能ボックス・コンポーネントの表示オプション

図15-22の説明が続きます
「図15-22 移動可能ボックス・コンポーネントの表示オプション」の説明

デフォルトでは、移動可能ボックスごとに1つのボックス・コンポーネントを囲みます。ボックス・コンポーネントのプロパティの詳細は、第15.3.2項「ボックス・コンポーネントのプロパティの設定」を参照してください。

15.10 テキスト・コンポーネントの使用

この項では、テキスト・コンポーネントの概要を示し、その関連プロパティをリストして説明します。次のサブセクションが含まれます:

15.10.1 テキスト・コンポーネントについて

ページにテキスト・コンポーネント(図15-23)を追加するには、第15.2項「ページへのWeb開発コンポーネントの追加」を参照してください。

図15-23 テキスト・コンポーネント

図15-23の説明が続きます
「図15-23 テキスト・コンポーネント」の説明

テキスト・コンポーネントには、簡略化されたリッチ・テキスト・エディタが用意されています。このエディタを使用して、ページにテキスト(簡単な文、情報、ページの説明など)を追加したり、テキストのスタイルや書式設定を適用したりできます(図15-24)。「ソース・コード編集モード」アイコンを使用すると、HTMLを入力できます。

図15-24 テキスト・コンポーネントのテキスト・エディタ

図15-24の説明が続きます
「図15-24 テキスト・コンポーネントのテキスト・エディタ」の説明

15.10.2 テキスト・コンポーネントのプロパティの設定

テキスト・コンポーネントに関連付けられた表示オプションでは、コンポーネント・ヘッダーの非表示または表示、ヘッダー・テキストの指定、マウス・ポインタをヘッダー上に置いた際に表示されるツールチップの追加などが可能です。

テキストの表示オプションは他の多くの種類のコンポーネントと共通しており、そのリストは、表14-1「表示オプション・プロパティ」に示されています。

テキスト・コンポーネントのプロパティには、コンポーネント・インスタンスでスタイルを設定するオプションの付いた「スタイル」タブが含まれています。ここで設定するスタイルは、コンポーネントの外観を制御する他のスタイルをオーバーライドします。これには、コンポーネントの親コンテナおよび現在のページに設定されたスタイルや、アプリケーション・スキンを使用して設定されたスタイルが含まれます。テキスト・スタイルのプロパティは、他の多くのコンポーネントに共通しています。共通のスタイル・プロパティは、第14.3.6項「スタイル・プロパティおよびコンテンツ・スタイル・プロパティの使用」にリストされ、説明が示されています。

15.11 Webページ・コンポーネントの使用

この項では、Webページ・コンポーネントの概要を示し、その関連プロパティをリストして説明します。次のサブセクションが含まれます:

15.11.1 Webページ・コンポーネントについて

ページにWebページ・コンポーネントを追加するには、第15.2項「ページへのWeb開発コンポーネントの追加」を参照してください。

Webページ・コンポーネントでは、ポータル・ページのコンテキスト内の別のWebページ上にビューを開くことができます(図15-25)。

図15-25 Webページ・コンポーネント

図15-25の説明が続きます
「図15-25 Webページ・コンポーネント」の説明

Webページ・コンポーネントを使用して公開されるコンテンツには、公開されたWebページに関連付けられたすべてのコントロールが保持されています。それらのコントロールには、公開したコンテンツの種類に応じて、ビデオのボリュームの制御、wikiの編集、ブログへのエントリの投稿などの機能が保持されます。

Webページには、内部および外部のリンク・ターゲットを使用できます。内部ターゲットの場合は、相対ディレクトリ・パスを使用できます。


ヒント:

ポータルで、アプリケーション・ページの相対ディレクトリ・パスを簡単に取得するには、ターゲット・ページに移動し、そのページをお気に入りに追加する一連の動作を行います。デフォルトでは、「お気に入りの追加」ダイアログに現在のページの相対URLが指定されています。この情報をそのままコピーして、Webページのターゲットの定義に使用します。

詳細は、Oracle WebCenter Portalの使用の「お気に入りの管理」を参照してください。


Webページ・コンポーネントでは、「ページの作成」ダイアログで提供される「Webページ」ページ・スタイルにバリエーションを加えることができます(詳細は、表25-1「すぐに使用可能なページ・スタイル」を参照してください)。「Webページ」ページ・スタイルは、完全な外部Webページのエクスペリエンスを提供するのに役立ちます。一方、Webページ・コンポーネントは、アプリケーション・ページにWebページ・コンテンツを他のコンテンツ・タイプとともに含めるのに役立ちます。

Webページ・コンポーネントのプロパティには、コンポーネント・インスタンスでスタイルを設定するオプションの付いた「スタイル」タブが含まれています。ここで設定するスタイルは、コンポーネントの外観を制御する他のスタイルをオーバーライドします。これには、コンポーネントの親コンテナ、現在のページおよびアプリケーションで設定されているスタイルが含まれます。Webページ・スタイルのプロパティは、他の多くのコンポーネントに共通しています。共通のスタイル・プロパティは、第14.3.6項「スタイル・プロパティおよびコンテンツ・スタイル・プロパティの使用」にリストされ、説明が示されています。

15.11.2 Webページ・コンポーネントのプロパティの設定

Webページ・コンポーネントのプロパティでは、Webページ領域にレンダリングするコンテンツのURLや、マウス・ポインタをコンポーネントの境界線上に置いたときに表示されるALTテキストを指定できます。

表15-5は、Webページ・コンポーネントの表示オプションをリストして説明しています。

図15-26 Webページ・コンポーネントのプロパティ

図15-26の説明が続きます
「図15-26 Webページ・コンポーネントのプロパティ」の説明

表15-5 Webページ・コンポーネントの表示オプション

プロパティ 説明

Short Desc

Webページ領域のALTテキストを入力するフィールド。

Webページ・コンポーネントでは、マウス・ポインタをコンポーネントの境界線上に置いた場合にのみALTテキストが表示されることに注意してください。アクティブな領域を増やすには、コンポーネント・プロパティの「スタイル」タブでOther CSSプロパティを使用してコンポーネントの周囲のパディングを大きくします。たとえば、Other CSSテキスト・ボックスに次のように入力できます。

padding-top:30px;

Select

Webページ領域にレンダリングするソースWebコンテンツの完全修飾URLを入力するフィールド。

例:

http://www.oracle.com

www.oracle.com (http://が付いていない)は修飾されていないことに注意してください。指定のURLが無効の場合は、Webページ・コンポーネント内にコンテンツがレンダリングされません。

注意: 表示領域の幅および高さを調整するには、コンポーネントのスタイル・プロパティを使用します(詳細は、第14.3.6項「スタイル・プロパティおよびコンテンツ・スタイル・プロパティの使用」を参照してください)。

別のポータル・ページのコンテンツを表示する場合は、相対アドレスを使用できます。詳細は、第15.11.1項「Webページ・コンポーネントについて」を参照してください。

Show Component

ページ上のコンポーネントを表示または非表示にするオプション。

  • 選択すると、コンポーネントが表示されます。

  • 選択解除すると、コンポーネントは非表示になります。

この方法でコンポーネントを非表示にすると、子コンポーネントもすべて非表示になります。コンポーネントは、コンポーザの「構造」ビューに再び表示できます(第12.4.1.3項「コンポーザの「構造」ビューについて」を参照してください)。「構造」ビューで、非表示のコンポーネントを右クリックし、表示されるコンテキスト・メニューから「コンポーネントの表示」を選択します。



関連項目:

表示オプション・プロパティでは、式言語(EL)エディタにアクセスすることもできます。このエディタを使用すると、EL値の入力およびテストができます。EL式に関してサポートが必要な場合、アプリケーション開発者がEL式を提供できます。詳細は、Oracle WebCenter PortalおよびOracle JDeveloperでのポータルの開発の式言語式に関する付録を参照してください。