워드프레스 커스텀 로그인 페이지 (with PHP)

워드프레스 로그인 페이지에 다들 익숙한데 바로 /wp-admin , wp-login.php입니다. 보기 좋고 잘 작동합니다. 하지만 클라이언트는 대부분 디자인을 통합되게 구성하고싶어 하기 때문에 커스텀된 로그인 페이지를 원합니다. 그럼 어떻게 커스텀 로그인 페이지를 구성하는가? Let’s go

사용자 정의 로그인 페이지

먼저 로그인 페이지에 대한 사용자 정의 템플릿을 제작해야합니다.

/**
* Template Name: 로그인 페이지
*
* @package WordPress
* @subpackage Twenty_Fourteen
* @since Twenty Fourteen 1.0
*/Code language: PHP (php)

로그인 양식

$args = array (
    'redirect' => home_url(),
    'id_username' => 'user',
    'id_password' => 'pass',
)
wp_login_form( $args );Code language: PHP (php)

check

이 시점에서 로그인 페이지는 작동합니다. 로그인 시도를 할 수 있으며 성공하면 redirect 위 의 매개변수로 지정한 URL로 redirect 됩니다.

하지만 몇가지 해결해야 합니다.

wp-login.php 페이지는 여전히 작동합니다

고객에게 통합된 경험을 제공하라면 새 로그인 페이지로 redirect하는 것이 좋습니다.

function redirect_login_page() {
  $login_page  = home_url( '/login/' );
  $page_viewed = basename($_SERVER['REQUEST_URI']);
 
  if( $page_viewed == "wp-login.php" && $_SERVER['REQUEST_METHOD'] == 'GET') {
    wp_redirect($login_page);
    exit;
  }
}
add_action('init','redirect_login_page');Code language: PHP (php)

$login_page 변수를 자신의 로그인 페이지로 변경

로그인이 실패한다면?

잘못된 사용자 및 암호 조합을 제출하거나 빈 필드를 제출할 때 오류가 발생합니다.

function login_failed() {
  $login_page  = home_url( '/login/' );
  wp_redirect( $login_page . '?login=failed' );
  exit;
}
add_action( 'wp_login_failed', 'login_failed' );
 
function verify_username_password( $user, $username, $password ) {
  $login_page  = home_url( '/login/' );
    if( $username == "" || $password == "" ) {
        wp_redirect( $login_page . "?login=empty" );
        exit;
    }
}
add_filter( 'authenticate', 'verify_username_password', 1, 3);Code language: PHP (php)

이 두 가지 기능은 실패시 사용자를 리디렉션하고 또는 login 값이 있는 URL에 쿼리 문자열을 추가합니다. failed empty

로그아웃할 때로 리디렉션된다. 해당 URL지정

function logout_page() {
  $login_page  = home_url( '/login/' );
  wp_redirect( $login_page . "?login=false" );
  exit;
}
add_action('wp_logout','logout_page');Code language: PHP (php)

에러 메시지

URL에 입력한 쿼리 문자열을 사용하여 메세지를 보여줍니다.

로그인 쿼리 문자열에서 값을 얻어서

$login = ( isset($_GET['login']) ) ? $_GET['login'] : 0;Code language: PHP (php)

위의 코드는 login 변수에 값이 포함되어 있는지 확인하고, 그렇지 않으면 0으로 설정합니다. 그런 다음 $error값에 따라 다른 알림 메시를 표시합니다.

if ( $login === "failed" ) {
  echo '<p class="login-msg"><strong>ERROR:</strong> Invalid username and/or password.</p>';
} elseif ( $login === "empty" ) {
  echo '<p class="login-msg"><strong>ERROR:</strong> Username and/or Password is empty.</p>';
} elseif ( $login === "false" ) {
  echo '<p class="login-msg"><strong>ERROR:</strong> You are logged out.</p>';
}Code language: HTML, XML (xml)