웹 사이트 프런트 엔드에 WordPress 사용자 등록 양식을 표시하는 방법은 무엇입니까?

블로그 프런트 엔드에 WordPress 사용자 등록 양식 ( "www.mywebsite.com/wp-register.php"페이지에 나타나는 양식)을 표시하는 방법은 무엇입니까?

등록 양식을 사용자 정의했습니다. 그러나 프론트 엔드 페이지에서 해당 양식을 호출하는 방법을 모릅니다. 모든 지원은 정말 큰 도움이 될 것입니다.

미리 감사드립니다. :)

이 과정에는 2 단계가 포함됩니다.

1. 프론트 엔드 양식을 보여
2. 제출시 데이터 저장

프론트 엔드를 보여주기 위해 3 가지 다른 접근법이 있습니다.

• 내장 된 등록 양식, 편집 스타일 등을 사용하여보다 "프론트 엔드"
• 워드 프레스 페이지 / 포스트를 사용하고 단축 코드를 사용하여 양식을 표시하십시오.
• 페이지 / 포스트와 연결되지 않지만 특정 URL에 의해 호출되는 전용 템플릿 사용

이 답변을 위해 후자를 사용하겠습니다. 그 이유는 다음과 같습니다.

• 내장 된 등록 양식을 사용하는 것은 좋은 생각이 될 수 있습니다. 내장 양식을 사용하면 깊은 사용자 정의가 매우 어려울 수 있으며 양식 필드를 사용자 정의하려는 경우 통증이 증가합니다.
• WordPress 페이지를 짧은 코드와 함께 사용하면 신뢰할 수 없으며 shorcodes는 형식화 등의 기능을 위해 사용해서는 안된다고 생각합니다.

1 : URL 작성

우리 모두는 WordPress 사이트의 기본 등록 양식이 종종 스패머의 대상이라는 것을 알고 있습니다. 맞춤 URL을 사용하면이 문제를 해결할 수 있습니다. 또한 변수 URL을 사용하고 싶습니다 . 즉 등록 양식 url이 항상 동일해서는 안됩니다. 이렇게하면 스패머의 수명이 어려워집니다. 트릭은 URL에서 nonce 를 사용하여 수행됩니다 .

/**
* Generate dynamic registration url
*/
function custom_registration_url() {
  $nonce = urlencode( wp_create_nonce( 'registration_url' ) );
  return home_url( $nonce );
}

/**
* Generate dynamic registration link
*/
function custom_registration_link() {
  $format = '<a href="%s">%s</a>';
  printf(
    $format,
    custom_registration_url(), __( 'Register', 'custom_reg_form' )
  );
}

이 기능을 사용하면 동적 인 경우에도 등록 양식에 대한 링크를 템플릿에 쉽게 표시 할 수 있습니다.

2 : URL의 첫 번째 스텁 인식 Custom_Reg\Custom_Reg클래스를

이제 URL을 인식해야합니다. pourpose를 위해 클래스 작성을 시작하겠습니다. 나중에 답변에서 끝날 것입니다.

<?php
// don't save, just a stub
namespace Custom_Reg;

class Custom_Reg {

  function checkUrl() {
    $url_part = $this->getUrl();
    $nonce = urlencode( wp_create_nonce( 'registration_url' ) );
    if ( ( $url_part === $nonce ) ) {
      // do nothing if registration is not allowed or user logged
      if ( is_user_logged_in() || ! get_option('users_can_register') ) {
        wp_safe_redirect( home_url() );
        exit();
      }
      return TRUE;
    }
  }

  protected function getUrl() {
    $home_path = trim( parse_url( home_url(), PHP_URL_PATH ), '/' );
    $relative = trim(str_replace($home_path, '', esc_url(add_query_arg(array()))), '/');
    $parts = explode( '/', $relative );
    if ( ! empty( $parts ) && ! isset( $parts[1] ) ) {
      return $parts[0];
    }
  }

}

이 함수는 url의 첫 번째 부분을보고 home_url()nonce와 일치하면 TRUE를 반환합니다. 이 함수는 요청을 확인하고 양식을 표시하기 위해 필요한 조치를 수행하는 데 사용됩니다.

