サイトの外観を変更する¶
Liferayには、サイトの外観をカスタマイズする方法がたくさんあります。 サイトのファビコンとテーマは、最初に変更した方がよい要素です。 テーマはサイトのデフォルトのルック&フィールを設定し、ファビコンはユーザーのブラウザーのタブでサイトを識別するためのアイコンです。
サイトのファビコンを変更する¶
新しいLiferay インスタンスを起動し、以下を実行します。
docker run -it -m 8g -p 8080:8080 liferay/portal:7.4.3.55-ga55。
http://localhost:8080でLiferayへのサインインします。 メールアドレス_test@liferay.com_とパスワード_test_を使用してください。 プロンプトが表示されたら、パスワードを _learn_に変更します。
次に、以下の手順を実行します。
サイトメニュー(
)を開き、 サイトビルダー → ページ に移動します。
アプリケーションバーにある アクション ボタン(
)をクリックし、 設定 を選択します。
[お気に入りアイコン]で お気に入りアイコンの変更 をクリックします。
画像を選択またはアップロードします。
[保存]をクリックします。
サイトでは、選択した画像がお気に入りのアイコンとして使用されます。
サイトのテーマを変更する¶
デフォルトでは、Liferayインスタンスは標準テーマを使用しますが、カスタムテーマをデプロイして使用することもできます。
新しいテーマをデプロイする. Acme Sample Blue Theme を含むWARをダウンロードします。¶
``bash
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
と 管理者としてログイン.サイトメニュー (
) を開き、 サイトビルダー → ページに進みます。
アプリケーションバーのアクションボタン(
)をクリックし、*[Configuration]*を選択します。
Look And Feel セクションを展開し、 Change Current Themeをクリックします。
サンプルテーマを選択します。 Acme Sample Blue Theme.
[保存] をクリックします。
トップページに移動して、背景色が青になったことを確認します。
次のステップ¶
さらに、 スタイルブック を使ってデザイン要素をさらにカスタマイズしたり、 マスターページテンプレート を使ってコンテンツページのヘッダーとフッターをデザインすることができます。 サイトの外観のカスタマイズの概要については、 Site Appearance を参照してください。
Liferay Marketplace には、プロフェッショナルなルックアンドフィールを素早く実現するためのテーマが多数用意されています。
また、 独自のテーマを作成する方法も紹介されています。