1. 程式人生 > >怎樣利用WordPress創建自己定義註冊表單插件

怎樣利用WordPress創建自己定義註冊表單插件

1.0 sset return rac overflow attr mod all pass

來源:http://www.ido321.com/1031.html


原文:Creating a Custom WordPress Registration Form Plugin

譯文:創建一個定制的WordPress插件註冊表單

譯者:dwqs

技術分享

開門見山,WordPress提供了一個自己定義的註冊表單供新用戶使用,或者當加入一個新用戶到已經存在的WordPress網站。

可是假設你想實現一個自己定義的註冊表單而沒有顯示WordPress儀表盤的選項呢?

在這篇文章中。我們將學會怎麽使用標簽模板和短代碼模板的聯合體在WordPress中創建一個自己定義的註冊表單。

WordPress默認的註冊表單僅由兩個字段組成—-username和郵箱。

技術分享

這個僅有的username和郵箱表單字段使得註冊速度很的簡單。首先,你輸入一個username,然後輸入郵箱,這個郵箱就是用來接收password的。

接下來。你使用郵箱接收到的password登陸網站,而且完畢個人資料,把password改動成簡單易記得。

不過在網站註冊,而不是讓用戶區經歷這些壓力,那為什麽除了username和郵箱之外,不提供一個直接的、包括一些額外重要的表單字段。比如password、個人的URL、個人簡單介紹、昵稱和他們的姓名的註冊表單供用戶使用呢?

這對於像Tuts+的多用戶站點是很實用的。

在這篇文章中,我們將使用下列的表單字段建立一個自己定義的表單註冊插件:

  • username
  • password
  • email
  • website URL
  • first name
  • last name
  • nickname
  • biography (or an about section)

這個自己定義表單插件能夠通過使用短代碼和聯系模板整合到WordPress中。

利用短代碼模板,你能夠在你的網站中創建一個正式的註冊頁面。你也能夠再一篇發表的文章中是用短代碼模板。這樣用戶就能夠在閱讀完你的文章之後進行註冊。

假設你想加入一個註冊表單在你站點側邊欄的某個詳細位置。你能夠對WordPress主題中只期望放置標簽模板的位置進行編輯,來創建須要的註冊表單。

在創建之前。須要註意的是,username、password和電子郵件字段是必需的。

當我們編寫驗證函數時,我們將強制運行這些規則。

構建插件

正如說的那樣,我們開始對插件編碼。首先,包括插件的頭部:

<?

php /* Plugin Name: Custom Registration Plugin URI: http://code.tutsplus.com Description: Updates user rating based on number of posts. Version: 1.0 Author: Agbonghama Collins Author URI: http://tech4sky.com */

接下來。我們創建一個包括註冊表單的HTML代碼的PHP函數:

function registration_form( $username, $password, $email, $website, $first_name, $last_name, $nickname, $bio ) {
    echo ‘
    <style>
    div {
        margin-bottom:2px;
    }
     
    input{
        margin-bottom:4px;
    }
    </style>
    ‘;
 
    echo ‘
    <form action="‘ . $_SERVER[‘REQUEST_URI‘] . ‘" method="post">
    <div>
    <label for="username">Username <strong>*</strong></label>
    <input type="text" name="username" value="‘ . ( isset( $_POST[‘username‘] ) ? $username : null ) . ‘">
    </div>
     
    <div>
    <label for="password">Password <strong>*</strong></label>
    <input type="password" name="password" value="‘ . ( isset( $_POST[‘password‘] ) ? $password : null ) . ‘">
    </div>
     
    <div>
    <label for="email">Email <strong>*</strong></label>
    <input type="text" name="email" value="‘ . ( isset( $_POST[‘email‘]) ? $email : null ) . ‘">
    </div>
     
    <div>
    <label for="website">Website</label>
    <input type="text" name="website" value="‘ . ( isset( $_POST[‘website‘]) ? $website : null ) . ‘">
    </div>
     
    <div>
    <label for="firstname">First Name</label>
    <input type="text" name="fname" value="‘ . ( isset( $_POST[‘fname‘]) ? $first_name : null ) . ‘">
    </div>
     
    <div>
    <label for="website">Last Name</label>
    <input type="text" name="lname" value="‘ . ( isset( $_POST[‘lname‘]) ? $last_name : null ) . ‘">
    </div>
     
    <div>
    <label for="nickname">Nickname</label>
    <input type="text" name="nickname" value="‘ . ( isset( $_POST[‘nickname‘]) ? $nickname : null ) . ‘">
    </div>
     
    <div>
    <label for="bio">About / Bio</label>
    <textarea name="bio">‘ . ( isset( $_POST[‘bio‘]) ? $bio : null ) . ‘</textarea>
    </div>
    <input type="submit" name="submit" value="Register"/>
    </form>
    ‘;
}

