纯代码创建一个 WordPress 自定义注册表单插件

现在越来越多朋友开启 wordpress 注册功能,现在很多网站都对外开启了用户注册和登录功能,WordPress 提供了一个自定义注册表单,可用于建立一个新的用户,或者将新用户添加到已有的 WordPress 网站。但是,如果你想实现一个自定义的登记表单,不在 WordPress 控制面板中显示的选项?

在本教程中,我们将学习如何使用模板标签和简码的组合来创建 WordPress 的自定义登记表单。默认的登记表格只包含两个表单字段 – 用户名和电子邮件。只有用户名和电子邮件表单字段的存在,使得注册过程非常容易。首先,您可以输入您的用户名和电子邮件之后,密码会被发送给您。接下来,您使用网站生成的密码登录,然后填写您的个人资料和更改更加难忘的密码。

与其让用户通过上面的流程来简单注册你的网站,为什么不提供一个直入主题的注册表单,包含一些用户名和邮箱以外的重要信息,比如密码、他们的网址、简介、昵称以及姓名等等。这个对于像 Tuts+ 这样的做作者网站非常有用。在本文中,我们将建立一个自定义的登记表单插件,具有以下表单字段:

  • 用户名
  • 密码
  • 电子邮件
  • 网址
  • 名字
  • 姓氏
  • 昵称
  • 简介

这个自定义注册表单可以通过模板标签或简码集成到 WordPress 网站中。使用这个简码,你可以创建一个页面然后将它设置为你网站的官方注册页面。或者你还可以在文章中使用这个简码,让用户阅读完文章以后注册你的网站。如果你想添加注册表单到侧边栏或者你网站的其他任意位置,你可以编辑主题文件,然后添加模板标签到所需的位置。

在我们开始建立登记表单插件,值得注意的是,用户名,密码和邮箱字段是必需的。我们会根据这个规则来撰写验证功能。

构建插件

如上所说,让我们开始插件的代码。首先,包含插件头。

  1. <?php
  2. /*
  3.   Plugin Name: Custom Registration
  4.   Plugin URI: http://www.2kss.com
  5.   Description: Updates user rating based on number of posts.
  6.   Version: 1.0
  7.   Author: Agbonghama Collins
  8.   Author URI: https://2kss.com
  9.  */

接下来,我们创建一个 PHP 函数包含报名表单的 HTML 代码。

  1. function registration_form( $username, $password, $email, $website, $first_name, $last_name, $nickname, $bio ) {
  2.     echo '
  3.     <style>
  4.     div {
  5.         margin-bottom:2px;
  6.     }
  7. 
    
  8.     input{
  9.         margin-bottom:4px;
  10.     }
  11.     </style>
  12.     ';
  13. 
    
  14.     echo '
  15.     <form action="' . $_SERVER['REQUEST_URI'] . '" method="post">
  16.     <div>
  17.     <label for="username">Username <strong>*</strong></label>
  18.     <input type="text" name="username" value="' . ( isset( $_POST['username'] ) ? $username : null ) . '">
  19.     </div>
  20. 
    
  21.     <div>
  22.     <label for="password">Password <strong>*</strong></label>
  23.     <input type="password" name="password" value="' . ( isset( $_POST['password'] ) ? $password : null ) . '">
  24.     </div>
  25. 
    
  26.     <div>
  27.     <label for="email">Email <strong>*</strong></label>
  28.     <input type="text" name="email" value="' . ( isset( $_POST['email']) ? $email : null ) . '">
  29.     </div>
  30. 
    
  31.     <div>
  32.     <label for="website">Website</label>
  33.     <input type="text" name="website" value="' . ( isset( $_POST['website']) ? $website : null ) . '">
  34.     </div>
  35. 
    
  36.     <div>
  37.     <label for="firstname">First Name</label>
  38.     <input type="text" name="fname" value="' . ( isset( $_POST['fname']) ? $first_name : null ) . '">
  39.     </div>
  40. 
    
  41.     <div>
  42.     <label for="website">Last Name</label>
  43.     <input type="text" name="lname" value="' . ( isset( $_POST['lname']) ? $last_name : null ) . '">
  44.     </div>
  45. 
    
  46.     <div>
  47.     <label for="nickname">Nickname</label>
  48.     <input type="text" name="nickname" value="' . ( isset( $_POST['nickname']) ? $nickname : null ) . '">
  49.     </div>
  50. 
    
  51.     <div>
  52.     <label for="bio">About / Bio</label>
  53.     <textarea name="bio">' . ( isset( $_POST['bio']) ? $bio : null ) . '</textarea>
  54.     </div>
  55.     <input type="submit" name="submit" value="Register"/>
  56.     </form>
  57.     ';
  58. }

注意到注册字段被传递给上述函数作为变量?在功能代码,你会看到下面的代码实例,例如:

  1. ( isset( $_POST['lname'] ) ? $last_name : null )