3 : Custom_Reg\Form수업

이제 폼 마크 업을 생성하는 클래스를 작성하겠습니다. 양식을 표시하는 데 사용해야하는 템플릿 파일 경로를 속성에 저장하는데도 사용합니다.

<?php 
// file: Form.php
namespace Custom_Reg;

class Form {

  protected $fields;

  protected $verb = 'POST';

  protected $template;

  protected $form;

  public function __construct() {
    $this->fields = new \ArrayIterator();
  }

  public function create() {
    do_action( 'custom_reg_form_create', $this );
    $form = $this->open();
    $it =  $this->getFields();
    $it->rewind();
    while( $it->valid() ) {
      $field = $it->current();
      if ( ! $field instanceof FieldInterface ) {
        throw new \DomainException( "Invalid field" );
      }
      $form .= $field->create() . PHP_EOL;
      $it->next();
    }
    do_action( 'custom_reg_form_after_fields', $this );
    $form .= $this->close();
    $this->form = $form;
    add_action( 'custom_registration_form', array( $this, 'output' ), 0 );
  }

  public function output() {
    unset( $GLOBALS['wp_filters']['custom_registration_form'] );
    if ( ! empty( $this->form ) ) {
      echo $this->form;
    }
  }

  public function getTemplate() {
    return $this->template;
  }

  public function setTemplate( $template ) {
    if ( ! is_string( $template ) ) {
      throw new \InvalidArgumentException( "Invalid template" );
    }
    $this->template = $template;
  }

  public function addField( FieldInterface $field ) {
    $hook = 'custom_reg_form_create';
    if ( did_action( $hook ) && current_filter() !== $hook ) {
      throw new \BadMethodCallException( "Add fields before {$hook} is fired" );
    }
    $this->getFields()->append( $field );
  }

  public function getFields() {
    return $this->fields;
  }

  public function getVerb() {
    return $this->verb;
  }

  public function setVerb( $verb ) {
    if ( ! is_string( $verb) ) {
     throw new \InvalidArgumentException( "Invalid verb" );
    }
    $verb = strtoupper($verb);
    if ( in_array($verb, array( 'GET', 'POST' ) ) ) $this->verb = $verb;
  }

  protected function open() {
    $out = sprintf( '<form id="custom_reg_form" method="%s">', $this->verb ) . PHP_EOL;
    $nonce = '<input type="hidden" name="_n" value="%s" />';
    $out .= sprintf( $nonce,  wp_create_nonce( 'custom_reg_form_nonce' ) ) . PHP_EOL;
    $identity = '<input type="hidden" name="custom_reg_form" value="%s" />';
    $out .= sprintf( $identity,  __CLASS__ ) . PHP_EOL;
    return $out;
  }

  protected function close() {
    $submit =  __('Register', 'custom_reg_form');
    $out = sprintf( '<input type="submit" value="%s" />', $submit );
    $out .= '</form>';
    return $out;
  }

}

클래스는 create각각에 대해 호출 메소드를 추가 한 모든 필드를 반복하는 양식 마크 업을 생성 합니다. 각 필드는의 인스턴스 여야합니다 Custom_Reg\FieldInterface. nonce 검증을 위해 추가 숨겨진 필드가 추가됩니다. 양식 방법은 기본적으로 'POST'이지만 setVerb방법을 사용하여 'GET'으로 설정할 수 있습니다 . 마크 업이 생성되면 메서드 $form에 의해 에코되는 객체 속성 내에 저장 output()되고 'custom_registration_form'후크에 연결됩니다 . 양식 서식 파일에서 간단히 호출 do_action( 'custom_registration_form' )하면 양식이 출력됩니다.

4 : 기본 템플릿

내가 말했듯이 폼의 템플릿은 쉽게 재정의 될 수 있지만 대체 템플릿으로 기본 템플릿이 필요합니다. 여기에는 실제 템플릿보다 개념 증명이 더 거친 매우 거친 템플릿을 작성했습니다.

<?php
// file: default_form_template.php
get_header();

global $custom_reg_form_done, $custom_reg_form_error;

