ご覧のページは、お客様の利便性のために一部機械翻訳されています。また、ドキュメントは頻繁に更新が加えられており、翻訳は未完成の部分が含まれることをご了承ください。最新情報は都度公開されておりますため、必ず英語版をご参照ください。翻訳に問題がある場合は、こちらまでご連絡ください。

テーマのCSS YAML設定リファレンス

client-extension.yamlファイルにテーマのCSSクライアント拡張を定義します。

使用法の詳細

この client-extension.yaml ファイルは、テーマのCSSクライアント拡張を定義します。

able-theme-css:
    clayURL: css/clay.css
    frontendTokenDefinitionJSON: src/frontend-token-definition.json
    mainURL: css/main.css
    name: Able Theme CSS
    type: themeCSS

mainURLとclayURLのプロパティは、2つのCSSリソースファイル（それぞれmain.css と clay.css）へのパスを設定するものです。これらのCSSファイルは、テーマモジュールのプロジェクトでデプロイされるものに相当します。

これらのファイルのCSSは、テーマですでに使用されているスタイリングに追加されます。競合する場合は、クライアント拡張のCSSが、すでにページ上にあるスタイリングを上書きします。

Liferay DXP 2024.Q2/Portal GA120 で frontendTokenDefinitionJSON プロパティが追加され、フロントエンドトークン定義ファイルの提供が可能になりました。

サンプルワークスペースには、完全なテーマ CSS クライアント拡張機能が含まれています。

YAML プロパティ

これらのプロパティは、テーマのCSSクライアント拡張に特有のものです。

名前	データ型	説明
`clayURL`	URL	(必須）Liferayテーマの`clay.css`ファイルを表すCSSファイルへのパスです。完全なURIは、`baseURL`の値が先頭に付きます。
`clayRTLURL`	URL	Clay CSS の右から左へのバージョンへのパス。これは、Liferay が RTL 言語に変更された場合にのみ使用されます。完全なURIは、`baseURL`の値が先頭に付きます。
`mainURL`	URL	(必須）Liferayテーマの`main.css`ファイルを表すCSSファイルへのパスです。完全なURIは、`baseURL`の値が先頭に付きます。
`mainRTLURL`	URL	メイン CSS の右から左へのバージョンへのパス。これは、Liferay が RTL 言語に変更された場合にのみ使用されます。完全なURIは、`baseURL`の値が先頭に付きます。
`frontendTokenDefinitionJSON`	文字列	`frontend-token-definition.json` ファイルへのパス。ビルド時に、その JSON はクライアント拡張機能の構成ファイルに挿入されます。
`scope`	文字列	Liferay DXP 2025.Q1/Portal GA132 以降では、スコープを `controlPanel` に設定して、テーマ CSS クライアント拡張機能をインスタンスの管理ページ（サイト管理やコントロールパネルページなど）に適用できます。デフォルトは `レイアウト`で、管理者によって設定されたサイトページにのみ適用されます。