这个三元运算符会检查 $_POST 这个全局数组的内容中是否包含一个值,如果包含,就赋予表单字段这个值,这样就可以节约用户重新输入字段的时间。

一个注册表单还没有完成,直到你验证和消毒用户输入的内容。因此,我们将创建一个名为 registration_validation 的验证函数。

为了减轻负担,我们直接使用 WordPress 的 WP_Error 类,下面一起来编写验证功能:

1.创建该函数,将注册字段作为函数参数。

  1. function registration_validation( $username, $password, $email, $website, $first_name, $last_name, $nickname, $bio )  {

2.实例化 WP_Error 类,将该实例设为全局变量,确保它可以在函数的范围之外访问。

  1. global $reg_errors;
  2. $reg_errors = new WP_Error;

3.记住:我们刚才说的 用户名、密码和邮箱是必需的,不能留空的。要实施此规则,我们需要检查这些字段是否为空。如果为空,我们就追加错误信息到全局 WP_Error 类。

  1. if ( empty( $username ) || empty( $password ) || empty( $email ) ) {
  2.     $reg_errors->add('field', 'Required form field is missing');
  3. }

4.我们还要检查和确认用户名的位数不少于 4

  1. if ( 4 > strlen( $username ) ) {
  2.     $reg_errors->add( 'username_length', 'Username too short. At least 4 characters is required' );
  3. }

5.检查用户名是否已被注册

  1. if ( username_exists( $username ) )
  2.     $reg_errors->add('user_name', 'Sorry, that username already exists!');

6.使用 WordPress 的 validate_username 函数验证用户名是否有效

  1. if ( ! validate_username( $username ) ) {
  2.     $reg_errors->add( 'username_invalid', 'Sorry, the username you entered is not valid' );
  3. }

7.确保用户输入的密码位数不少于 5 个字符

  1. if ( 5 > strlen( $password ) ) {
  2.         $reg_errors->add( 'password', 'Password length must be greater than 5' );
  3.     }

8.检查邮箱是否有效

  1. if ( !is_email( $email ) ) {
  2.     $reg_errors->add( 'email_invalid', 'Email is not valid' );
  3. }

9.检查邮箱是否已注册

  1. if ( email_exists( $email ) ) {
  2.     $reg_errors->add( 'email', 'Email Already in use' );
  3. }

10.如果网址字段已填写,检查是否有效

  1. if ( ! empty( $website ) ) {
  2.     if ( ! filter_var( $website, FILTER_VALIDATE_URL ) ) {
  3.         $reg_errors->add( 'website', 'Website is not a valid URL' );
  4.     }
  5. }

11.最后,我们循环在 WP_Error 实例中的错误信息,并各自显示

  1. if ( is_wp_error( $reg_errors ) ) {
  2. 
    
  3.     foreach ( $reg_errors->get_error_messages() as $error ) {
  4. 
    
  5.         echo '<div>';
  6.         echo '<strong>ERROR</strong>:';
  7.         echo $error . '<br/>';
  8.         echo '</div>';
  9. 
    
  10.     }
  11. 
    
  12. }

到这里,我们已经完成了验证函数。

下一步,创建 complete_registration() 函数来处理用户注册。

用户注册实际上由 wp_insert_user 函数完成,它可以接受用户数据数组。

  1. function complete_registration() {
  2.     global $reg_errors, $username, $password, $email, $website, $first_name, $last_name, $nickname, $bio;
  3.     if ( 1 > count( $reg_errors->get_error_messages() ) ) {
  4.         $userdata = array(
  5.         'user_login'    =>   $username,
  6.         'user_email'    =>   $email,
  7.         'user_pass'     =>   $password,
  8.         'user_url'      =>   $website,
  9.         'first_name'    =>   $first_name,
  10.         'last_name'     =>   $last_name,
  11.         'nickname'      =>   $nickname,
  12.         'description'   =>   $bio,
  13.         );
  14.         $user = wp_insert_user( $userdata );
  15.         echo 'Registration complete. Goto <a href="' . get_site_url() . '/wp-login.php">login page</a>.';
  16.     }
  17. }

在上面的 complete_registration() 函数,我们将 $reg_errors 和 WP_Error 示例,以及表单字段设置为全局变量,以便我们可以在全局范围中访问。

然后我们检查 $reg_errors 错误处理实例是否包含错误。如果没有错误,我们就填充 $userdata 数组并将用户注册资料写入 WordPress 数据库,并且显示注册完成信息和链接到注册页面的地址。

回到上一层,custom_registration_function() 函数使我们上面创建的函数投入使用。

  1. function custom_registration_function() {
  2.     if ( isset($_POST['submit'] ) ) {
  3.         registration_validation(
  4.         $_POST['username'],
  5.         $_POST['password'],
  6.         $_POST['email'],
  7.         $_POST['website'],
  8.         $_POST['fname'],
  9.         $_POST['lname'],
  10.         $_POST['nickname'],
  11.         $_POST['bio']
  12.         );
  13. 
    
  14.         // sanitize user form input
  15.         global $username, $password, $email, $website, $first_name, $last_name, $nickname, $bio;
  16.         $username   =   sanitize_user( $_POST['username'] );
  17.         $password   =   esc_attr( $_POST['password'] );
  18.         $email      =   sanitize_email( $_POST['email'] );
  19.         $website    =   esc_url( $_POST['website'] );
  20.         $first_name =   sanitize_text_field( $_POST['fname'] );
  21.         $last_name  =   sanitize_text_field( $_POST['lname'] );
  22.         $nickname   =   sanitize_text_field( $_POST['nickname'] );
  23.         $bio        =   esc_textarea( $_POST['bio'] );
  24. 
    
  25.         // call @function complete_registration to create the user
  26.         // only when no WP_error is found
  27.         complete_registration(
  28.         $username,
  29.         $password,
  30.         $email,
  31.         $website,
  32.         $first_name,
  33.         $last_name,
  34.         $nickname,
  35.         $bio
  36.         );
  37.     }
  38. 
    
  39.     registration_form(
  40.         $username,
  41.         $password,
  42.         $email,
  43.         $website,
  44.         $first_name,
  45.         $last_name,
  46.         $nickname,
  47.         $bio
  48.         );
  49. }

让我解释一下 custom_registration_function() 函数的代码。

首先,我们通过检查 $_POST[‘submit’] 是否设置来判断表单是否已提交。如果已提交,就调用 registration_validation 函数验证用户提交的数据。然后我们消毒表单数据,并为消毒好的数据设置变量名。最后调用 complete_registration 注册用户。

我们需要调用 registration_form 函数显示注册表单。记得我提到过要为该插件提供简码支持,下面就是构建简码的代码。

  1. // Register a new shortcode: [cr_custom_registration]
  2. add_shortcode( 'cr_custom_registration', 'custom_registration_shortcode' );
  3. 
    
  4. // The callback function that will replace [book]
  5. function custom_registration_shortcode() {
  6.     ob_start();
  7.     custom_registration_function();
  8.     return ob_get_clean();
  9. }

到这里,我们就完成了整个插件的代码啦!下面就是最终的效果,当然了,还需要你自己添加 css 样式才能达到下面的显示效果。
纯代码创建一个 WordPress 自定义注册表单插件-云模板

插件用法

要在 WordPress 文章或页面中显示这个注册表单,可以使用下面的简码:

  1. [cr_custom_registration]

要在你主题的特定位置显示注册表单,你可以添加下面的模板标签进行调用:

  1. <?php custom_registration_function(); ?>

原创文章,作者:DavidWu,如若转载,请注明出处:https://www.davidwu.net/archives/80479

WordPress安全防护插件
服务项目 服务内容 收费标准(元)
开发定制 WordPress主题/插件开发定制 (以最终需求为准)
主题/插件汉化 汉化团队WordPress主题/插件,翻译率95% (以标的主题/插件的句子数量为准)
服务器环境配置 基于您现有服务器,搭建配置网站运行环境,结合我们多年来实战经验,可完美支持WordPress等PHP程序运行,并配置伪静态规则、优化目录权限等问题。服务器我们强烈推荐使用Linux系统。 100元/次
网站托管 若贵站目前尚无技术人员,无法完成服务器环境配置,可选择我们的网站托管服务,直接交付正常运行的WordPress站点,并且无需担心服务器的后续维护工作,一切都由我们来帮您完成。 标配套餐:1000元/年/站点 高配套餐:联系客服获取
网站加速优化 从服务器后端配置优化到WordPress数据库缓存、前端页面缓存、JS和CSS压缩合并,全方位优化网站加载速度,实现秒开。(此服务仅针对(云)服务器/VPS) 500元/次(仅站内优化200元/次)
主题配置 本站所有主题均支持,可快速实现,若有任何问题可以咨询客服解决,若您希望我们提供配置服务,可选购此服务。 英文主题安装 60元/次 汉化主题安装 30元/次
HTTPS配置 HTTPS已经不断普及,并且有着更高的安全性以及SEO上的优待。该服务收取的为服务费,SSL证书产生的费用请自行承担。 100元/次
网站搬家 迁移网站所有文件和数据库信息、网站相关配置的调整、以及迁移中的疑难问题故障排除。 标准收费:500元/次 若网站数据量大,需协商
网站运维 提供整站的运维服务,保证网站正常运行。包含:网站故障定位及排除、网站数据备份和恢复、网站攻击及木马等问题的处理等 标准收费:2000元/年 IP 5000以上需协商

发表评论

电子邮件地址不会被公开。 必填项已用*标注

51建站客服微信二维码
点击这里购买