if ( isset( $custom_reg_form_done ) && $custom_reg_form_done ) {
  echo '<p class="success">';
  _e(
    'Thank you, your registration was submitted, check your email.',
    'custom_reg_form'
  );
  echo '</p>';
} else {
  if ( $custom_reg_form_error ) {
    echo '<p class="error">' . $custom_reg_form_error  . '</p>';
  }
  do_action( 'custom_registration_form' );
}

get_footer();

5 : Custom_Reg\FieldInterface인터페이스

모든 필드는 다음 인터페이스를 구현하는 객체 여야합니다.

<?php 
// file: FieldInterface.php
namespace Custom_Reg;

interface FieldInterface {

  /**
   * Return the field id, used to name the request value and for the 'name' param of
   * html input field
   */
  public function getId();

  /**
   * Return the filter constant that must be used with
   * filter_input so get the value from request
   */
  public function getFilter();

  /**
   * Return true if the used value passed as argument should be accepted, false if not
   */
  public function isValid( $value = NULL );

  /**
   * Return true if field is required, false if not
   */
  public function isRequired();

  /**
   * Return the field input markup. The 'name' param must be output 
   * according to getId()
   */
  public function create( $value = '');
}

의견은이 인터페이스를 구현하는 클래스가 무엇을 해야하는지 설명한다고 생각합니다.

6 : 일부 필드 추가

이제 몇 가지 필드가 필요합니다. 필드 클래스를 정의하는 'fields.php'라는 파일을 만들 수 있습니다.

<?php
// file: fields.php
namespace Custom_Reg;

abstract class BaseField implements FieldInterface {

  protected function getType() {
    return isset( $this->type ) ? $this->type : 'text';
  }

  protected function getClass() {
    $type = $this->getType();
    if ( ! empty($type) ) return "{$type}-field";
  }

  public function getFilter() {
    return FILTER_SANITIZE_STRING;
  }

  public function isRequired() {
    return isset( $this->required ) ? $this->required : FALSE;
  }

  public function isValid( $value = NULL ) {
    if ( $this->isRequired() ) {
      return $value != '';
    }
    return TRUE;
  }

  public function create( $value = '' ) {
    $label = '<p><label>' . $this->getLabel() . '</label>';
    $format = '<input type="%s" name="%s" value="%s" class="%s"%s /></p>';
    $required = $this->isRequired() ? ' required' : '';
    return $label . sprintf(
      $format,
      $this->getType(), $this->getId(), $value, $this->getClass(), $required
    );
  }

  abstract function getLabel();
}


class FullName extends BaseField {

  protected $required = TRUE;

  public function getID() {
    return 'fullname';
  }

  public function getLabel() {
    return __( 'Full Name', 'custom_reg_form' );
  }

}

class Login extends BaseField {

  protected $required = TRUE;

  public function getID() {
    return 'login';
  }

  public function getLabel() {
    return __( 'Username', 'custom_reg_form' );
  }
}

class Email extends BaseField {

  protected $type = 'email';

  public function getID() {
    return 'email';
  }

  public function getLabel() {
    return __( 'Email', 'custom_reg_form' );
  }

  public function isValid( $value = NULL ) {
    return ! empty( $value ) && filter_var( $value, FILTER_VALIDATE_EMAIL );
  }
}

class Country extends BaseField {

  protected $required = FALSE;

  public function getID() {
    return 'country';
  }

  public function getLabel() {
    return __( 'Country', 'custom_reg_form' );
  }
}

기본 클래스를 사용하여 기본 인터페이스 구현을 정의했지만 인터페이스를 직접 구현하거나 기본 클래스를 확장하고 일부 메서드를 재정의하는 매우 사용자 지정된 필드를 추가 할 수 있습니다.

이제 양식을 표시 할 모든 것이 준비되었으므로 이제 필드를 확인하고 저장하기위한 것이 필요합니다.

7 : Custom_Reg\Saver수업

<?php
// file: Saver.php
namespace Custom_Reg;

class Saver {

  protected $fields;

  protected $user = array( 'user_login' => NULL, 'user_email' => NULL );

  protected $meta = array();

  protected $error;

  public function setFields( \ArrayIterator $fields ) {
    $this->fields = $fields;
  }

