| Oracle Fusion Middleware Oracle Portalユーザーズ・ガイド 11gリリース1 (11.1.1) B61383-02 |
|
 前 |
 次 |
次の各項で、ポートレットのスタイルを定義する色とフォントを変更する方法について説明します。
背景(またはボディ)の色を使用して、ページ上の特定の機能上の分野や特定のオブジェクト・タイプに注意を引くことができます。たとえば、ポートレットのメイン・ボディの色を変更できます。ポートレットのボディ色を変更するには、ポートレットが配置されたページで使用されるスタイルを編集します。
図11-3は、異なるボディ色を設定した同じポートレットを示しています。
Oracle Porta用に手作業で作成されたポートレットは、そのポートレットが配置されたページのスタイルではなく、独自のスタイルを使用することがあります。このような場合、これらのポートレットでは、適用されたスタイルではなく、作成されたときに指定したスタイルが使用されます。
スタイルを変更するときは注意してください。行った変更は、そのスタイルを使用するすべてのポートレットの外観に影響を与えることがあります。
|
注意: ページ・ポートレットおよびナビゲーション・ページについてのスタイルに関する特別な考慮事項は、11.5.4項「ページ・ポートレットおよびナビゲーション・ページのスタイルの制御」を参照してください。 |
ポートレット・ボディ色を変更するには、次の手順を実行します。
Oracle Portalにログインします。
「構築」タブをクリックして、前面に表示します。
「ページ・グループ」ポートレットの「作業場所」ドロップダウン・リストから、編集するスタイルを所有するページ・グループを選択します。
デフォルトでは、「ページ・グループ」ポートレットは「Portalビルダー」ページの「構築」タブにあります。
|
ヒント: スタイルが複数のページ・グループで使用されている場合は、「共有オブジェクト」ページ・グループにあります。 |
「レイアウトと外観」セクションの「スタイル」で、編集するスタイルをクリックします。
「スタイルの編集」ページの「プロパティ」タブが開きます。
「スタイル要素のタイプ」セクションで、「ポートレット」を選択します。
「スタイル要素のプロパティ」セクションで、「ポートレット・ボディ色」を選択します。
ポートレットに関連するスタイル要素のプロパティのリストおよび説明は、11.3.3項「ポートレット」を参照してください。
カラー・パレット内の色をクリックするか、「背景色」フィールドにその色の16進値(#CCFFFFなど)を入力します。
パレット内の色をクリックすると、「背景色」フィールドにその色の16進値が自動的に移入されます。
「適用」をクリックします。
「プレビュー」セクションがリフレッシュされ、選択した色が表示されます。
「閉じる」をクリックして変更を保存し、「スタイルの編集」ページを終了します。
ポートレット・ヘッダーで使用される色とフォントは、ポートレットが配置されたページに適用されたスタイルを編集すると変更できます。また、ポートレット・ヘッダーの角の外観を四角から丸に変更すると、いずれか一方の角を丸くできます。
図11-4は、異なるヘッダーの色と角を設定した同じポートレットを示しています。ポートレット・ヘッダーの色の設定によって、ポートレットの境界線の色も制御されます。
スタイルを変更するときは注意してください。行った変更は、そのスタイルを使用するすべてのページおよびサブページ、タブおよびアイテム・リージョンの外観に影響を与えます。
ポートレット・ヘッダーまたはサブヘッダーを変更するには、次の手順を実行します。
Oracle Portalにログインします。
「構築」タブをクリックして、前面に表示します。
「ページ・グループ」ポートレットの「作業場所」ドロップダウン・リストから、該当するスタイルを所有するページ・グループを選択します。
デフォルトでは、「ページ・グループ」ポートレットは「Portalビルダー」ページの「構築」タブにあります。
|
ヒント: スタイルが複数のページ・グループで使用されている場合は、「共有オブジェクト」ページ・グループにあります。 |
「レイアウトと外観」セクションの「スタイル」で、編集するスタイルをクリックします。
「スタイルの編集」ページの「プロパティ」タブが開きます。
「スタイル要素のタイプ」セクションで、「ポートレット」を選択します。
ポートレット・ヘッダーの色とフォントを変更するには、次の手順を実行します。
「スタイル要素のプロパティ」セクションで、次のいずれかを選択します。
ポートレット・ヘッダー色
この要素は、ポートレット・ヘッダーの背景色を制御します。また、ポートレットの境界線の色も制御します。ポートレット・ヘッダーおよび境界線には、常にそのポートレットが含まれるページに適用されたスタイルに対して定義された色が使用されます。
ポートレット・ヘッダー・テキスト
この要素は、ポートレット・ヘッダーに表示されるポートレットの表示名を制御します。
ポートレット・ヘッダー・リンク
この要素は、ポートレット・ヘッダーに表示されるリンクの外観を制御します。そのようなリンクには、「ヘルプ」、「パーソナライズ」および「バージョン情報」があります。
ポートレット・サブヘッダー色
この要素は、ポートレット・サブヘッダーの背景色を制御します。
ポートレット・サブヘッダー・テキスト
この要素は、ポートレット・サブヘッダーに表示されるテキストの外観を制御します。
ポートレット・サブヘッダー・リンク
この要素は、ポートレット・サブヘッダーに表示されるリンクの外観を制御します。
「プレビュー」セクションでスタイル要素をクリックして、選択することもできます。
ポートレットに関連するスタイル要素のプロパティのリストおよび説明は、11.3.3項「ポートレット」を参照してください。
カラー・パレット内の色をクリックするか、「色」フィールドにその色の16進値(#CCFFFFなど)を入力します。
パレット内の色をクリックすると、「色」フィールドにその色の16進値が自動的に移入されます。
「フォント飾り」で、次のいずれかを選択します。
<なし>: 飾りなしの場合(次の注意を参照)
プレーン: 飾りなしの場合(次の注意を参照)
下線: 下線付きのテキストの場合
取消し線: 取消し線が引かれたテキストの場合
下線と取消し線:取消し線も引かれた下線付きのテキストの場合
フォントを選択します。
「<デフォルト>」フォントを選択すると、ユーザーのブラウザで指定されたデフォルトのフォントで、テキストがレンダリングされます。
フォント・サイズを指定し、単位を選択します。
px: 固定単位(ピクセル。閲覧者のモニターが基準)
pt: 固定単位(ポイント)
em: 相対単位(最後に指定されたフォントのフォント・サイズが基準)
ex: 相対単位(最後に指定されたフォントのXのサイズが基準)
%: 相対単位(最後に指定されたフォントのフォント・サイズが基準)
「フォント・スタイル」で、次のいずれかを選択します。
プレーン
太字
斜体
太字と斜体
「適用」をクリックします。
「プレビュー」セクションがリフレッシュされ、選択した色とフォントが表示されます。
ポートレット・ヘッダーの角を変更するには、次の手順を実行します。
「スタイル要素のプロパティ」セクションで、「ポートレット・ヘッダー・スタイル」を選択します。
ラジオ・ボタンを選択して、次の中から角を選択します。
「適用」をクリックします。
「プレビュー」セクションがリフレッシュされ、選択した結果が表示されます。
必要に応じて、各ポートレット・ヘッダーのスタイル要素を編集します。
各要素を変更したら、「適用」をクリックします。
「閉じる」をクリックして変更を保存し、「スタイルの編集」ページを終了します。
Oracle Portalには、ポートレットの開発に使用するための4つのレベルのヘッダーおよびテキスト属性があります。任意のOracle Portalページのソースを表示すると、ポートレットが「ポートレット・ヘッダー1」および「ポートレット・テキスト1」を使用して記述されたことがわかります。たとえば、お気に入りポートレットでは、お気に入りリンクに「ポートレット・ヘッダー1」スタイル要素が使用されています。
ポータルのヘッダーおよびテキストに適用される色およびフォントを使用して、ポータルの外観を独特なものにすることができます。ポートレットのヘッダーおよびテキストで使用される色とフォントは、ポートレットが配置されたページに適用されたスタイルを編集して変更します。
図11-9は、異なる色を「ポートレット・ヘッダー1」に設定した「お気に入り」ポートレットを示しています。
ポートレットでこれらのスタイル要素を使用する方法は、Oracle Technology Network (OTN)(http://www.oracle.com/technology/products/ias/portal/portlet_development_10g1014.html)にある「Portal Developer Kit」ページを参照してください。独自に開発したポートレットで使用できるOracle Portalスタイル・クラスの詳細は、11.12項「HTMLテンプレートおよびCSSでのPortalスタイル要素クラスの使用」を参照してください。
スタイルを変更するときは注意してください。行った変更は、そのスタイルを使用するすべてのページおよびサブページ、タブおよびアイテム・リージョンの外観に影響を与えます。
ポートレット・ヘッダーおよびテキストの色とフォントを変更するには、次の手順を実行します。
Oracle Portalにログインします。
「構築」タブをクリックして、前面に表示します。
「ページ・グループ」ポートレットの「作業場所」ドロップダウン・リストから、編集するスタイルを所有するページ・グループを選択します。
デフォルトでは、「ページ・グループ」ポートレットは「Portalビルダー」ページの「構築」タブにあります。
|
ヒント: スタイルが複数のページ・グループで使用されている場合は、「共有オブジェクト」ページ・グループにあります。 |
「レイアウトと外観」セクションの「スタイル」で、編集するスタイルをクリックします。
「スタイルの編集」ページの「プロパティ」タブが開きます。
「スタイル要素のタイプ」セクションで、「ポートレット」を選択します。
「スタイル要素のプロパティ」セクションで、「ポートレット・ヘッダーn」または「ポートレット・テキストn」を選択します。ここでnは、設定するレベルです。
「プレビュー」セクションでポートレットのヘッダーまたはテキストのスタイル要素をクリックして、選択することもできます。
ポートレットに関連するスタイル要素のプロパティのリストおよび説明は、11.3.3項「ポートレット」を参照してください。
パレット内の色をクリックするか、「色」フィールドにその色の16進値(#FFCC00など)を入力します。
パレット内の色をクリックすると、「色」フィールドにその色の16進値が自動的に移入されます。
「フォント飾り」で、次のいずれかを選択します。
<なし>: 飾りなしの場合(次の注意を参照)
プレーン: 飾りなしの場合(次の注意を参照)
下線: 下線付きのテキストの場合
取消し線: 取消し線が引かれたテキストの場合
下線と取消し線:取消し線も引かれた下線付きのテキストの場合
|
注意: 「プレーン」および<なし>を選択すると、ほとんどのアイテム・タイプに同じ効果が適用されます。ただし、ハイパーリンクとして表示されるアイテムに適用すると、次のように効果は異なります。
|
フォントを選択します。
「<デフォルト>」フォントを選択すると、ユーザーのブラウザで指定されたデフォルトのフォントで、テキストがレンダリングされます。
フォント・サイズを指定し、単位を選択します。
px: 固定単位(ピクセル。閲覧者のモニターが基準)
pt: 固定単位(ポイント)
em: 相対単位(最後に指定されたフォントのフォント・サイズが基準)
ex: 相対単位(最後に指定されたフォントのXのサイズが基準)
%: 相対単位(最後に指定されたフォントのフォント・サイズが基準)
「フォント・スタイル」で、次のいずれかを選択します。
プレーン
太字
斜体
太字と斜体
「適用」をクリックします。
「プレビュー」セクションがリフレッシュされ、選択した色とフォントが表示されます。
必要に応じて、スタイル要素を編集します。
各要素を変更したら、「適用」をクリックします。
「閉じる」をクリックして変更を保存し、「スタイルの編集」ページを終了します。
ページ・ポートレットがソース・ページのスタイルを使用するのか、ナビゲーション・ページが使用するのかに関係なく、ヘッダーおよび境界線は常に配置されたページのスタイルを使用してレンダリングされます。これは、ページ・ポートレットまたはナビゲーション・ページのソース・ページに定義されたスタイルを使用するように指定したときでも当てはまります。
コンテナ・ページのヘッダーおよび境界線の色をページ・ポートレットまたはナビゲーション・ページで使用しない場合は、コンテナ・ページでのリージョン・レベルのヘッダーおよび境界線の表示をオフにできます。ページ・ポートレットまたはナビゲーション・ページに独自のポートレットも含まれる場合は、それらのポートレットのソース・ページでのポートレット・リージョンのヘッダーおよび境界線の表示もオフにする必要があります。
コンテナ・ページに適用されているポートレットの背景色スタイル要素が空白のままではなく特定の値に設定されている場合、「ポートレットを配置したページのスタイルを使用」オプションの設定は、そのページ・ポートレットのソース・ページに配置できるポートレットを除いて、そのページ・ポートレットに対して無視されます。
ページ・ポートレットまたはナビゲーション・ページで、配置先のページに指定された背景色ではなく独自の背景色を必ず使用するには、次の手順を実行します。
ポートレットとして公開するときに、ページ・ポートレットまたはナビゲーション・ページで独自のスタイルを使用することを確認します(つまり、ポートレットとして使用しているページまたはナビゲーション・ページの「ポートレットを配置したページのスタイルを使用」オプションの選択を解除します)。
コンテナ・ページ(つまり、ページ・ポートレットまたはナビゲーション・ページが配置されるページ)で使用されるスタイルでは、「ポートレット・ボディ色」スタイル要素の値を空白のままにします。
