워드프레스 로그인 페이지 수정하기

Last Updated: 2023년 07월 16일 | | 16개 댓글

들어가며

이전 글에서 플러그인을 사용하지 않고 워드프레스 기본 로그인 폼/등록 폼을 멋지게 바꾸는 방법을 살펴보았습니다. 이전 글에서는 별도의 CSS 파일을 만들지 않고 테마 함수 파일(functions.php) 내에서 코드를 입력하는 방법으로 워드프레스 기본 로그인 화면을 수정하는 방법을 설명했습니다.

워드프레스 기본 로그인 커스터마이징 코드 샘플

예를 들어 다음과 같은 간단한 코드를 함수 파일에 추가할 수 있습니다.

// 워드프레스 기본 로그인 페이지 커스터마이징
function my_login_logo() { ?>
<style type="text/css">
body.login div#login h1 a {
display: none; // 워드프레스 기본 로고를 없앰. 새로운 로고로 대체하는 방법은 이 글을 참고하세요.
}
body.login.login-action-login {
background-color: #374433;
}

form#loginform {
border-radius: 10px;
}
body.login.login-action-login,
.login.login-action-register,
.login.login-action-lostpassword {
background: url(bakcground.jpg) no-repeat center center fixed!important; // 배경 이미지. 실제 사용할 배경 이미지 경로로 교체
-moz-background-size: cover!important;
-webkit-background-size: cover!important;
-o-background-size: cover!important;
background-size: cover!important;
}

.login #backtoblog a, .login #nav a {
text-decoration: none;
color: #ffffff;
}

</style>
<?php }
add_action( 'login_enqueue_scripts', 'my_login_logo' );

그러면 로그인 페이지(예: www.example.com/wp-login.php)에 접속하면 다음과 비슷하게 로그인 페이지가 바뀝니다(배경은 임의로 지정한 것으로 적절한 배경으로 바꾸시기 바랍니다). 위의 코드를 테마 함수에 추가하는 방법은 이 글을 참고하세요.

Change login page in WordPress

글자 색상이나 박스 라운딩 등은 CSS 코드를 적절히 수정하셔서 조정하시면 됩니다. 그리고 "사용자명이나 이메일 주소"와 같은 문구도 "ID" 등으로 바꿀 수 있습니다. 이에 대한 내용은 워드프레스 회원가입 폼/로그인 폼에서 “사용자명”을 “아이디”로 바꾸기 글을 참고해보시기 바랍니다. 이외에도 로그인/등록 페이지와 관련하여 다양한 커스터마이징이 이 블로그에 수록되어 있습니다.

다른 방법

만약 로그인 폼을 새롭게 만들고 싶은 경우(예를 들어 별도의 플러그인을 사용하지 않고 사이드바에 로그인 폼을 넣고자 하는 경우, 또는 새로운 나만의 로그인 페이지를 만들고자 하는 경우) 다음 글을 참고해보시기 바랍니다.

링크된 글에서는 <?php wp_login_form(); ?>을 사용하여 새롭게 로그인 페이지를 만들고, 새로운 로그인 페이지를 만들었을 경우 발생할 수 있는 여러 가지 문제에 대응하여 적절히 수정하는 방법을 설명합니다. wp_login_form()에 대한 자세한 내용은 WordPress Codex 페이지와 개발자 페이지를 참조하십시오.

그리고 이 wpmudev 글에서는 CSS를 사용자 테마 함수에 넣는 대신 새로운 CSS 스타일시트를 만들어서 적용하는 방법을 설명하고 있습니다. 이외에도 "비밀번호를 잃어버렸나요" 링크와 "~로 돌아가기" 링크를 없애는 방법이 추가되어 있습니다. (사실 이런 내용은 맨 위의 코드에 적절한 CSS 코드를 삽입하여 쉽게 해결이 가능한 부분입니다.)

로고 URL 변경

이외에 유용한 코드로, 다음 코드를 사용하면 로고 URL을 변경할 수 있습니다. 워드프레스 로그인 페이지의 로고를 클릭하면 wordpress.org로 연결됩니다. 이 URL을 변경하는 방법이 이 블로그의 이 글에도 설명되어 있습니다.

