このトピックでは、管理コンソールのログイン ページの要素を変更する方法について説明します。
ログイン ページのロゴ
ロゴを変更するには、組織内の両方のテナント アプライアンスで stylesForCustomBranding.css ファイルを編集します。
$> /usr/local/desktone/release/dt-platform-20_2_0/deploy/dt-tenant-node-20.2.0-bin/horizonadmin/static/css/production/ stylesForCustomBranding.css
次の例のように、コードの該当するセクションを編集します。
- コメント
/*! Remove this when the logo is required. */を削除します。 - 他のコメント行をコメント解除します。
- 画像ファイルの URL を変更します。
/*! App Logo with text */
.login-wrapper .login .brand-logo {
display: none;
/*! Remove this when the logo is required. */
background: url('../../static/images//EUC_HorizonLogin_bg.png') no-repeat;
width: 100px;
height: 100px;
margin: 0 auto 1rem auto; }
次の図は、上記に示すようにコードが編集されたときのページの外観の例を示しています。
| 変更前 | 変更後 |
|---|---|
![]() | ![]() |
ログイン ページの背景
背景を変更するには、組織内の両方のテナント アプライアンスで stylesForCustomBranding.css ファイルを編集します。
$> /usr/local/desktone/release/dt-platform-20_2_0/deploy/dt-tenant-node-20.2.0-bin/horizonadmin/static/css/production/ stylesForCustomBranding.css
次の例のように、コードの該当するセクションを編集して、コメントされたテキストをコメント解除し、画像ファイルの URL を変更します。
/*! Login Page Background changes */
.login-wrapper {
background: url('../../images/FBG.jpg') no-repeat; };
}
次の図は、上記に示すようにコードが編集されたときのページの外観の例を示しています。
| 変更前 | 変更後 |
|---|---|
![]() | ![]() |
ログイン ボタン
ボタンを変更するには、組織内の両方のテナント アプライアンスで stylesForCustomBranding.css ファイルを編集します。
$> /usr/local/desktone/release/dt-platform-20_2_0/deploy/dt-tenant-node-20.2.0-bin/horizonadmin/static/css/production/ stylesForCustomBranding.css
次の例のように、コードの該当するセクションを編集して、コメントされたコードの 2 行をコメント解除し、border-color と background-color の色を変更します。
/*! login button */
.login-wrapper .login .login-group .btn {
border-color: #00b315;
background-color: #ff5733;
次の図は、上記に示すようにコードが編集されたときのページの外観の例を示しています。
| 変更前 | 変更後 |
|---|---|
![]() | ![]() |
このページは役に立ちましたか?
![ブランディング前の [ログイン] ページの例](images/GUID-8C4AFAFD-C330-464F-9B1F-3B25625AAD6E-low.png)
![ブランディング後の [ログイン] ページの例](images/GUID-F3F72C37-3522-4365-970C-96C9FA86CB87-low.png)
![ブランディング前の [ログイン] ページの例](images/GUID-1565D74B-0278-40A0-B328-F9D8F1A12F35-low.png)
![ブランディング後の [ログイン] ページの例](images/GUID-51600BBE-6937-4979-B1E3-B894E174E1C0-low.png)
![ブランディング前の [ログイン] ページの例](images/GUID-C0BE16C7-6267-414A-A068-09C068A2620B-low.png)
![ブランディング後の [ログイン] ページの例](images/GUID-428234AC-4FB4-4E37-9F17-5A9A5A2C7795-low.png)