  /**
  * validate all the fields
  */
  public function validate() {
    // if registration is not allowed return false
    if ( ! get_option('users_can_register') ) return FALSE;
    // if no fields are setted return FALSE
    if ( ! $this->getFields() instanceof \ArrayIterator ) return FALSE;
    // first check nonce
    $nonce = $this->getValue( '_n' );
    if ( $nonce !== wp_create_nonce( 'custom_reg_form_nonce' ) ) return FALSE;
    // then check all fields
    $it =  $this->getFields();
    while( $it->valid() ) {
      $field = $it->current();
      $key = $field->getID();
      if ( ! $field instanceof FieldInterface ) {
        throw new \DomainException( "Invalid field" );
      }
      $value = $this->getValue( $key, $field->getFilter() );
      if ( $field->isRequired() && empty($value) ) {
        $this->error = sprintf( __('%s is required', 'custom_reg_form' ), $key );
        return FALSE;
      }
      if ( ! $field->isValid( $value ) ) {
        $this->error = sprintf( __('%s is not valid', 'custom_reg_form' ), $key );
        return FALSE;
      }
      if ( in_array( "user_{$key}", array_keys($this->user) ) ) {
        $this->user["user_{$key}"] = $value;
      } else {
        $this->meta[$key] = $value;
      }
      $it->next();
    }
    return TRUE;
  }

  /**
  * Save the user using core register_new_user that handle username and email check
  * and also sending email to new user
  * in addition save all other custom data in user meta
  *
  * @see register_new_user()
  */
  public function save() {
    // if registration is not allowed return false
    if ( ! get_option('users_can_register') ) return FALSE;
    // check mandatory fields
    if ( ! isset($this->user['user_login']) || ! isset($this->user['user_email']) ) {
      return false;
    }
    $user = register_new_user( $this->user['user_login'], $this->user['user_email'] );
    if ( is_numeric($user) ) {
      if ( ! update_user_meta( $user, 'custom_data', $this->meta ) ) {
        wp_delete_user($user);
        return FALSE;
      }
      return TRUE;
    } elseif ( is_wp_error( $user ) ) {
      $this->error = $user->get_error_message();
    }
    return FALSE;
  }

  public function getValue( $var, $filter = FILTER_SANITIZE_STRING ) {
    if ( ! is_string($var) ) {
      throw new \InvalidArgumentException( "Invalid value" );
    }
    $method = strtoupper( filter_input( INPUT_SERVER, 'REQUEST_METHOD' ) );
    $type = $method === 'GET' ? INPUT_GET : INPUT_POST;
    $val = filter_input( $type, $var, $filter );
    return $val;
  }

  public function getFields() {
    return $this->fields;
  }

  public function getErrorMessage() {
    return $this->error;
  }

}

이 클래스 validate에는 필드를 루프하고 필드를 검증하고 좋은 데이터를 배열에 save저장 하는 두 가지 주요 메소드가 있으며 , 두 번째 ( )는 데이터베이스에 모든 데이터를 저장하고 새 사용자에게 이메일을 통해 비밀번호를 보냅니다.

8 : 정의 된 클래스를 사용 : 마무리 Custom_Reg클래스를

이제 Custom_Reg정의 된 객체를 "접착"하고 작동시키는 메소드를 추가하여 클래스에서 다시 작업 할 수 있습니다.

<?php 
// file Custom_Reg.php
namespace Custom_Reg;

class Custom_Reg {

  protected $form;

  protected $saver;

  function __construct( Form $form, Saver $saver ) {
    $this->form = $form;
    $this->saver = $saver;
  }

  /**
   * Check if the url to recognize is the one for the registration form page
   */
  function checkUrl() {
    $url_part = $this->getUrl();
    $nonce = urlencode( wp_create_nonce( 'registration_url' ) );
    if ( ( $url_part === $nonce ) ) {
      // do nothing if registration is not allowed or user logged
      if ( is_user_logged_in() || ! get_option('users_can_register') ) {
        wp_safe_redirect( home_url() );
        exit();
      }
      return TRUE;
    }
  }

  /**
   * Init the form, if submitted validate and save, if not just display it
   */
  function init() {
    if ( $this->checkUrl() !== TRUE ) return;
    do_action( 'custom_reg_form_init', $this->form );
    if ( $this->isSubmitted() ) {
      $this->save();
    }
    // don't need to create form if already saved
    if ( ! isset( $custom_reg_form_done ) || ! $custom_reg_form_done ) {
      $this->form->create();
    }
    load_template( $this->getTemplate() );
    exit();
  }

  protected function save() {
    global $custom_reg_form_error;
    $this->saver->setFields( $this->form->getFields() );
    if ( $this->saver->validate() === TRUE ) { // validate?
      if ( $this->saver->save() ) { // saved?
        global $custom_reg_form_done;
        $custom_reg_form_done = TRUE;
      } else { // saving error
        $err =  $this->saver->getErrorMessage(); 
        $custom_reg_form_error = $err ? : __( 'Error on save.', 'custom_reg_form' );
      }
    } else { // validation error
       $custom_reg_form_error = $this->saver->getErrorMessage();
    }
  }

  protected function isSubmitted() {
    $type = $this->form->getVerb() === 'GET' ? INPUT_GET : INPUT_POST;
    $sub = filter_input( $type, 'custom_reg_form', FILTER_SANITIZE_STRING );
    return ( ! empty( $sub ) && $sub === get_class( $this->form ) );
  }

  protected function getTemplate() {
    $base = $this->form->getTemplate() ? : FALSE;
    $template = FALSE;
    $default = dirname( __FILE__ ) . '/default_form_template.php';
    if ( ! empty( $base ) ) {
      $template = locate_template( $base );
    }
    return $template ? : $default;
  }

   protected function getUrl() {
    $home_path = trim( parse_url( home_url(), PHP_URL_PATH ), '/' );
    $relative = trim( str_replace( $home_path, '', add_query_arg( array() ) ), '/' );
    $parts = explode( '/', $relative );
    if ( ! empty( $parts ) && ! isset( $parts[1] ) ) {
      return $parts[0];
    }
  }

}

클래스의 생성자는 Form및 의 인스턴스 중 하나를 허용합니다 Saver.

init()메소드 ()를 사용 checkUrl()하여 url의 첫 번째 부분을보고 home_url()올바른 nonce와 일치하는 경우 양식이 이미 제출되었는지 Saver확인하고 객체를 사용하는 경우 사용자 데이터를 확인하고 저장합니다. 그렇지 않으면 양식을 인쇄하십시오. .

init()메소드는 또한 'custom_reg_form_init'양식 인스턴스를 인수로 전달 하는 조치 후크 를 실행합니다 .이 후크는 필드를 추가하고 사용자 정의 템플리트를 설정하고 양식 메소드를 사용자 정의하는 데 사용해야합니다.

9 : 사물 정리

이제 메인 플러그인 파일을 작성해야합니다.

• 모든 파일이 필요합니다
• 텍스트 도메인을로드
• 인스턴스화 Custom_Reg클래스를 사용하여 전체 프로세스를 시작 init()하고 합리적인 초기 후크를 사용하여 메소드를 호출하십시오.
• 'custom_reg_form_init'를 사용하여 양식 클래스에 필드를 추가하십시오.

그래서:

<?php 
/**
 * Plugin Name: Custom Registration Form
 * Description: Just a rough plugin example to answer a WPSE question
 * Plugin URI: https://wordpress.stackexchange.com/questions/10309/
 * Author: G. M.
 * Author URI: https://wordpress.stackexchange.com/users/35541/g-m
 *
 */

if ( is_admin() ) return; // this plugin is all about frontend

load_plugin_textdomain(
  'custom_reg_form',
  FALSE,
  plugin_dir_path( __FILE__ ) . 'langs'
); 

require_once plugin_dir_path( __FILE__ ) . 'FieldInterface.php';
require_once plugin_dir_path( __FILE__ ) . 'fields.php';
require_once plugin_dir_path( __FILE__ ) . 'Form.php';
require_once plugin_dir_path( __FILE__ ) . 'Saver.php';
require_once plugin_dir_path( __FILE__ ) . 'CustomReg.php';

/**
* Generate dynamic registration url
*/
function custom_registration_url() {
  $nonce = urlencode( wp_create_nonce( 'registration_url' ) );
  return home_url( $nonce );
}

