WordPress zweistufiges Registrierungsformular

Lesezeit: 10 Minuten

Ich versuche folgendes zu erreichen und weiß nicht wo ich anfangen soll.

Ich versuche, ein Anmelde-/Registrierungsformular mit zwei Schritten zu erstellen.

Erster Schritt: soll 2 Eingabefelder haben (Name, E-Mail) und wenn der Benutzer absendet, wird eine E-Mail mit einem Link zu Schritt zwei gesendet.

Schritt zwei: Ein Benutzer gibt den Link ein, der an seine E-Mail gesendet wurde, und betritt eine Seite mit einem zweiten Formular. das hat einen Wert der E-Mail und des Namens, den er verwendet hat, + 2 weitere Felder (Benutzername, Passwort), in denen er Zugriff auf bestimmte Seiten hat.

Ich konnte nicht finden, wo ich anfangen soll und keine Plugins erfüllen die folgenden.

Grüße,

Mostafa.

SCHRITT 1

Zuerst sollten Sie zwei separate Vorlagen erstellen (eine für jeden Schritt). In der ersten Vorlage sollten Sie ein Formular erstellen, das Benutzer-E-Mails an die zweite Seite sendet. Der Link sollte haben GET Attribute, damit Sie seine E-Mail-Adresse und seinen Vornamen erhalten können. Hier ist ein Beispiel (beachten Sie, dass es verbessert werden kann):

<?php 
/*
** Template Name: Step 1
*/

get_header();

if ( !empty( $_POST['firstname'] ) && !empty( $_POST['email'] ) ) {
    $link = 'http://my-site/step-2';
    $link = add_query_arg(
        array(
            'firstname' => $_POST['firstname'],
            'email'     => $_POST['email'],
        ),
        $link
    );

    $subject="New user registration";
    $message="Please click on the following link to complete your registration: " . $link;
    $headers = array('Content-Type: text/html; charset=UTF-8');

    $result = wp_mail( $_POST['email'], $subject, $message, $headers );

    if ( $result ) {
        $message="Please check your email address to complete the registration";
    } else {
        $message="Something went wrong. Please contact the administrator";
    }

    echo $message;
} else {
?>
    <form method="POST" action="">
        <input type="text" name="firstname" placeholder="First Name">
        <input type="email" name="email" placeholder="Email address">
        <input type="submit" value="Submit">
    </form>
<?php
}
get_footer();

Wir erstellen eine einfache Überprüfung, ob das Formular gesendet und alle Felder ausgefüllt wurden. In diesem Fall können wir eine E-Mail an Schritt 2 senden.


SCHRITT 2

Wir werden eine separate Vorlage erstellen, in der wir die Daten aus der ersten Verwendung ausfüllen $_GETund wir werden zwei neue Felder hinzufügen ( Benutzername und Passwort ), die leer sein werden.

<?php 
/*
** Template Name: Step 2
*/

get_header();

if ( !empty( $_POST['firstname'] ) && !empty( $_POST['email'] ) && !empty( $_POST['password'] ) ) {
    $user_id = username_exists( $_POST['username'] );

    if ( !$user_id and email_exists($_POST['email']) == false ) {

        $user_id = wp_create_user( $_POST['username'], $_POST['password'], $_POST['email'] );

        if ( $user_id ) {
            update_user_meta($user_id, 'first_name', $_POST['firstname']);
            $message="User has been created";
        }
    } else {
        $message="User already exists!";
    }

    echo $message;
} else {
?>
    <form method="POST" action="">
        <input type="text" name="firstname" value="<?php echo ( !empty( $_GET['firstname'] ) ) ? $_GET['firstname'] : '' ; ?>" placeholder="First Name">
        <input type="email" name="email" value="<?php echo ( !empty( $_GET['email'] ) ) ? $_GET['email'] : '' ; ?>" placeholder="Email Address">
        <input type="text" name="username" placeholder="Username">
        <input type="password" name="password" placeholder="Password">
        <input type="submit" value="Submit">
    </form>
<?php
}
get_footer();

Wenn das zweite Formular gesendet wird und alles in Ordnung ist, können wir den Benutzer erstellen. Einmal erstellt, können wir seinen Vornamen aktualisieren.

Sie können meinen Code unbegrenzt ändern, aber dies ist die Basis. Zum Beispiel können wir die Felder erforderlich machen, wir können die Passwortstärke, die Namenslänge usw. überprüfen.

Hier ist eine kurze Zusammenfassung der Schritte, die Sie unternehmen können.

Stellen Sie sicher, dass der Benutzer eindeutig ist, und speichern Sie die Anmeldeinformationen für die Bestätigung.

if(!email_exists( $email )){

    /*
       Store credentials in a custom table 
       with a unique identifier, 
       hashed password and email. 

       Email user with the confirmation link ex.
       site.com/confirmation/<unique-identifier>
    */

}

In dem confirmation Seite erstellt der Benutzer einfach durch:

// Confirm <unique-identifier>

// Create user
$user_id = wp_create_user( $email, $password, $email );

