WordPressで任意のページにログインフォームを設置して、ログイン失敗時にそのページに留まるようにする方法

WordPressで任意のページにログインフォームを設置して、ログイン失敗時にそのページに留まるようにする方法

WordPressで任意のページにログインフォームを設置して、ログイン失敗時にそのページに留まるようにする方法

WordPressサイトで任意のページにログインフォームを設置する方法をご紹介いたします。

また、任意のページにログインフォームを設置したとしても、そのままだとログイン失敗時にログイン画面(wp-login.php)に遷移してしまうので、ログイン画面に遷移するのを防いでその場に留まる方法も併せてご紹介いたします。

今回設置するログインフォームの要件

  • 任意のページにログインフォームを表示
  • ログインユーザーにのみコンテンツを表示
  • ログイン失敗時にログイン画面に遷移しない
  • ログイン失敗時はエラーメッセージを表示する
  • 通常のログイン画面(wp-login.php)も機能させる

任意の場所にログインフォームを設置する

任意の場所にログインフォームを設置するには、wp_login_form関数を利用します。ログインフォームを設置したい箇所に、以下のようなコードを追加しましょう。

<?php if (is_user_logged_in()) : ?>
  ※ログインユーザーに表示するコンテンツ
<?php else : ?>
  <div class="loginform">
    <h2 class="loginform__title">ユーザーログイン</h2>
    <div class="loginform__content">
      <?php wp_login_form(); ?>
    </div>
    <?php if (!empty($_GET['login']) && $_GET['login'] === 'failed') : ?>
      <p class="loginform__error">ユーザー名もしくはパスワードが間違っています</p>
    <?php endif; ?>
  </div>
<?php endif; ?>

「wp_login_form()」の部分にログインフォームが表示されます。.loginform__errorの部分は、ログイン失敗時に表示されるエラーメッセージです。

wp_login_form関数にはパラメータも用意されています。詳細については公式ドキュメントをご参照ください。

ログイン失敗時の処理を追加する

上記のままでもユーザーログイン自体は機能しますが、ログイン失敗時の処理を追加していきます。

適用しているテーマのfunctions.phpに以下コードを追加します。コピペでOKです。

function my_authenticate($user, $username, $password) {
  if (empty($username) || empty($password)) {
    do_action('wp_login_failed', $user);
  }
  return $user;
}
add_filter('authenticate', 'my_authenticate', 10, 3);

function my_login_failed($username) {
  if (!isset($username) || is_wp_error($username) || !isset($password) || is_wp_error($password)) {
    if (isset($_REQUEST['redirect_to']) && isset($_SERVER['HTTP_REFERER'])) {
      $page = $_SERVER['HTTP_REFERER'];
      $failed = '?login=failed';
      if (!empty($page) && !preg_match('/wp-admin/', $page) && !preg_match('/wp-login/', $page)) {
        if (!preg_match('/login=failed/', $page)) {
          $page .= $failed;
        }
        wp_redirect($page);
        exit;
      }
    }
  }
}
add_action('wp_login_failed', 'my_login_failed');

上記を追加することで、ログイン失敗時にログイン画面に遷移せずその場に留まるようになります。

ログイン失敗時は、URLに「?login=failed」というパラメータが追加されます。これにより、ログイン失敗を判別してエラーメッセージを表示しています。ちなみに、「if (!preg_match(‘/login=failed/’, $page))」の部分で、連続してログイン失敗した時にパラメータが多重に追加されるのを防いでいます。

なお、通常のログイン画面(wp-login.php)では、ログイン失敗時に「?login=failed」は追加されません。

番外編:管理画面へのアクセスを制限する

上述した内容でログインフォームの設置は完了なのですが、特定の権限ではログイン画面にアクセスできないようにする方法もご紹介いたします。

ログインしないと閲覧できないページがあるけど管理画面は必要ない、といったケースもあるかと思います。そういったケースでは、権限グループによって管理画面へのアクセスを制限することで実現できます。

以下のコードをfunctions.phpに追加すると、購読者権限のユーザーは管理画面へアクセスしようとしてもトップページにリダイレクトされます。

//購読者は管理画面にアクセス不可
function my_auth_redirect() {
  if (current_user_can('subscriber')) {
    wp_redirect(home_url());
    exit();
  }
}
add_action('auth_redirect', 'my_auth_redirect');

current_user_canの部分で指定できる権限グループの種類は以下の通りです。

administrator 管理者
editor 編集者
author 投稿者
contributor 寄稿者
subscriber 購読者

あとがき

任意のページにログインフォームを設置するケースはそんなにないかもしれませんが、上述した方法を覚えておくといざという時に便利です。参考になれば幸いです。

この記事が気に入ったら
いいね!してね♪

Twitter で

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です