ログイン画面の変更、ログインログアウト後の画面変更 WordPressでログインしたユーザーにしか見えないページを作る方法 その2

「WordPressでログインしたユーザーにしか見えないページを作る方法 その1」ではテンプレートを使って、ログインしたユーザーにだけ見せるページの作り方について書きました。
管理者ではなく購読者がログインするようになるとログイン画面やログイン後のページ遷移などいろいろ気になってくるところがあります。
今回はそれらについてどうやって対応するかについて書きます。

ログイン画面のロゴを変更する方法

ログイン画面は通常、

このようにWordPressのロゴが表示されています。WordPressでつくられたサイトを管理しなれていると特に何とも思わないのですが、サイトのお客さんがログインするときにこの画面だとちょっと面食らってしまわれる可能性があります。

ということでログイン画面のロゴを変えてみたいと思います。

↓こちらのページを参考にさせていただきました
WordPress:ログイン画面のWordPressロゴマークを変更する

ロゴを変更するだけでなくロゴに付いているリンク(知らなかった)やtitle属性の変更のことまで細かく考慮されています。

ロゴ画像を変更する


ロゴで使いたい画像
を準備します。

こんな感じで縦100px横320pxの画像を作ってみました。これを使っている子テーマの好きなところ(imageフォルダなどがあったらそこに入れると良いかもしれません)に入れておきます。今回はSimplicityの子テーマ、Simplicity-childを使ったのでその中にあるimagesフォルダに入れました。
* ログイン部分の幅が320pxだったので画像を320pxにするとぴたっとはまります

ロゴ画像を変更するコードを子テーマのfunctions.phpに書く


ロゴ画像を変更するコード
子テーマのfunctions.phpに書きます。

getbloginfo 子テーマなので stylesheet_directory としました。
ロゴの名前自分が保存したフォルダとファイル名に変更しました。
ロゴの大きさが元の大きさと違うので width320px;height:100px; を追加しました。

これで表示すると、

こんな感じにロゴが変わり、ログインする人に違和感を与えないようになりました(^^)/

リンク先とtitleを変更する

仕上げにリンク先とtitleを変更します。

今は

ロゴ画像にカーソルを載せると Powered by WordPress と表示され、クリックすると、

WordPressの日本語サイトに飛んでしまいます。このままだとやはりサイトを訪れた方に違和感をもたれそうなので変更します。

子テーマのfunctions.php

このように追加します(参考サイトのそのままです!ありがとうございます)。すると、

ロゴの上にカーソルを載せたときにサイトのタイトルになりました(^^)/

クリックしたときのURLを変更するには、

このように追加します(参考サイトのそのままです!ありがとうございます)。すると、

クリックしたときに、自サイトのトップページに遷移するようになりました!

ログイン後のページ移動とログアウト後のページ移動

ログイン後のページはダッシュボードになります。また、ログアウトした後はログイン画面になります。

このままだと見るだけの人にとっては「???」な感じになりそうなので、変更したいと思います。

以前書いた「WordPressでFacebookログインができるGianism 好きな場所にボタンを表示する」という記事でログインとログアウト後のページ移動についてはカスタマイズしたことがあるのですが、今回はゲストユーザーさん(権限グループが購読者)の場合だけ、移動するページを変更したいと思います。

WordPress権限グループについて

WordPressの権限グループがどのような値なのかを調べてみました。

オプション設定リファレンス WordPress Codex

このページにある

という文字列で判定できそうです。

ログインした後のページをダッシュボードからトップページに変更する

子テーマのfunctions.phpに以下のコードを追加します。

先ほど調べた購読者のrole(subscriber)だったときはログイン後、home_url()でトップページに移動します。それ以外の場合は元々のURL redirect_to に移動します。

ログアウトしたときにログイン画面ではなくトップページに移動する

子テーマのfunctions.phpに以下のコードを追加します。

先ほど調べた購読者のrole(subscriber)だったときはログイン後、home_url()でトップページに移動します。それ以外の場合は元々のURL redirect_to に移動します。

functionは一つでできるようでした。。

あれ?ログインとログアウトのfunctionがまったく同じコードでした。ということは、

これで良さそうです。このように変更したところ、これでもうまく動作していました(^^)/

説明が長くなってしまいました!つづきはまた書きます

今回残りの懸案事項について一気に書こうと思っていたのですが思わず長くなってしまいました。

ということで残りの、

・購読者がログイン済みのとき、ツールバーを表示するのではなく、サイドバーにログアウトとプロフィール変更のリンクを付けたい
・ユーザーの新規登録ができるようにしたいけど、自動認証ではなく一旦管理者が確認して承認したい

についてはまた別途、書きたいと思います(^^)/

兎本美佳
ブログを見た人がそのままできたらいいなと思って、できるだけ丁寧に書いています。blogに書いたようなネタの有償対応のご相談は「ゆうそうと」へいただければと思います(^^)/ 無償での対応をご希望の場合は、コメントをいただけましたら可能な場合はコメントを返させていただきます。

シェアする

  • このエントリーをはてなブックマークに追加

フォローする

スポンサーリンク
スポンサー広告
トップへ戻る