// Set user role
$user = new WP_User( $user_id );
$user->set_role( 'contributor' ); // or a custom role

  • Danke für den Hinweis, ich würde mich über weitere Erklärungen freuen.

    – Mostafa Mohsen

    27. November 2016 um 17:24 Uhr

  • @MostafaMohsen, detaillierte Erklärung zu meiner Antwort: stackoverflow.com/a/40959220/1960558

    – Ruhul Amin

    4. Dezember 2016 um 19:46 Uhr

Ich denke, jetzt kannst du das versuchen Contact form 7 Multi-Step Form Plugin hier unten:

Kontaktformular 7 Mehrstufige Formulare

Probieren Sie die Demo aus hier

Später können Sie erfahren, wie Sie ein solches Registrierungsformular nach Ihrem Talent entwickeln können

  • Ich möchte so etwas entwickeln, ich brauche nur den Ansatz (: Danke für das Plugin, aber ich werde es mir ansehen.

    – Mostafa Mohsen

    20. November 2016 um 19:04 Uhr

Versuchen zu Dies Plugin für Ihren Zweck.

  1. Versuchen Sie, ein benutzerdefiniertes Plugin zu erstellen, und erstellen Sie 2 Shortcodes.

  2. Erstellen Sie 2 Seiten und fügen Sie jeweils die 2 Shortcodes ein.

  3. Schreiben Sie in den ersten Shortcode den Code für ein Formular, damit der Benutzer seine E-Mail-Adresse und seinen Namen eingeben kann.

  4. Geben Sie dann die Daten (Name und E-Mail-Adresse) zur Datenbank mit ein wp_insert_user und dann eine E-Mail an die E-Mail-Adresse senden, die einen Link zur zweiten Seite erzeugt und die verschlüsselte Benutzer-ID an den Link anhängt.

  5. Wenn der Benutzer auf den Link klickt, leiten Sie ihn auf die zweite Seite weiter, auf der Name und E-Mail-Adresse automatisch mit der ausgewählten Abfrage ausgefüllt werden.

  6. Geben Sie alle restlichen Details auf dieser Seite ein.

Benutzeravatar von Dipen Desai
Dipen Desai

versuchen Sie es, es ist nützlich für Sie https://www.sitepoint.com/building-a-multi-step-registration-form-for-wordpress/

Ich bevorzuge Shortcode. Hier ist der Schritt. Vollständiger Code: Kern

  1. Erstellen Sie eine Seite (Anmeldung). Zum Beispiel [request_form action="/thanks"]

Notiz: Innerhalb thanks_func Sie müssen die richtige URL verwenden $confirmation_body_text = "/signup/?hid='.$hash.'";

  1. Schaffen thanks Seite und fügen Sie diesen Shortcode hinzu:

    [thanks]
    Thank you page
    [/thanks]

  2. Erstellen Sie eine neue Tabelle in der Benutzerdatenbank:

    CREATE TABLEwp_new_user(
    Ich würdeint(11) NOT NULL,
    Namevarchar(40) NOT NULL,
    Emailvarchar(80) NOT NULL,
    Nutzernamevarchar(30) DEFAULT NULL,
    Passwortvarchar(30) DEFAULT NULL,
    Haschvarchar(40) DEFAULT NULL,
    hergestellt intimestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,
    aktualisiert amtimestamp NULL DEFAULT NULL
    ) ENGINE=InnoDB DEFAULT CHARSET=latin1;

Im ersten Schritt wird eine E-Mail mit einem Link wie gesendet signup?hid=1679091c5a880faf6fb5e6087eb1b2dc

Im zweiten Schritt erhalten wir also einen vorhandenen Benutzerdatensatz aus diesem eindeutigen E-Mail-Hash und füllen ihn vorab aus name und email Felder.

  1. Im zweiten Schritt werden wir nur den bestehenden Benutzerdatensatz aktualisieren.

    function request_form_func($atts, $content = null){ extract(shortcode_atts(array( ‘id’ => false, ‘class’ => false, ‘title’ => false, ‘subtitle’ => false, ‘action’ = > “/thanks”, ‘key’ => false, ‘button_text’ => “Submit” ), $atts));

    if( $class ) {  $class=" " . $class; }
    else { $class=""; }
    
    if( empty($_GET) ){
        $next_step = false;
        $db_name="";
        $db_email="";
    }
    if(isset($_GET['hid'])){
        $email_hash = trim($_GET['hid']);
    
        $table = "wp_new_user";
        $project_data = new wpdb('root','root','wordpress','localhost');  // Testserver
        $rows = $project_data->get_results( $project_data->prepare(
            "
                SELECT id,name, email, hash FROM " . $table . "
                WHERE hash = %d
            ",
            $email_hash
        ) );
    
        $db_hash = $rows[0]->hash;
        if( $db_hash == $email_hash ) {
            $field_id = $rows[0]->id;
            $db_name = $rows[0]->name;
            $db_email = $rows[0]->email;
            $next_step = true;
        }
    }
    
    $out="";
    
    if($id) { $id = '-'.$id; }
    
    $out .= '<div class="request_form'.$class.'">';
    $out .= '<div class="form-wrap">';
    if($title) {
        $out .= '<span class="title">' . $title . '</span>';
    }
    $out .= '<form id="step-form" class="cf" method="post" action="'.$action.'">';
    $out .= '<div class="field-wrap"><label for="fullname'.$id.'"><span class="desc">Name</span>';
    $out .= '<input type="text" id="fullname'.$id.'" name="fullname" data-required="true" placeholder="Jon Doe" value="'.$db_name.'"></label></div>';
    
    $out .= '<div class="field-wrap"><label for="email'.$id.'"><span class="desc">E-Mail</span>';
    $out .= '<input type="email" id="email'.$id.'" name="email" data-required="true" placeholder="[email protected]" value="'.$db_email.'"></label></div>';
    
    if($next_step){
        $out .= '<div class="field-wrap"><label for="username'.$id.'"><span class="desc">Username</span>';
        $out .= '<input type="text" id="username'.$id.'" name="username" data-required="true" placeholder="username"></label></div>';
    
        $out .= '<div class="field-wrap"><label for="password'.$id.'"><span class="desc">Password</span>';
        $out .= '<input type="password" id="password'.$id.'" name="password" data-required="true" placeholder="password"></label></div>';
    

    $aus .= ”; } $out .= ”;

    $out .= wp_nonce_field('step_form', 'step_form_nonce'.$id, true, false);
    $out .= '</form>';
    $out .= '</div>';
    $out .= '</div>';
    return $out;
    

    } add_shortcode(‘request_form’, ‘request_form_func’);

  2. Dann erstelle ich Dankes-Shortcode thanks die sich um Ihre Formulardaten kümmern. Grundsätzlich müssen Sie im ersten Schritt Ihre Daten speichern. Außerdem müssen Sie eine eindeutige ID generieren, um sie per E-Mail zu senden und in der Datenbank zu speichern. Der Link sieht folgendermaßen aus: „signup?hid=1679091c5a880faf6fb5e6087eb1b2dc“.

    Funktion thanks_func($atts, $content = null){ $out=””;

    if(!empty($_POST) || wp_verify_nonce($_POST['step_form_nonce'],'step_form')){
    }
    else {
        $out .= '<div class="content-area">';
        $out .= '<h2 class="h1 page-title">Something went wrong</h2>';
        $out .= '<p class="block">Please Re-Submit your form again</p>';
        $out .= '</div>';
    
        return $out;
    }
    
    if(isset($_POST['fullname'])){ $fullname = trim($_POST['fullname']); }
    if(isset($_POST['email'])){ $email = trim($_POST['email']); }
    
    if(isset($_POST['username'])){ $username = trim($_POST['username']); }
    if(isset($_POST['password'])){ $password = trim($_POST['password']); }
    if(isset($_POST['hash'])){ $db_hash = trim($_POST['hash']); }
    $hash = md5( rand(0,1000) ); // Generate random 32 character hash and assign it to a local variable.
    
    $header .= "MIME-Version: 1.0\n";
    $header .= "Content-Type: text/html; charset=utf-8\n";
    $header .= "From:" . "[email protected]";
    
    $confirmation_text = "Thanks for Submitting your first form";
    $confirmation_body_text = "/registration/?hid='.$hash.'";
    
    $subject = "Please click the link below";
    $message = "Name: $fullname\n";
    $message .= "Email Address: $email\n";
    $message .= "Click the link: $confirmation_body_text\n";
    
    if (!empty($username) && !empty($password) && !empty($field_id)){
        update_custom_user($username, $password, $$db_hash);
    } else if (create_custom_user($fullname, $email, $hash) && wp_mail($email, $subject, $message, $header)){
    
    }
    
    $out .= '<div class="content-area">';
    $content = do_shortcode($content);
    $out .= $content;
    $out .= '</div>';
    
    return $out;
    

    }

    add_shortcode(‘danke’, ‘danke_func’);

Ich habe auch 2 Funktion geschrieben create_custom_user und update_custom_user die Datendaten aus dem ersten Schritt speichern und aktualisieren username und password im 2. Schritt.

function create_custom_user($fullname, $email, $hash){
    global $wpdb;
    $table_name = $wpdb->prefix . "new_user";

    $cur_date = new DateTime();
    $cur_date->setTimezone(new DateTimeZone('Europe/Berlin'));
    $cur_date = $cur_date->format('d.m.Y').', '.$cur_date->format('G:i');


    $wpdb->insert( $table_name, array(
        'name' => $fullname,
        'email' => $email,
        'hash' => $hash,
        'created_at' => $cur_date

    ) );

    return true;
}


function update_custom_user($username, $password, $field_id){
    global $wpdb;
    $table_name = $wpdb->prefix . "new_user";

    $cur_date = new DateTime();
    $cur_date->setTimezone(new DateTimeZone('Europe/Berlin'));
    $cur_date = $cur_date->format('d.m.Y').', '.$cur_date->format('G:i');


    $wpdb->update( $table_name, array(
        'username' => $username,
        'password' => $password,
        'updated_at' => $cur_date
    ),
        array(
            "id" => $field_id
        ) );

    return true;
}

1393800cookie-checkWordPress zweistufiges Registrierungsformular

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy