サイトの外観を変更する¶
サイトのロゴ、ファビコン、テーマの変更は、最初に変更したいルックアンドフィールの一部です。 テーマは、サイトの全体的なルックアンドフィールを設定するために使用されます。 サイトのページは、DXPインスタンスに展開されているテーマを使用するように設定できます。
DXP Docker イメージでは、 Classic テーマがデフォルトで利用可能です。 この例では、新しいシンプルなテーマをデプロイしてから、テーマを切り替える方法を示します。
サイトのテーマを変更する¶
新しいテーマをデプロイする¶
新しいLiferay インスタンスを起動し、以下を実行します。
docker run -it -m 8g -p 8080:8080 liferay/portal:7.4.3.29-ga29。
http://localhost:8080でLiferayへのサインインします。 メールアドレス_test@liferay.com_とパスワード_test_を使用してください。 プロンプトが表示されたら、パスワードを _learn_に変更します。
次に、以下の手順に従います。
Download the WAR containing the Acme Sample Blue Theme :
curl https://learn.liferay.com/dxp/latest/en/getting-started/changing-your-sites-appearance/liferay-5b2v-theme.war -O
テーマを含むWARをデプロイします。
docker cp liferay-5b2v-theme.war docker-container:path-to-deploy-folder
これにより、DXPインスタンスにサンプルテーマが読み込まれます。 コンソールで次のメッセージを確認して、テーマが正常にデプロイされたことを確認できます。
2020-03-11 17:06:35.601 INFO [fileinstall-/opt/liferay/osgi/war][BundleStartStopLogger:39] STARTED liferay-5b2v-theme_1.0.0 [1112]
サイトのテーマを変更する¶
デプロイされたテーマを使用するようにサイトのページを設定します。
ブラウザで
https:// localhost:8080にアクセスし、管理者としてログイン します。画面の左側には サイトメニュー で、 ［サイトビルダー］ → ［Pages］ に移動します。
アプリケーションバーの アクション ボタン (
) をクリックし、 コンフィグレーション を選択します。
スクロールダウンして、 ［Change Current Theme］ ボタンをクリックします。
デプロイされたサンプルテーマ、 Acme Sample Blue Theme を選択します。
サイトのホームページに戻り、テーマが変更されたことを確認します。 サイトのコンテンツセクションの背景が青色になりました。
サイトのテーマが更新されました。
次のステップ¶
サイトの外観を管理する方法の全容については、Managing Your Site's Appearanceを参照してください。
Liferay Marketplace には、プロフェッショナルなルックアンドフィールを素早く実現するためのテーマが多数用意されています。
また、 独自のテーマを作成する方法も紹介されています。