請註意註冊字段是作為變量傳遞給上面的函數。在函數中,你會看到以下代碼的演示樣例:

( isset( $_POST[‘lname‘] ) ?

$last_name : null )

這個三元操作符是檢查全局變量數組$_POST是否包括數據,假設有數據,就把填充的表單字段值保存以便進入下一個字段。

除非你驗證了表單數據而且清空了表單數據,一個註冊表單才幹算完畢。否則就不算。因此,我們要創建一個名為registration_validation的表單驗證函數。

為了簡化驗證的”痛苦”,我們能夠使用WordPress中的 WP_Error 類。跟著我編寫驗證函數:

1、創建函數,並將註冊表單的字段值作為函數的參數傳遞進來

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

2、實例化WP_Error 類。並把實例作為全局變量,以便於我們能夠再函數的作用域之外使用。

global $reg_errors;
$reg_errors = new WP_Error;

3、記住:我們說的username、password和電子郵件是必填的,不要忽略了。為了運行這個規則,我們須要檢查它們中不論什麽一個是否為空。假設為空,我們就將錯誤信息追加給WP_Error 類的實例。

if ( empty( $username ) || empty( $password ) || empty( $email ) ) {
    $reg_errors->add(‘field‘, ‘Required form field is missing‘);
}

4、我們也能夠確保username的字符個數不小於4

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

5、檢查username是否被註冊了

if ( username_exists( $username ) )
    $reg_errors->add(‘user_name‘, ‘Sorry, that username already exists!‘);

6、利用WordPress的validate_username函數確保用戶名是可用的

if ( ! validate_username( $username ) ) {
    $reg_errors->add( ‘username_invalid‘, ‘Sorry, the username you entered is not valid‘ );
}

7、確保用戶輸入的password的字符個數不小於5

if ( 5 > strlen( $password ) ) {
        $reg_errors->add( ‘password‘, ‘Password length must be greater than 5‘ );
    }

8、檢查電子郵件是否有效

if ( !is_email( $email ) ) {
    $reg_errors->add( ‘email_invalid‘, ‘Email is not valid‘ );
}
9、檢查電子郵件是否被註冊
if ( !is_email( $email ) ) {
    $reg_errors->add( ‘email_invalid‘, ‘Email is not valid‘ );
}

10.、假設用戶填寫了站點字段,須要檢查其是否有效
if ( ! empty( $website ) ) {
    if ( ! filter_var( $website, FILTER_VALIDATE_URL ) ) {
        $reg_errors->add( ‘website‘, ‘Website is not a valid URL‘ );
    }
}

11、最後,我們在WP_Error實例中對錯誤進行循環。並顯示個別的錯誤
if ( is_wp_error( $reg_errors ) ) {
 
    foreach ( $reg_errors->get_error_messages() as $error ) {
     
        echo ‘<div>‘;
        echo ‘<strong>ERROR</strong>:‘;
        echo $error . ‘<br/>‘;
        echo ‘</div>‘;
         
    }
 
}

這樣,驗證函數就完畢了。接下來是complete_registration()函數。用於處理用戶註冊。用戶的註冊真正完畢是通過wp_insert_user函數, 用戶的數據作為數據保存後能夠作為此函數的參數。
function complete_registration() {
    global $reg_errors, $username, $password, $email, $website, $first_name, $last_name, $nickname, $bio;
    if ( 1 > count( $reg_errors->get_error_messages() ) ) {
        $userdata = array(
        ‘user_login‘    =>   $username,
        ‘user_email‘    =>   $email,
        ‘user_pass‘     =>   $password,
        ‘user_url‘      =>   $website,
        ‘first_name‘    =>   $first_name,
        ‘last_name‘     =>   $last_name,
        ‘nickname‘      =>   $nickname,
        ‘description‘   =>   $bio,
        );
        $user = wp_insert_user( $userdata );
        echo ‘Registration complete. Goto <a href="‘ . get_site_url() . ‘/wp-login.php">login page</a>.‘;  
    }
}

