Custom Login Page Customizerの使い方と設定
ログインページを簡単にカスタマイズできる WordPress 用プラグインの紹介です。
それは「Custom Login Page Customizer By Hardeep Asrani」です。
その導入手順から日本語化・使い方と設定などを解説していきます。
Custom Login Page Customizer By Hardeep Asrani
Custom Login Page Customizer は、ログインページを外観カスタマイザーからリアルタイムプレビューで確認しながら簡単にカスタマイズできます。
- ページ全体の背景色と背景画像の設定
- WordPress のデフォルトロゴから変更
- ログインフォームの幅と高さ・背景色と背景画像などの設定
- 「ログイン状態を保存する」チェックボックスの背景色と背景画像・枠線関連の設定
- ログインボタンのカスタマイズ(文字サイズ・文字色・背景色・枠線の太さ・色など)
- 登録ページ・パスワード再発行ページ・サイトへ戻るのリンクの無効化
- 登録ページ・パスワード再発行ページ・サイトへ戻るの文字色設定
- 3 種類のテーマテンプレート
- カスタム CSS と Javascript コードの追加可
文字色・背景色・枠線の色等を設定する項目あるので、
よく使う色を一元管理できるプラグイン「Central Color Palette」があると便利かも。
Central Color Palette の使い方 – WordPress 活用術
記事を作成もしくは更新時点でのバージョン:2.0.1
インストール手順
Custom Login Page Customizer をインストールするには 2 種類の方法があります。
下記の URL から ZIP ファイルを入手して、管理画面からアップロードして有効化する。
Custom Login Page Customizer – WordPress.org
もしくは、WordPress.org の公式プラグインディレクトリにリリースされているので、
管理画面からインストールできます。
ダッシュボードから「プラグイン」メニューの「新規追加」を選択し、
プラグイン追加画面右上の検索窓に「Custom Login Page Customizer」と入力します。
検索結果の一番左上に表示されると思うので、「今すぐインストール」をクリックします。
※一番左上に表示されない場合は、上記の画像から探して下さい。
インストールが完了したら、プラグインを「有効化」します。
プラグインのインストールに慣れていない方は、
下記の記事にて詳しく解説していますので、御覧ください。
WordPressプラグインのインストール手順を解説 – WordPress活用術
日本語化
Custom Login Page Customizer を有効化した際に日本語化されない場合には、
日本語化用の言語パックを translate.wordpress.org から入手できる場合があります。
WordPress と関連プロジェクト(テーマ・プラグイン)用の翻訳プラットフォームとして、
translate.wordpress.org (GlotPress) が導入されています。
※ボランティアで翻訳されている場合が多いので、
全てのプラグインで、必ずしも日本語化用の言語パックが用意されているわけでは無いです。
また、用意されていても 100% 翻訳されている保証もありません。
日本語化用の翻訳ファイルの探し方は、下記の記事を参照してください。
WordPress公式での日本語化用の翻訳ファイルの探し方 – WordPress活用術
専用メニュー
管理画面の「外観」メニューの中に追加されています。
使い方
外観メニューから外観カスタマイザーを起動します。
サブメニュー化されています。
画面の右側で変更内容をリアルタイムプレビューで確認できます。
テンプレート(Templates)
用意されている 3 種類のテーマテンプレートからテーマを選択できます。
背景(Background)
ログインページの背景色と背景画像を設定できます。
ロゴ(Logo)
ここでは、WordPress のデフォルトロゴ画像を変更できます。
ロゴ画像を表示させないようにもできます。
ロゴ画像に張る URL も指定できます。
フォーム(Form)
ログインフォームのカスタマイズができます。
ログインフォームの背景画像・背景色・フォームの幅と高さを設定できます。
Radius:
フォームの四隅の角を丸くすることができます。
Shadow Spread:
影の付き具合を調整できます。
Box Shadow:
影の色を設定できます。
フィールド(Fields)
「ログイン状態を保存する」チェックボックスのカスタマイズができます。
「ログイン状態を保存する」チェックボックスの無効化もできます。
幅・フォントサイズ・枠線の太さ・枠線の色を選択できます。
また、枠線で囲んでできる四角の四隅の丸み具合を設定可。
上下左右のマージとパディングを指定可。
フォームのフィールドの背景色と文字色とラベルの色を選択できます。
ラベルのフォントサイズも設定できます。
ボタン(Button)
ボタンのカスタマイズができます。
背景色とホバー時の背景色とボタンのサイズ・フォントサイズ・文字色を設定できます。
ボタンのサイズは、カスタマイズ可。
枠線の太さや色などを設定できます。
その他(Other)
登録ページ・パスワード再発行ページ・サイトへ戻るのリンクを無効にできます。
登録ページ・パスワード再発行ページ・サイトへ戻るの文字色を選択できます。
Custom CSS & Javascript
カスタマイズ CSS と Javascript コードを追加できます。
代替プラグイン
Custom Login Page Customizer にほしい機能が無かった場合には、
Custom Login Page Customizer 以外にもログインページをカスタマイズできるプラグインを記事にしています。
以下では、Custom Login Page Customizer を含めて 6 個を簡単に紹介しています。
ログインページをカスタマイズできるWordPressプラグイン一覧