function my_login_logo_url() {
return get_bloginfo( 'url' );
}
add_filter( 'login_headerurl', 'my_login_logo_url' );

function my_login_logo_url_title() {
return 'Your Site Name and Info';
}
add_filter( 'login_headertitle', 'my_login_logo_url_title' );

위의 코드를 함수 파일(functions.php)에 추가하면 로고를 클릭하면 자신의 홈페이지로 이동합니다.

로그인 오류 메시지 표시되지 않도록 하기

로그인 오류 시 "유효하지 않은 사용자 이름" 또는 "사용자이름이나 이메일 주소가 올바르지 않습니다." 같은 오류 메시지가 표시됩니다.  이 오류 메시지는 매우 유용하지만 해커에 의해 악용될 수 잇다고 하네요. 이런 점이 우려가 되면 로그인 에러(오류) 메시지가 표시되지 않도록 다음 코드를 사용할 수 있습니다.

function login_error_override()
{
return 'Incorrect login details.';
}
add_filter('login_errors', 'login_error_override');

마치며

위에 설명한 방법에 따라 코드를 테마 함수 파일에 추가하고 수정하는 작업이 쉽지 않은 경우 적당한 플러그인을 사용하실 수 있습니다. 다양한 플러그인을 테스트하여 마음에 드는 것을 사용하시기 바랍니다. 유료 플러그인으로는 UserPro, UPME(User Profiles Made Easy) 등 여러 가지가 있습니다.

16 개 댓글