在上面的函數中,我們將$reg_errors作為WP_Error的實例,並將表單字段作為全局變量以便於能夠再全局作用域中使用。

我們須要檢查$reg_errors是否包括不論什麽錯誤。假設沒有錯誤,則將用戶註冊信息插入到WordPress的數據庫並用登陸鏈接來顯示註冊完畢的信息。

然後。把所有我們之前創建的函數所有放在全局函數custom_registration_function()之中

function custom_registration_function() {
    if ( isset($_POST[‘submit‘] ) ) {
        registration_validation(
        $_POST[‘username‘],
        $_POST[‘password‘],
        $_POST[‘email‘],
        $_POST[‘website‘],
        $_POST[‘fname‘],
        $_POST[‘lname‘],
        $_POST[‘nickname‘],
        $_POST[‘bio‘]
        );
         
        // sanitize user form input
        global $username, $password, $email, $website, $first_name, $last_name, $nickname, $bio;
        $username   =   sanitize_user( $_POST[‘username‘] );
        $password   =   esc_attr( $_POST[‘password‘] );
        $email      =   sanitize_email( $_POST[‘email‘] );
        $website    =   esc_url( $_POST[‘website‘] );
        $first_name =   sanitize_text_field( $_POST[‘fname‘] );
        $last_name  =   sanitize_text_field( $_POST[‘lname‘] );
        $nickname   =   sanitize_text_field( $_POST[‘nickname‘] );
        $bio        =   esc_textarea( $_POST[‘bio‘] );
 
        // call @function complete_registration to create the user
        // only when no WP_error is found
        complete_registration(
        $username,
        $password,
        $email,
        $website,
        $first_name,
        $last_name,
        $nickname,
        $bio
        );
    }
 
    registration_form(
        $username,
        $password,
        $email,
        $website,
        $first_name,
        $last_name,
        $nickname,
        $bio
        );
}

我須要說明一下全局函數custom_registration_function()中有哪些代碼。

首先,我通過檢查$_POST[‘submit‘]是否是空來確定表單是否提交。假設提交了,我就調用

registration_validation()函數來驗證用戶提交的表單.

然後,確保表單數據的有效性並將有效的數據在表單字段域之後用一個變量命名。最後,調用

complete_registration()函數保存用戶。我須要調用registration_form()函數來顯示用戶註冊表單。

我之前提到過,我打算用短代碼模板來支持註冊插件。以下就是短代碼模的支持代碼:

// Register a new shortcode: [cr_custom_registration]
add_shortcode( ‘cr_custom_registration‘, ‘custom_registration_shortcode‘ );
 
// The callback function that will replace [book]
function custom_registration_shortcode() {
    ob_start();
    custom_registration_function();
    return ob_get_clean();
}

到這裏為止,我們已經完畢了插件。以下的一張圖片展示了註冊表單的外觀。

註意,你可能不會得到全然同樣的外觀,由於WordPress網站的CSS樣式不同。技術分享

應用插件

為了在WordPress的文章頁或獨立頁面使用這個插件。能夠增加下面代碼:[cr_custom_registration]

也能夠加入列出的模板標記<?php custom_registration_function(); ?>.。這樣能夠讓表單插件成

為WordPress主題的一個部分。

你能夠從這篇文章的附加代碼得到這個插件。

總結

在這篇文章中,我們一步步創建了一個自己定義註冊表單並加入到WordPress網站。

你能夠加入額外字段,進一

步擴展這個註冊表單,比如用戶角色,AOL IM 賬戶,可是確保數據時有效的。

假設你有不論什麽問題或建議你。能夠留下評論。


下一篇:怎樣在站點中加入音樂



怎樣利用WordPress創建自己定義註冊表單插件