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

テーマのお気に入りアイコンクライアント拡張の使用

Liferay DXP 7.4+

テーマのお気に入りアイコンクライアント拡張を使えば、選択したページでテーマのお気に入りアイコンを上書きすることができます。 クライアント拡張機能をビルドしてデプロイするには、 サンプル ワークスペース から開始します。

前提条件

クライアント拡張の開発を開始するには、

  1. サポートされているバージョンの Javaをインストールします。

    サポートされている JDK、データベース、環境については、 互換性マトリックス を確認してください。 推奨される JVM 設定については、 JVM 構成 を参照してください。

  2. サンプルワークスペースをダウンロードし、解凍します。

    curl -o com.liferay.sample.workspace-latest.zip https://repository.liferay.com/nexus/service/local/artifact/maven/content\?r\=liferay-public-releases\&g\=com.liferay.workspace\&a\=com.liferay.sample.workspace\&\v\=LATEST\&p\=zip
    
    unzip com.liferay.sample.workspace-latest.zip
    

これで、最初のテーマのお気に入りアイコンクライアント拡張をデプロイするためのツールがそろいました。

クライアント拡張の検討

テーマのお気に入りアイコンクライアント拡張は、サンプルワークスペースの client-extensions/sample-global-css/ フォルダにあります。 client-extension.yaml ファイルに定義されています。

liferay-sample-theme-favicon:
   name: Liferay Sample Theme Favicon
   type: themeFavicon
   url: favicon.ico

このクライアント拡張は、IDが liferay-sample-theme-faviconで、タイプや追加するお気に入りアイコンファイルなど、テーマのお気に入りアイコンクライアント拡張の主要な設定項目が含まれています。 利用可能なプロパティの詳細については、 テーマのファビコン YAML 構成リファレンス を参照してください。

また、以下のassemble YAMLブロックも含まれています。

assemble:
   - from: assets
   into: static

これは、 assets/ フォルダ内のすべてを、ビルドされたクライアント拡張.zip ファイルに静的リソースとして含めることを指定します。 テーマのお気に入りアイコンクライアント拡張のお気に入りアイコンファイルは、Liferayの静的リソースとして使用されます。

Liferayにクライアント拡張をデプロイする

新しいLiferay インスタンスを起動し、以下を実行します。

docker run -it -m 8g -p 8080:8080 liferay/portal:7.4.3.132-ga132

http://localhost:8080でLiferayにサインインします。 メールアドレス test@liferay.com とパスワード testを使用してください。 プロンプトが表示されたら、パスワードを learnに変更します。

Liferay が起動したら、サンプル ワークスペースのクライアント拡張機能のフォルダーから次のコマンドを実行します。

../../gradlew clean deploy -Ddeploy.docker.container.id=$(docker ps -lq)

これにより、クライアント拡張が構築され、Liferayのdeploy/フォルダにzipをデプロイします。

クライアント拡張機能をLiferay SaaSにデプロイするには、Liferay Cloud コマンドラインツール を使用して lcp deployを実行します。

ヒント

ワークスペース内のすべてのクライアント拡張機能を同時にデプロイするには、 client-extensions/ フォルダーからコマンドを実行します。

Liferayインスタンスのコンソールでデプロイメントを確認します。

STARTED liferay-sample-theme-favicon_1.0.0

ページでクライアント拡張を使用する

デプロイされたクライアント拡張を使用するために、Liferayのページを設定します。

  1. ページ上部の 編集 (Edit icon) をクリックします。

  2. サイドバーで、「ページ デザイン オプション」メニュー (Page Design Options icon) に移動し、メニューの上部にある 構成 (Configuration icon) をクリックします。

  3. ファビコン セクションで、 外観 タブの ファビコンの変更をクリックします。

  4. [クライアント拡張]をクリックし、新しくデプロイしたお気に入りアイコン、[サンプルテーマのお気に入りアイコン]を選択します。

    [サンプルテーマのお気に入りアイコン]クライアント拡張を選択し、[保存]をクリックします。

  5. 下にスクロールして、 「保存」をクリックします。

  6. ページに戻ります。 新しいお気に入りアイコンがブラウザのタブに表示されます。

新しいお気に入りアイコンがブラウザのタブに表示されます。

今後の流れ

Liferayでテーマのお気に入りアイコンクライアント拡張を使用できるようになりました。 次は他のクライアント拡張タイプのデプロイメントを試してみましょう。