/**
* Generate dynamic registration link
*/
function custom_registration_link() {
  $format = '<a href="%s">%s</a>';
  printf(
    $format,
    custom_registration_url(), __( 'Register', 'custom_reg_form' )
  );
}

/**
* Setup, show and save the form
*/
add_action( 'wp_loaded', function() {
  try {
    $form = new Custom_Reg\Form;
    $saver = new Custom_Reg\Saver;
    $custom_reg = new Custom_Reg\Custom_Reg( $form, $saver );
    $custom_reg->init();
  } catch ( Exception $e ) {
    if ( defined('WP_DEBUG') && WP_DEBUG ) {
      $msg = 'Exception on  ' . __FUNCTION__;
      $msg .= ', Type: ' . get_class( $e ) . ', Message: ';
      $msg .= $e->getMessage() ? : 'Unknown error';
      error_log( $msg );
    }
    wp_safe_redirect( home_url() );
  }
}, 0 );

/**
* Add fields to form
*/
add_action( 'custom_reg_form_init', function( $form ) {
  $classes = array(
    'Custom_Reg\FullName',
    'Custom_Reg\Login',
    'Custom_Reg\Email',
    'Custom_Reg\Country'
  );
  foreach ( $classes as $class ) {
    $form->addField( new $class );
  }
}, 1 );

10 : 누락 된 작업

이제 Everithing은 꽤 끝났습니다. 테마에 사용자 정의 템플리트 파일을 추가하여 템플리트를 사용자 정의해야합니다.

이런 방식으로 사용자 정의 등록 페이지에만 특정 스타일과 스크립트를 추가 할 수 있습니다

add_action( 'wp_enqueue_scripts', function() {
  // if not on custom registration form do nothing
  if ( did_action('custom_reg_form_init') ) {
    wp_enqueue_style( ... );
    wp_enqueue_script( ... );
  }
});

이 방법을 사용하면 클라이언트 측 유효성 검사를 처리하기 위해 js 스크립트를 큐에 넣을 수 있습니다 (예 : this) . 해당 스크립트 작업을 수행하는 데 필요한 마크 업은 Custom_Reg\BaseField클래스 편집을 쉽게 처리 할 수 ​​있습니다 .

등록 이메일을 사용자 정의하려면 표준 방법을 사용 하고 메타에 사용자 정의 데이터를 저장하면 이메일에서이를 사용할 수 있습니다.

우리가 구현하려는 마지막 작업은 다음과 같이 쉽게 기본 등록 양식에 대한 요청을 방지하는 것입니다.

add_action( 'login_form_register', function() { exit(); } );

모든 파일은 여기 Gist 에서 찾을 수 있습니다 .

TLDR; 테마에 다음 양식을 넣으면 name및 id속성이 중요합니다.

<form action="<?php echo site_url('wp-login.php?action=register', 'login_post') ?>" method="post">
    <input type="text" name="user_login" value="Username" id="user_login" class="input" />
    <input type="text" name="user_email" value="E-Mail" id="user_email" class="input"  />
    <?php do_action('register_form'); ?>
    <input type="submit" value="Register" id="register" />
</form>

멋진 Wordpress 등록 양식을 처음부터 작성하는 것에 대한 뛰어난 Tutsplus 기사를 찾았습니다 . 이것은 양식을 스타일링하는 데 많은 시간을 소비하지만 필요한 워드 프레스 코드에 대해 다음과 같은 간단한 섹션이 있습니다.

4 단계. 워드 프레스

여기에는 공상이 없습니다. wp-login.php 파일 내에 숨겨진 두 개의 워드 프레스 스 니펫 만 필요합니다.

첫 번째 스 니펫 :

<?php echo site_url('wp-login.php?action=register', 'login_post') ?>  

과:

<?php do_action('register_form'); ?>

편집 : 위의 코드 스 니펫을 넣을 위치를 설명하기 위해 기사의 마지막 비트를 추가했습니다. 단지 양식으로 모든 페이지 템플릿이나 사이드 바에 들어가거나 짧은 코드를 만들 수 있습니다. 중요한 부분은 form위의 스 니펫과 중요한 필수 필드가 포함 된 섹션입니다 .

