ログイン画面へ画像スライダーを入れたりデザインをカスタマイズできるプラグイン「Login Slider」
まあバックエンドだから仕方ないことですが、WordPress標準のログイン画面はちょっと無機質な感じがしませんか?
そこでCSSを追加してデザイン変更を!!と思っても、実はWordPressのログイン画面などは通常のテーマで使われているCSSとは別のファイル(別物)なんです。したがってテーマのCSSでカスタマイズしても一向に反映されないんですね。
自身でCSSの編集ができる人なら
などを使ってカスタマイズすればOKですね。でもそこまでしなくても・・・という方も多いはず。
それにいくらカスタマイズしても色や文字の大きさなどのカスタマイズだけではやっぱりどこか冷たい?感じがする・・・という場合におすすめなのが今回紹介する【Login Slider】です。
この記事を公開する時点ではログイン画面に画像スライダーを使えるプラグインはこれだけだと思われます。
【Login Slider】プラグインの基本的な機能・できること
- ログイン画面にスライダー画像を挿入できる
- 画像にはそれぞれリンクが設定でき、クリックで別のページへリダイレクトできる
- 基本的に変更するであろう項目についてはメニュー化されている
この記事を参考にプラグインの導入をする際以下に留意ください
- すべての環境で動作するとは限りません
- できる限り最新のバージョンの情報を紹介するようにしておりますが、閲覧される時期によってはバージョンが変わり、仕様が大きく変更されている場合があります
- 有料版と無料版がある場合、テストは原則無料版のみで実施しています
- テスト環境については本文中に記載しています
- 使用方法で紹介しているショートコードやコードなどをコピーして使用すると、環境によっては記号などが文字化けすることがあります。コピーしたのに動作しない場合は特に「"」「'」などの記号を入力し直してみてください。
【Login Slider】プラグインの設定画面や表示の日本語化と翻訳
【Login Slider】プラグインは日本語化が可能な言語ファイルが同梱されており、翻訳してみましたが適用されないようです(設定項目が少ないので英語表記でも大丈夫だと思います)。
【Login Slider】プラグインのインストールと設定
インストール方法
インストールはプラグインの新規追加でプラグイン名を入力して検索してインストールするか、ページ先頭の画像をクリックして表示されるWordPressのプラグイン公式配布ページがダウンロード後、管理画面からアップロードインストールしてください。
WordPressを使い始めて間もない方(初心者の方)は、より詳細なプラグインのインストール手順や、インストール時に起こる問題などへの対処方法をまとめた
も併せてご覧ください。
【Login Slider】プラグインの基本的な使い方
設定は「外観」→「カスタマイズ」を開き、出てくるカスタマイザーメニューの一番下に追加される「Login Slider」から行います。さまざまな項目については以下の通りです
Slidesメニュー
スライダー画像の設定を行います。最大で7枚までの画像をスライド表示させることができます。
設定項目は
- Transition Style
- Slide Duration (milliseconds)
画像入れ替え時の効果を設定します
画像を入れ替える速度を設定します
で、この設定を行った上で画像を追加していくだけです
Colors and Brandingメニュー
ログイン画面のいろいろなデザイン変更ができます
項目は
- Login Form Logo
- Body Background
- Form Background
- Form Label Color
- Form Input Background Color
- Form Input Text Color
- Form Button Text Color
- Form Button Background Color
- Below Form Links
ログイン画面にあるWordPressロゴをオリジナル画像に変更できます
ログイン画面全体の背景色です
ログイン情報入力フォームの背景色です
入力フォームラベルの色です
入力欄の背景色です
入力した文字の色です
ボタンの文字色です
ボタンの背景色です
フォーム下のリンク文字色です
※ボタンの色はホーバー時(マウスオーバー時)の設定項目もあります
【Login Slider】プラグインの便利な使い方・カスタマイズ方法など
より便利に使うカスタマイズ技やテストサイトで使用した結果や感想、WordPressのプラグイン公式配布ページには書かれていない事柄などを紹介します。
残念ながらカスタムCSSを適用する機能がないためさらに細かく設定変更するには別のプラグインを用いるなどする必要がありますが、今回は同時使用のテストをしていません。
が、これぐらいのカスタマイズができればおそらく十分でしょうし、他のプラグインとのCSS読み込み順などによっては表示が崩れたりする可能性がありますから自身でチェックしてみてくださいね。
プラグインのテスト環境&個人的評価
最後に【Login Slider】を動作確認した際の環境と個人的な評価を書いておきます。導入の検討や参考になれば幸いです。
テストした環境
- WordPressのバージョン:4.7.5
- PHPのバージョン:7.0
- テーマ:Simplicity2 バージョン2.3.0g
- プラグインのバージョン:1.0.0
このプラグインの最新バージョンは現在Wordpress公式サイトに "login-slider" は存在しません(配布されていません)です。バージョンが異なる場合には設定の仕方や動作仕様が変更になっている可能性があります。
個人的な評価・感想ほか
- 5段階評価
- 設定のしやすさ:★★★★★
- 使いやすさ:★★★★☆
- おすすめ度:★★★★☆
多数のユーザーで投稿するタイプのサイトでなくても、ログイン画面に画像があるだけで何となくやる気になりますよ。モチベーションアップにおすすめのプラグインです。
WordPressのカスタマイズ・不具合対応などご相談ください
Wordpressのカスタマイズ、不具合解消のご相談はすべてココナラのダイレクトメッセージからお受けしております。まずはこちらのバナーからお気軽にお問い合わせください。
【スポンサーリンク】