WordPress添加前台注册功能

日期: 标签:WordPress教程 129 条留言
如需帮忙改代码,或者WordPress二次开发、PHP网站建设等需求,可联系我购买付费服务:  点此联系我

有网友留言,想实现WordPress在前台注册的功能,联想之前写的教程:WordPress添加投稿功能,实现方法很类似,趁着今天休息,琢磨了一下,很快实现了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实现前台登录功能

-- 完 --

本文采用 「CC BY-NC-SA 4.0」创作共享协议,转载请标注以下信息:
原文出处:露兜博客 https://www.ludou.org/wordpress-frontend-register.html
露兜
kaapass@outlook.com  QQ 825533758

业余编程爱好者,主业是淘宝店主,卖些工艺品,感兴趣可以到我的淘宝店看看(旺旺不提供技术咨询):西西弗sisyphe

129 条留言

点此留言
1 2 3 534
  1. Kelvin

    想请教下,如何让检查用户名有没有被注册和邮箱有没有被注册自动检测,而不是填写完成后点击提交按钮再判断

  2. 露兜

    @Kelvin 需要用到ajax,代码较多,涉及东西也较多,需要专门调试。

  3. Kelvin

    @露兜 明白了,
    不过要是能再出“找回密码”页面和“前台修改个人资料”的教程就完美了

  4. 露兜

    @Kelvin 插件:WP User Frontend

  5. jayden

    可以控制之允许数字或者字母注册吗?禁止中文和任何符号。

  6. 露兜

    @jayden WordPress本身禁止中文,其他需求请参考这篇文章修改:
    https://www.ludou.org/wordpress-allowing-chinese-in-registration-2.html

  7. 郭偉威

    你好,我想請問你一下。

    你的語法教學
    那種文字框,裡面的文字又有顏色,那是怎麼做到的?感謝你囉!

  8. 露兜

    @郭偉威 插件 https://www.ludou.org/codecolorer.html

  9. 郭偉威

    我收到囉,太感謝你囉。

  10. haguo

    第49行代码过时啦自3.3版本起,已不建议使用get_userdatabylogin,请换用get_user_by('login')
    一直学习中

  11. 超级三只猫

    博主大人 这个添加之后 那个提示好难看 要怎么办呢? “<strong>错误</strong>:密码长度至少6位!<br” 是添加对应CSS样式上就可以了吗

  12. 露兜

    @超级三只猫 css代码就自己加吧

  13. 淘亞

    博主大人,
    請問一下WordPress有沒有辦法「網頁設置密碼要註冊會員」才能登入觀看的功能?
    這幾天找了WordPress外掛發現似乎沒有串聯在一起的功能,
    似乎都是網頁密碼一塊,會員註冊是一塊的…
    請問如果要自行用您上面的方式編寫有沒有可能?
    另外這樣有辦法管理到註冊人的資料嗎?如果後續需要刪除的話?
    請麻煩大人解惑!!

  14. 露兜

    @淘亞 插件:https://www.ludou.org/wordpress-plugin-login-to-view-all.html

  15. 淘亞

    @露兜 謝謝,博主大人解答!!
    趕緊學起來^^~

  16. 风间千景

    你好,我按照你的教程做出来了模板,可是应用到前台全是空白,是哪里出了问题吗,能指导下吗

  17. 安妮

    这个是用的来给其他用户注册,登录用的吗?我指的不是 通过这个注册能登录后台。

  18. hello

    get_userdatabylogin() 已经被替换成了get_user_by()

  19. 露兜

    @hello 谢谢提醒

  20. 小斌

    如何让注册的时候多添加个姓氏和名字,我直接加上去,提交后没存到数据库啊。求解

  21. 动力网

    感谢博主的教程,让我受益匪浅。感谢万分,希望博主的网站越办越好。

  22. 斑斑

    您好,请问我想做一个只有注册用户才能投稿的网站,是不是前端注册、前端登陆和前端投稿都需要实现,除了实现这个,如何把登陆用户和用户投稿放在一起呢?

  23. 随之长风

    大神求指点,自定义注册页面如何添加自定义问题判断,应该怎么写?

  24. 窗里窗外

    大神您好,可以改良一下前台注册,添加验证码功能,防止恶意注册吗

  25. 1234

    博主,我想问一下怎么添加PHP文件啊?谢谢

1 2 3

发表留言