スタイルの編集

CSS Designer を使用して、テーマの Style.css ファイルをカスタマイズします。

CSS Designer のオープン

テーマのスタイルを編集するには、幾つかの方法があります。
  • Portal Designer で、ポップアップ・メニューから「スタイルの編集」を選択します。 アクティブ・テーマの Style.css ファイルが、CSS Designer に開きます。
CSS Designer (Styles.css というラベルの付いたタブ) では、編集に使用する 2 つのビューがあります。プレビュー・ペイン (左) とソース・エディター (右) です。

Page Designer の Styles.css ファイル

上記の画像は、プレビュー・ペイン内の themeskin.html ファイルを示しています。 このファイルでは、アクティブなテーマおよびスキンに影響を与える、フォントなどのスタイルを調べることができます。 プレビュー・ペインの左側で、「アウトライン」ビューが「スタイル」ビューに変わっていることに注目してください。 テーマおよびスキンに変更を加えるには、「スタイル」ビュー内のスタイル・エレメントの名前をクリックします。 この例では、.wpsToolBar エレメントを強調表示すると、プレビュー・ペイン内の対応するエレメント、および Styles.css ファイル内のソース・ペインも強調表示されることに注目してください。

ポートレット・アプリケーション内のスタイルをカスタマイズするには、portlet.html ファイルを使用します。 portlet.html ファイルをプレビュー・ペインに表示するには、Styles.css の「プレビュー対象」ドロップダウン・メニューから「portlet.html」を選択してください。

テーマ内のスタイルの編集

Page Designer でテーマを編集中に CSS Designer を開くと、新規または既存のスタイルシートにリンクすることができます。 また、新規クラスを指定することもできます。 Page Designer を使用したテーマの編集について詳しくは、テーマの編集を参照してください。

CSS Designer を開くには、以下の手順を実行してください。ダイアログ・ボックスが表示されます。
  • メニュー・バーから、「編集」 > 「スタイルの編集」を選択する。ダイアログ・ボックスが表示されます。
  • 編集したいスタイルの局面を選択してから、「OK」をクリックする。

または

Page Designer 内のオープン・テーマで、編集する項目を選択し、「プロパティー」ビューで変更を加えてください。 選択項目に対してスタイル・クラス・ルールが定義されている場合、「すべての属性」ビューの「クラス」フィールドにリストされます。 「すべての属性」ビューにアクセスするには、「プロパティー」ビューのツールバーの右上にあるテーブル・アイコンをクリックしてください。 これにより、「プロパティー」ビューが、Page Designer で選択した項目に関連したすべての属性のリストに変わります。 このアイコンをもう一度クリックすると、「プロパティー」ビューに戻ります。

ポートレット・スタイルのプレビュー

テーマのスタイルシート に指定されているポートレット・スタイルの効果をプレビューするには、テーマ (およびスタイルシート) が含まれているポータル・プロジェクトを作成します。 ポートレットの JSP ファイルを開くと、Page Designer の「設計」ページおよび「プレビュー」ページでスタイルシートが有効になるように、ポートレット・プロジェクトの 1 つをポータル・プロジェクトに関連付けます。
  1. ポータル・プロジェクトを作成するには、「ファイル」 > 「新規」 > 「ポータル・プロジェクト」 と選択する。
  2. プロジェクト・エクスプローラーで、既存の「PortalContent」 > 「themes」 > 「html」 > 「ie」 > 「en」 > 「styles.css」をポートレット・プロジェクトの style.css ファイルに置き換える。
注: ポートレット・ページは、特定のポータルにデプロイまたは追加されるまで、スタイルを反映しません。 これらの手順で作成したポータル・プロジェクトは、単に、テーマの styles.css ファイルのポートレットにおける効果をプレビューすることを目的としたものです。
関連タスク
Portal Designer の使用
レイアウトの定義
スキンの処理
テーマの処理
ポータル・ページへのポートレットの追加

(C) Copyright IBM Corporation 2002, 2005. All Rights Reserved.