WordPress標準のログイン画面に画像スライダーを入れたりデザインをカスタマイズできるプラグイン「Login Slider」
公開日：2017年9月10日 バックエンド（管理）
【この記事の目次】－ 必要な部分だけ見たいときにどうぞ － [表示する]
そこでCSSを追加してデザイン変更を！！と思っても、実はWordpressのログイン画面などは通常のテーマで使われているCSSとは別のファイル（別物）なんです。したがってテーマのCSSでカスタマイズしても一向に反映されないんですね。
自身でCSSの編集ができる人なら
などを使ってカスタマイズすればOKですね。でもそこまでしなくても・・・という方も多いはず。
それにいくらカスタマイズしても色や文字の大きさなどのカスタマイズだけではやっぱりどこか冷たい？感じがする・・・という場合におすすめなのが今回紹介する【Login Slider】です。
この記事を公開する時点ではログイン画面に画像スライダーを使えるプラグインはこれだけだと思われます。
【Login Slider】プラグインの基本的な機能・できること
- ログイン画面にスライダー画像を挿入できる
- 画像にはそれぞれリンクが設定でき、クリックで別のページへリダイレクトできる
- 基本的に変更するであろう項目についてはメニュー化されている
この記事の内容について
このプラグイン紹介記事は簡易的に動作テストをした上で紹介していますが以下の点にご注意願います
- すべての環境で動作するとは限りません
- できる限り最新のバージョンの情報を紹介するようにしておりますが、閲覧される時期によってはバージョンが変わり、仕様が大きく変更されている場合があります
- 有料版と無料版がある場合、テストは原則無料版のみで実施しています
- テスト環境については本文中に記載しています
- 使用方法で紹介しているショートコードやコードなどをコピーして使用すると、環境によっては記号などが文字化けすることがあります。コピーしたのに動作しない場合は特に「”」「’」などの記号を入力し直してみてください。
【Login Slider】プラグインの設定画面や表示の日本語化と翻訳
【Login Slider】プラグインは日本語化が可能な言語ファイルが同梱されており、翻訳してみましたが適用されないようです（設定項目が少ないので英語表記でも大丈夫だと思います）。
【Login Slider】プラグインのインストールと設定
インストール方法
インストールはプラグインの新規追加でプラグイン名で検索してインストールするか、ページ先頭の画像をクリックして表示されるWordpressのプラグイン公式配布ページがダウンロードしてからアップロードインストールします。
インストール方法の詳しい解説は
を参照ください
【Login Slider】プラグインの基本的な使い方
設定は「外観」→「カスタマイズ」を開き、出てくるカスタマイザーメニューの一番下に追加される「Login Slider」から行います。さまざまな項目については以下の通りです
Slidesメニュー
スライダー画像の設定を行います。最大で７枚までの画像をスライド表示させることができます。
設定項目は
- 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
- テーマ：Simplicity バージョン2.3.0g
- プラグインのバージョン：1.0.0
このプラグインの最新バージョンは現在Wordpress公式サイトに "login-slider" は存在しません（配布されていません）です。バージョンが異なる場合には設定の仕方や動作仕様が変更になっている可能性があります。
個人的な評価・感想ほか
- ５段階評価
- 設定のしやすさ：★★★★★
- 使いやすさ：★★★★☆
- おすすめ度：★★★★☆
多数のユーザーで投稿するタイプのサイトでなくても、ログイン画面に画像があるだけで何となくやる気になりますよ。モチベーションアップにおすすめのプラグインです。
Wordpressの本
Amazonの人気商品楽天市場の人気商品
いちばんやさしいWordPressの教本 第4版 5.x対応 人気講師が教 える本格Webサイトの作り方 (「いちばんやさしい教本」シリーズ) / 石川..
1,738 円 (税込)
基本情報ジャンル建築・理工フォーマット本出版社インプレス発売日2019年07月ISBN9784295006664発売国日本サイズ・ページ280p 21×19cm関連キーワード 9784295006664 出荷目安の詳細はこちら＞＞楽天市場内検索 『在庫あり』表記について
【中古】 ビジネスサイトをこれからつくる WordPressデザイン入門 WordPress Ver．4．x対応 サイト制作から納品までのはじめの一歩 ..
1,045 円 (税込)
秋元英輔(著者),清野奨(著者),プライム・ストラテジー株式会社(その他)販売会社/発売会社：SBクリエイティブ発売年月日：2016/02/01JAN：9784797383300／／付属品〜CD−ROM付
いつでもご相談・サイトカスタマイズの依頼を受け付けています
Wordpressのカスタマイズ、不具合解消のご相談はすべてココナラのダイレクトメッセージからお受けしております。まずはこちらのバナーからお気軽にお問い合わせください。
※一度もココナラを使ったことがない方はココナラへの無料登録が必要です。こちら
から登録後、上のリンクをクリックする、またはココナラトップページから「ひまあーと」を検索してお問い合わせください。
【スポンサーリンク】
記事の拡散にご協力をお願いします
閲覧いただきありがとうございました。役に立つ情報でしたら是非SNSでシェアをお願いします