Leave a Comment

  1. 수고하십니다.
    eduma 테마를 작업중입니다.테마를 만든회사에 문의해도 정확한 답변이 없어서 문의드립니다.
    윗젯 팝업 로그인페이지에 회원가입(Register now) url을 변경하고싶은데 팝업 어디를 수정해야되는지 한달째 고민중입니다.(자체 윗젯에는 url 페이지변경 기능이 없습니다)
    변경url-->http://angol6.cafe24.com/account-2/
    login-popup.php 여기서 수정이 가능한지 문의드립니다.-------------->
    <code>
    array( 'thim_widget_group' ),
    'panels_icon' => 'thim-widget-icon thim-widget-icon-login-popup'
    ),
    array(),
    array(
    'text_register' => array(
    'type' => 'text',
    'label' => esc_html__( 'Register Label', 'eduma' ),
    'default' => 'Register',
    ),
    'text_login' => array(
    'type' => 'text',
    'label' => esc_html__( 'Login Label', 'eduma' ),
    'default' => 'Login',
    ),
    'text_logout' => array(
    'type' => 'text',
    'label' => esc_html__( 'Logout Label', 'eduma' ),
    'default' => 'Logout',
    ),
    'text_profile' => array(
    'type' => 'text',
    'label' => esc_html__( 'Profile Label', 'eduma' ),
    'default' => 'Profile',
    ),
    'layout' => array(
    'type' => 'select',
    'label' => esc_html__( 'Layout', 'eduma' ),
    'default' => 'base',
    'options' => array(
    'base' => esc_html__( 'Default', 'eduma' ),
    'icon' => esc_html__( 'Icon', 'eduma' ),
    ),
    ),
    'captcha' => array(
    'type' => 'checkbox',
    'label' => esc_html__( 'Use captcha?', 'eduma' ),
    'description' => esc_html__( 'Use captcha in register and login form.', 'eduma' ),
    'default' => false
    ),
    'term' => array(
    'type' => 'text',
    'label' => esc_html__( 'Terms of Service link', 'eduma' ),
    'description' => esc_html__( 'Leave empty to disable this field.', 'eduma' ),
    'default' => '',
    ),
    'shortcode' => array(
    'type' => 'text',
    'label' => esc_html__( 'Shortcode', 'eduma' ),
    'description' => esc_html__( 'Enter shortcode to show in form Login.', 'eduma' ),
    'default' => '',
    )

    )
    );
    }

    /**
    * Initialize the CTA widget
    */
    function get_template_name( $instance ) {
    $this->ins = $instance;
    add_action( 'wp_footer', array( $this, 'thim_display_login_popup_form' ), 5 );

    return 'base';
    }

    function get_style_name( $instance ) {
    return false;
    }

    function thim_display_login_popup_form() {
    global $wp;
    $instance = $this->ins;

    if ( ! is_user_logged_in() ) {
    $registration_enabled = get_option( 'users_can_register' );
    ?>

    <div
    class="thim-login-container">

    <form name="loginpopopform"
    action=""
    method="post">

    <input type="text" name="log"
    placeholder=""
    class="input required" value="" size="20"/>

    <input type="password" name="pwd"
    placeholder=""
    class="input required" value="" size="20"/>

    <input type="text" data-captcha1=""
    data-captcha2=""
    placeholder=""
    class="captcha-result required"
    name="thim-eduma-recaptcha-rs"/>
    <input name="thim-eduma-recaptcha[]" type="hidden"
    value=""/>
    <input name="thim-eduma-recaptcha[]" type="hidden"
    value=""/>

    <?php echo '<a href="' . thim_get_lost_password_url() . '" title="' . esc_attr__( 'Lost Password', 'eduma' ) . '" rel="nofollow ugc">' . esc_html__( 'Lost your password?', 'eduma' ) . '</a>'; ?>

    <input type="submit" name="wp-submit"
    class="button button-primary button-large"
    value=""/>
    <input type="hidden" name="redirect_to"
    value=""/>

    <input type="hidden" name="nonce"
    value=""/>

    <?php

    if ( $registration_enabled ) {
    echo '' . esc_html__( 'Not a member yet? ', 'eduma' ) . ' <a href="' . esc_url( thim_get_register_url() ) . '" rel="nofollow ugc">' . esc_html__( 'Register now', 'eduma' ) . '</a>';
    }
    ?>

    <form class="" name="registerformpopup"
    action=""
    method="post" novalidate="novalidate">

    <input placeholder=""
    type="text" name="user_login" class="input required"/>

    <input placeholder=""
    type="email" name="user_email" class="input required"/>

    <input placeholder=""
    type="password" name="password" class="input required"/>

    <input
    placeholder=""
    type="password" name="repeat_password" class="input required"/>

    <input type="text"
    data-captcha1=""
    data-captcha2=""
    placeholder=""
    class="captcha-result required"/>

    <?php printf( __( 'I accept the <a href="%s" rel="nofollow ugc">Terms of Service</a>', 'eduma' ), esc_url( $instance['term'] ) ); ?>

    <input type="submit" name="wp-submit"
    class="button button-primary button-large"
    value=""/>

    <input type="hidden" name="redirect_to"
    value=""/>
    <!---->

    <?php echo '' . esc_html_x( 'Are you a member? ', 'Login popup form', 'eduma' ) . ' <a href="' . esc_url( thim_get_login_page_url() ) . '" rel="nofollow ugc">' . esc_html_x( 'Login now', 'Login popup form', 'eduma' ) . '</a>'; ?>

    <i></i>

    <i></i><i></i><i></i><i></i>

    <?php
    }
    }
    }
    }

    function thim_login_popup_widget() {
    register_widget( 'Thim_Login_Popup_Widget' );

    }

    add_action( 'widgets_init', 'thim_login_popup_widget' );</code>

    응답

  2. 질문이 있습니다.
    컴퓨터는 잘 모릅니다만, 인터넷신문을 운영중인데요.
    러시아(우크라이나)로 추정되는 자들의 들어와서 불경스러운 문장을 넣고 가는 경욱 하루에 5~6차례가 있어 괴롭습니다.
    또한 댓글을 끊임없이 영어로 쓸데 없는 내용과 수량으로 붙여놔 댓글을 아예 막아놓았습니다.
    혹시, 전문가 선생님이나 선배님들이 계시면 도움을 주시기 바랍니다.
    고맙습니다.
    == Personal information deleted == 뉴스아이신문 드림

    응답