최종 코드는 다음과 같아야합니다.

<div style="display:none"> <!-- Registration -->
        <div id="register-form">
        <div class="title">
            <h1>Register your Account</h1>
            <span>Sign Up with us and Enjoy!</span>
        </div>
            <form action="<?php echo site_url('wp-login.php?action=register', 'login_post') ?>" method="post">
            <input type="text" name="user_login" value="Username" id="user_login" class="input" />
            <input type="text" name="user_email" value="E-Mail" id="user_email" class="input"  />
                <?php do_action('register_form'); ?>
                <input type="submit" value="Register" id="register" />
            <hr />
            <p class="statement">A password will be e-mailed to you.</p>


            </form>
        </div>
</div><!-- /Registration -->

그것의주의하시기 바랍니다 정말 중요한 가지고, 필요한 user_loginA와 name와 같은 id텍스트 입력의 속성; 이메일 입력에서도 마찬가지입니다. 그렇지 않으면 작동하지 않습니다.

그리고 우리는 끝났습니다!

이 기사 는 자신 만의 프론트 엔드 등록 / 로그인 / 복원 비밀번호 양식을 작성하는 방법에 대한 훌륭한 튜토리얼을 제공합니다.

또는 플러그인을 찾고 있다면 이전에 사용했으며 다시 추천 할 수 있습니다.

• Ajax 로그인 / 등록
• Ajax로 로그인

얼마 전에 웹 사이트를 만들어 프런트 엔드에 사용자 지정 등록 양식을 표시했습니다. 이 웹 사이트는 더 이상 운영되지 않지만 여기에 스크린 샷이 있습니다.

내가 수행 한 단계는 다음과 같습니다.

1) 모든 방문자가 설정> 일반> 회원 옵션을 통해 새 계정을 요청할 가능성을 활성화하십시오. 등록 페이지가 이제 URL /wp-login.php?action=register에 나타납니다.

2) 사이트 프런트 엔드처럼 보이도록 등록 양식을 사용자 정의하십시오. 이것은 더 까다 롭고 사용중인 테마에 따라 다릅니다.

다음은 스물셋의 예입니다.

// include theme scripts and styles on the login/registration page
add_action('login_enqueue_scripts', 'twentythirteen_scripts_styles');

// remove admin style on the login/registration page
add_filter( 'style_loader_tag', 'user16975_remove_admin_css', 10, 2);
function user16975_remove_admin_css($tag, $handle){
    if ( did_action('login_init')
    && ($handle == 'wp-admin' || $handle == 'buttons' || $handle == 'colors-fresh'))
        return "";

    else return $tag;
}

// display front-end header and footer on the login/registration page
add_action('login_footer', 'user16975_integrate_login');
function user16975_integrate_login(){
    ?><div id="page" class="hfeed site">
        <header id="masthead" class="site-header" role="banner">
            <a class="home-link" href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home">
                <h1 class="site-title"><?php bloginfo( 'name' ); ?></h1>
                <h2 class="site-description"><?php bloginfo( 'description' ); ?></h2>
            </a>

            <div id="navbar" class="navbar">
                <nav id="site-navigation" class="navigation main-navigation" role="navigation">
                    <h3 class="menu-toggle"><?php _e( 'Menu', 'twentythirteen' ); ?></h3>
                    <a class="screen-reader-text skip-link" href="#content" title="<?php esc_attr_e( 'Skip to content', 'twentythirteen' ); ?>"><?php _e( 'Skip to content', 'twentythirteen' ); ?></a>
                    <?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?>
                    <?php get_search_form(); ?>
                </nav><!-- #site-navigation -->
            </div><!-- #navbar -->
        </header><!-- #masthead -->

        <div id="main" class="site-main">
    <?php get_footer(); ?>
    <script>
        // move the login form into the page main content area
        jQuery('#main').append(jQuery('#login'));
    </script>
    <?php
}

그런 다음 테마 스타일 시트를 수정하여 원하는대로 양식을 표시하십시오.

3) 표시된 메시지를 조정하여 양식을 추가로 수정할 수 있습니다.

