WordPress添加前台注冊功能

一、添加注冊表單

1、首先在當前主題的目錄下新建一個php文件，命名為reg-page.php，然后將page.php中的所有代碼復制到reg-page.php中；

2、刪除reg-page.php開頭的所有注釋，即 /* 與 */ ，以及它們之間的所有內容；

3、搜索：the_content，可以查找到類似代碼：<?php the_content(); ?>，將這段代碼替換成代碼一（注意使用UTF-8編碼另存為替換原來的reg-page.php）

如果你在reg-page.php中找不到the_content，那么你可以查找：get_template_part，可找到類似代碼：<?php get_template_part( 'content', 'page' ); ?>，將content-page.php中的所有代碼替換這部分代碼即可。再用下面的代碼替換<?php the_content(); ?>

代碼一

<?php the_content(); ?>
<?php if(!empty($error)) {
  echo '<p class="ludou-error">'.$error.'</p>';
}
if (!is_user_logged_in()) { ?>
<form name="registerform" method="post" action="<?php echo $_SERVER["REQUEST_URI"]; ?>" class="ludou-reg">
    <p>
      <label for="user_login">用戶名<br />
        <input type="text" name="user_login" tabindex="1" id="user_login" class="input" value="<?php if(!empty($sanitized_user_login)) echo $sanitized_user_login; ?>" />
      </label>
    </p>

    <p>
      <label for="user_email">電子郵件<br />
        <input type="text" name="user_email" tabindex="2" id="user_email" class="input" value="<?php if(!empty($user_email)) echo $user_email; ?>" size="25" />
      </label>
    </p>
    
    <p>
      <label for="user_pwd1">密碼(至少6位)<br />
        <input id="user_pwd1" class="input" tabindex="3" type="password" tabindex="21" size="25" value="" name="user_pass" />
      </label>
    </p>
    
    <p>
      <label for="user_pwd2">重復密碼<br />
        <input id="user_pwd2" class="input" tabindex="4" type="password" tabindex="21" size="25" value="" name="user_pass2" />
      </label>
    </p>
    
    <p class="submit">
      <input type="hidden" name="ludou_reg" value="ok" />
      <button class="button button-primary button-large" type="submit">注冊</button>
    </p>
</form>
<?php } else {
  echo '<p class="ludou-error">您已注冊成功，並已登錄！</p>';
} ?>

 

二、添加表單處理代碼

在reg-page.php開頭處中，將第一個 <?php 改成代碼二（注意使用UTF-8編碼保存）：

<?php
/**
 * Template Name: 前台注冊
 * 作者：露兜
 * 博客：https://www.ludou.org/
 *  
 *  2013年02月02日 ：
 *  首個版本
 */
  
if( !empty($_POST['ludou_reg']) ) {
  $error = '';
  $sanitized_user_login = sanitize_user( $_POST['user_login'] );
  $user_email = apply_filters( 'user_registration_email', $_POST['user_email'] );

  // Check the username
  if ( $sanitized_user_login == '' ) {
    $error .= '<strong>錯誤</strong>：請輸入用戶名。<br />';
  } elseif ( ! validate_username( $sanitized_user_login ) ) {
    $error .= '<strong>錯誤</strong>：此用戶名包含無效字符，請輸入有效的用戶名<br />。';
    $sanitized_user_login = '';
  } elseif ( username_exists( $sanitized_user_login ) ) {
    $error .= '<strong>錯誤</strong>：該用戶名已被注冊，請再選擇一個。<br />';
  }

  // Check the e-mail address
  if ( $user_email == '' ) {
    $error .= '<strong>錯誤</strong>：請填寫電子郵件地址。<br />';
  } elseif ( ! is_email( $user_email ) ) {
    $error .= '<strong>錯誤</strong>：電子郵件地址不正確。！<br />';
    $user_email = '';
  } elseif ( email_exists( $user_email ) ) {
    $error .= '<strong>錯誤</strong>：該電子郵件地址已經被注冊，請換一個。<br />';
  }
    
  // Check the password
  if(strlen($_POST['user_pass']) < 6)
    $error .= '<strong>錯誤</strong>：密碼長度至少6位!<br />';
  elseif($_POST['user_pass'] != $_POST['user_pass2'])
    $error .= '<strong>錯誤</strong>：兩次輸入的密碼必須一致!<br />';
      
    if($error == '') {
    $user_id = wp_create_user( $sanitized_user_login, $_POST['user_pass'], $user_email );
    
    if ( ! $user_id ) {
      $error .= sprintf( '<strong>錯誤</strong>：無法完成您的注冊請求... 請聯系<a href="mailto:%s">管理員</a>！<br />', get_option( 'admin_email' ) );
    }
    else if (!is_user_logged_in()) {
      $user = get_user_by( 'login', $sanitized_user_login );
      $user_id = $user->ID;
  
      // 自動登錄
      wp_set_current_user($user_id, $user_login);
      wp_set_auth_cookie($user_id);
      do_action('wp_login', $user_login);
    }
  }
}

 

     最后進入WordPress管理后台 – 頁面 – 創建頁面，標題為注冊（可以自己起名），內容填上注冊說明等，右側可以選擇模板，選擇 前台注冊 即可。此頁面即前台注冊頁面，將該頁面的鏈接放到網站任何位置，供用戶點擊注冊即可。

代碼補充說明

     1、注冊成功會讓用戶自動登錄，如果不需要自動功能，可以將49-55行代碼刪除，換成：

// 注冊成功后跳轉到站內其他頁面，URL自行修改 wp_safe_redirect( 'https://www.ludou.org/' );

     2、如果想美化一下注冊表單，可以在主題的style.css中添加以下代碼：

p.ludou-error {
  margin: 16px 0;
  padding: 12px;
  background-color: #ffebe8;
  border: 1px solid #c00;
  font-size: 12px;
  line-height: 1.4em;
}
.ludou-reg label {
  color: #777;
  font-size: 14px;
  cursor: pointer;
}
.ludou-reg .input {
  margin: 0;
  color: #555;
  font-size: 24px;
  padding: 3px;
  border: 1px solid #e5e5e5;
  background: #fbfbfb;
}

 

前台登錄

     實現了前台注冊功能，當然前台登錄也是少不了的，具體看這篇文章：WordPress實現前台登錄功能

-- 完 --