본문 바로가기

WordPress/Theme My Login

WordPress User Registration example

워드프레스(WordPress)에서 회원가입 플러그인 설정 예


https://wordpress.org/plugins/theme-my-login/


개요

Theme My Login 이라는 플러그인을 이용하여 회원가입, 로그인, 정보분실 요청을 처리하고 기본으로 제공하는 회원가입 폼을 개조하여 임의의 필드를 추가하는 방법을 알아보고자 한다



TML 설치

일반 플러그인을 설치하는 방법을 사용하여 설치하면 [페이지] 화면에서 5개의 TML 관련 페이지가 추가된 것을 확인할 수 있다

Log In, Log Out, Lost Password, Register, Reset Password

위와 같이 생성된 페이지들이 이용자의 회원가입, 로그인시에 사용된다



TML 설정

TML을 설치하면 관리자 패널 사이드바에 [TML] 메뉴가 추가되어 옵션을 설정할 수 있는 폼이 있고 이 폼을 통해 비밀번호도 회원가입 폼에 포함하도록 설정하는 등 몇가지 설정이 가능하다

TML > General > Login Type : E-mail only 설정시 이메일로만 로그인할 수 있다

TML > General > Modules : Enable Custom E-mail을 선택하면

TML > E-mail 항목을 선택하여 관리자 메일주소를 설정한다

TML > General > Enable User Moderation: 선택하면, TML > Moderation 항목에서 구체적인 중간확인절차를 선택해야 한다


TML > Moderation : 이용자가 사이트에 등록시 중간확인절차를 설정

  - None : 중간확인절차 없이 등록 완료됨

  - Email-Confirmation : 등록자의 메일로 인증메일을 보내서 응답이 있으면 등록 완료됨

  - Admin Approval : 관리자에게 메일이 발송되고 관리자가 승인하면 등록 완료됨



관리자 패널, 설정 > 일반

멤버쉽 : [누구가 가입할 수 있습니다] 설정



회원가입폼에 새로운 필드를 추가하는 절차

1. wp-content / plugins / theme-my-login / templates / register_form.php 파일을 

wp-content / themes / [사용 중인 테마 이름] / register_form.php 으로 복사해 넣고 다음과 같이 추가하고자 하는 필드를 입력한다

..........

   ..........

<p class="tml-user-grade-wrap">

<label for="user_grade<?php $template->the_instance(); ?>"><?php _e( 'Grade', 'theme-my-login' ); ?></label>

<input type="text" name="user_grade" id="user_grade<?php $template->the_instance(); ?>" class="input" value="<?php $template->the_posted_value( 'user_grade' ); ?>" size="20" />

</p>

   .......

..............


2. wp-content / plugins / theme-my-login-custom.php 파일을 생성하고 다음과 같이 코드를 작성한다


<?php

function tml_registration_errors( $errors ) {

if ( empty( $_POST['user_grade'] ) )

$errors->add( 'empty_user_grade', '<strong>ERROR</strong>: Please enter your grade.' );

return $errors;

}

add_filter( 'registration_errors', 'tml_registration_errors' );


function tml_user_register( $user_id ) {


if ( !empty( $_POST['user_grade'] ) ){

update_user_meta( $user_id, 'user_grade', $_POST['user_grade'] );

}

}

add_action( 'user_register', 'tml_user_register' );

?>


3. 위와 같이 설정한 후에 회원가입폼을 작성하고 전송하면 커스텀 필드의 값은 wp_users 테이블이 아니라 wp_usermeta 테이블에 저장되는데, meta_key 컬럼에 필드명이 저장되고, meta_value 컬럼에 필드의 값이 저장되며 wp_users 테이블과 wp_usermeta 테이블은 user_id 를 통해 서로 연결된다


4. 만약 회원가입시 커스텀 필드인 user_grade 값을 입력하지 않고 폼을 전송하면 이용자의 폼에 적색 경고 메시지가 출력된다. add_filter( 'registration_errors', 'tml_registration_errors' ); 문장을 통해 오류발생시 필터함수가 실행될 수 있기 때문이다.



회원가입 폼, 로그인 폼 디자인 편집

wp-content/plugins/theme-my-login/templates/ 폴더에서 login-form.php, register-form.php 파일을 에디터로 열고 편집하면 된다

편집을 위해 파일을 에디터로 열면 다음과 같은 안내글이 상단에 주석으로 처리되어 있으므로 참조하면 된다

/*

If you would like to edit this file, copy it to your current theme's directory and edit it there.

Theme My Login will always look in your theme's directory first, before using this default template.

*/



회원가입에서 로그인까지 절차

위와같이 설정한 후에 일반 사용자로 사이트에 접속하여 회원에 가입하기 위하여 Register 페이지를 연다

회원가입 폼에서 이메일, 비번, 비번 확인란에 입력하고 Register 버튼을 누르면 입력된 이메일을 확인하는 인증메일이 전송된다

이용자는 자신의 이메일에 접속하여 수신된 이메일을 열고 포함된 확인링크를 누르면 입력한 이용자 계정이 활성화되며 로그인 폼으로 전환된다

로그인 폼에 이메일 주소와 비번을 입력하고 Login 버튼을 누르면 로그인 절차가 완료된다


위와같이 로그인시에 Email 주소를 사용하려면 TML설정화면에서 Login Type 항목에서 Email Only를 선택하면 된다

회원가입시 사이트에서 임시 비번을 메일로 전송하지 않고 이용자가 커스텀 비번을 직접 입력하도록 하려면 TML 설정화면에서 Enable Custom Passwords 항목을 선택하면 된다



TML 참조문서