add_filter('login_message', 'user16975_login_message');
function user16975_login_message($message){
    if(strpos($message, 'register') !== false){
        $message = 'custom register message';
    } else {
        $message = 'custom login message';
    }
    return $message;
}

add_action('login_form', 'user16975_login_message2');
function user16975_login_message2(){
    echo 'another custom login message';
}

add_action('register_form', 'user16975_tweak_form');
function user16975_tweak_form(){
    echo 'another custom register message';
}

4) 프론트 엔드 등록 양식이 필요한 경우, 등록 된 사용자가 로그인 할 때 백엔드를 보지 않기를 원할 것입니다.

add_filter('user_has_cap', 'user16975_refine_role', 10, 3);
function user16975_refine_role($allcaps, $cap, $args){
    global $pagenow;

    $user = wp_get_current_user();
    if($user->ID != 0 && $user->roles[0] == 'subscriber' && is_admin()){
        // deny access to WP backend
        $allcaps['read'] = false;
    }

    return $allcaps;
}

add_action('admin_page_access_denied', 'user16975_redirect_dashbord');
function user16975_redirect_dashbord(){
    wp_redirect(home_url());
    die();
}

많은 단계가 있지만 결과는 여기에 있습니다!

더 쉬운 방법 : wp_login_form()( Codex page here ) 라는 WordPress 기능을 사용 하십시오 .

페이지에서 단축 코드를 사용할 수 있도록 자체 플러그인을 만들 수 있습니다.

<?php
/*
Plugin Name: WP Login Form Shortcode
Description: Use <code>[wp_login_form]</code> to show WordPress' login form.
Version: 1.0
Author: WP-Buddy
Author URI: http://wp-buddy.com
License: GPLv2 or later
*/

add_action( 'init', 'wplfsc_add_shortcodes' );

function wplfsc_add_shortcodes() {
    add_shortcode( 'wp_login_form', 'wplfsc_shortcode' );
}

function wplfsc_shortcode( $atts, $content, $name ) {

$atts = shortcode_atts( array(
        'redirect'       => site_url( $_SERVER['REQUEST_URI'] ),
        'form_id'        => 'loginform',
        'label_username' => __( 'Username' ),
        'label_password' => __( 'Password' ),
        'label_remember' => __( 'Remember Me' ),
        'label_log_in'   => __( 'Log In' ),
        'id_username'    => 'user_login',
        'id_password'    => 'user_pass',
        'id_remember'    => 'rememberme',
        'id_submit'      => 'wp-submit',
        'remember'       => false,
        'value_username' => NULL,
        'value_remember' => false
), $atts, $name );

// echo is always false
$atts['echo'] = false;

// make real boolean values
$atts['remember']       = filter_var( $atts['remember'], FILTER_VALIDATE_BOOLEAN );
$atts['value_remember'] = filter_var( $atts['value_remember'], FILTER_VALIDATE_BOOLEAN );

return '<div class="cct-login-form">' . wp_login_form( $atts ) . '</div>';

}

프런트 엔드에서 양식의 스타일을 지정하기 만하면됩니다.

플러그인을 사용할 수 있다면 Gravity Forms에 사용자 등록 애드온을 사용해 본 적이 있습니다.

http://www.gravityforms.com/add-ons/user-registration/

편집 : 이것은 매우 상세한 솔루션은 아니지만 필요한 것을 정확하게 수행하고 좋은 솔루션이라는 것을 알고 있습니다.

편집 : 내 대답을 더 확장하기 위해 중력 양식에 대한 사용자 등록 추가 기능을 사용하면 중력 양식을 사용하여 만든 양식의 모든 필드를 사용자 특정 필드에 매핑 할 수 있습니다. 예를 들어 이름, 성, 전자 메일, 웹 사이트, 암호를 사용하여 양식을 만들 수 있습니다. 제출시 애드온은 해당 입력을 관련 사용자 필드에 맵핑합니다.

그것에 대한 또 다른 좋은 점은 등록 된 사용자를 승인 대기열에 추가 할 수 있다는 것입니다. 사용자 계정은 관리자가 백엔드에서 승인 한 후에 만 ​​만들 수 있습니다.

위 링크가 끊어지면 Google "Gravity Forms에 대한 사용자 등록 추가"만