Wie kann ich das WordPress-Benutzerregistrierungsformular im Frontend der Website anzeigen?

TLDR; Fügen Sie dasfolgende Formularin Ihr Themaein. Die Attribute name und id sind wichtig:

  & lt;form action="& lt ;?phpecho site_url ('wp-login.php? action=register','login_post')? >"method="post" >
    & lt;inputtype="text"name="user_login" value="Benutzername"id="user_login" class="input"/>
    & lt;inputtype="text"name="user_email" value="E-Mail"id="user_email" class="input"/>
    & lt ;?php do_action ('register_form'); >
    & lt;inputtype="submit" value="Register"id="register"/>
& lt;/form >
 

Ich habeeinen ausgezeichneten Tutsplus-Artikel auf Erstelleneines ausgefallenen Wordpress-Registrierungsformulars von Grund auf . Dies verbringt viel Zeitmit dem Gestalten des Formulars,enthältjedoch denfolgenden rechteinfachen Abschnitt zumerforderlichen WordPress-Code:

Schritt 4. WordPress

Hiergibt esnichts Besonderes; Wirbenötigennur zwei WordPress-Schnipsel. verstecktin der Datei wp-login.php.

Daserste Snippet:

  & lt ;?phpecho site_url ('wp-login.php? action=register','login_post')? >
 

Und:

  & lt ;?php do_action ('register_form'); >
 

Bearbeiten: Ich habe das zusätzliche letzte Bit aus dem Artikel hinzugefügt,um zuerklären,wo die obigen Codefragmente abgelegt werden sollen -esistnurein Formular,damitesin jede Seitenvorlage oder Seitenleisteeingefügt odereine erstellt werden kann Shortcode raus. Der wichtige Abschnittist das -Formular ,das die obigen Ausschnitte und die wichtigenerforderlichen Felderenthält.

Derendgültige Code solltefolgendermaßen aussehen:

  & lt; div style="Anzeige: keine" > & lt ;! - Registrierung - >
        & lt; divid="Registerform" >
        & lt; div class="title" >
            & lt; h1 > Registrieren Sie Ihr Konto & lt;/h1 >
            & lt; span > Melden Sie sichbei uns an undgenießen Sie! & lt;/span >
        & lt;/div >
            & lt;form action="& lt ;?phpecho site_url ('wp-login.php? action=register','login_post')? >"method="post" >
            & lt;inputtype="text"name="user_login" value="Benutzername"id="user_login" class="input"/>
            & lt;inputtype="text"name="user_email" value="E-Mail"id="user_email" class="input"/>
                & lt ;?php do_action ('register_form'); >
                & lt;inputtype="submit" value="Register"id="register"/>
            & lt; h/>
            & lt;p class="Anweisung" > Ein Passwort wirdper E-Mail an Siegesendet. & lt;/p >


            & lt;/form >
        & lt;/div >
& lt;/div > & lt ;! -/Registrierung - >
 

Bittebeachten Sie,dasses wirklich wichtig undnotwendigist, user_login als name und als id Attributin Ihrer Texteingabe; Gleichesgiltfür die E-Mail-Eingabe. Andernfallsfunktioniertesnicht.

Und damit sind wirfertig!

TLDR; Put the following form into your theme, the name and id attributes are important:

<form action="<?php echo site_url('wp-login.php?action=register', 'login_post') ?>" method="post">
    <input type="text" name="user_login" value="Username" id="user_login" class="input" />
    <input type="text" name="user_email" value="E-Mail" id="user_email" class="input"  />
    <?php do_action('register_form'); ?>
    <input type="submit" value="Register" id="register" />
</form>

I found an excellent Tutsplus article on Making a fancy Wordpress Register Form from scratch. This spends quite a lot of its time on styling the form, but has the following fairly simple section on the required wordpress code:

Step 4. WordPress

There is nothing fancy here; we only require two WordPress snippets, hidden within the wp-login.php file.

The first snippet:

<?php echo site_url('wp-login.php?action=register', 'login_post') ?>  

And:

<?php do_action('register_form'); ?>

Edit: I've added the extra final bit from the article to explain where to put the above code snippets - its just a form so it can go in any page template or sidebar or make a shortcode out of it. The important section is the form which contains the above snippets and the important required fields.

The final code should look like so:

<div style="display:none"> <!-- Registration -->
        <div id="register-form">
        <div class="title">
            <h1>Register your Account</h1>
            <span>Sign Up with us and Enjoy!</span>
        </div>
            <form action="<?php echo site_url('wp-login.php?action=register', 'login_post') ?>" method="post">
            <input type="text" name="user_login" value="Username" id="user_login" class="input" />
            <input type="text" name="user_email" value="E-Mail" id="user_email" class="input"  />
                <?php do_action('register_form'); ?>
                <input type="submit" value="Register" id="register" />
            <hr />
            <p class="statement">A password will be e-mailed to you.</p>


            </form>
        </div>
</div><!-- /Registration -->

Please note that it's really important, and necessary, to have user_login as a name and as an id attribute in your text input; the same is true for the email input. Otherwise, it won't work.

And with that, we're done!

Dieser Artikel enthältein umfassendes Tutorial zum Erstelleneineseigenen Frontend-Registers/Logins/Passwortformulare wiederherstellen.

oder wenn Sienacheinem Plugin suchen,habeich diesebereits verwendet und kann sieempfehlen:

• Ajax Login/Register
• Mit Ajax anmelden

this Article provides a greate tutorial on how to create you own frontend register/login/restore password forms.

or if you are looking for a plugin then i've used these before and can recomend them:

• Ajax Login/Register
• Login With Ajax

Ich habe voreiniger Zeiteine Websiteerstellt,auf derein benutzerdefiniertes Registrierungsformular auf der Vorderseite angezeigt wird. Diese Websiteistnichtmehr live,aber hier sindeinige Screenshots.

Hier sind die Schritte,dieichbefolgt habe:

1) Aktivieren Sie die Möglichkeitfür alle Besucher,über die Option Einstellungen> Allgemein> Mitgliedschaftein neues Konto anzufordern. Die Registrierungsseite wirdjetzt unter der URL/wp-login.php?action=register

2) Passen Sie das Registrierungsformular so an,dasses wie das Front-End Ihrer Website aussieht. Diesist schwieriger und hängt vom verwendeten Thema ab.

Hieristein Beispielmit dreiundzwanzig:

 // include theme scripts and styles on the login/registration page
add_action('login_enqueue_scripts', 'twentythirteen_scripts_styles');

// remove admin style on the login/registration page
add_filter( 'style_loader_tag', 'user16975_remove_admin_css', 10, 2);
function user16975_remove_admin_css($tag, $handle){
    if ( did_action('login_init')
    && ($handle == 'wp-admin' || $handle == 'buttons' || $handle == 'colors-fresh'))
        return "";

    else return $tag;
}

// display front-end header and footer on the login/registration page
add_action('login_footer', 'user16975_integrate_login');
function user16975_integrate_login(){
    ?><div id="page" class="hfeed site">
        <header id="masthead" class="site-header" role="banner">
            <a class="home-link" href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home">
                <h1 class="site-title"><?php bloginfo( 'name' ); ?></h1>
                <h2 class="site-description"><?php bloginfo( 'description' ); ?></h2>
            </a>

            <div id="navbar" class="navbar">
                <nav id="site-navigation" class="navigation main-navigation" role="navigation">
                    <h3 class="menu-toggle"><?php _e( 'Menu', 'twentythirteen' ); ?></h3>
                    <a class="screen-reader-text skip-link" href="#content" title="<?php esc_attr_e( 'Skip to content', 'twentythirteen' ); ?>"><?php _e( 'Skip to content', 'twentythirteen' ); ?></a>
                    <?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?>
                    <?php get_search_form(); ?>
                </nav><!-- #site-navigation -->
            </div><!-- #navbar -->
        </header><!-- #masthead -->

        <div id="main" class="site-main">
    <?php get_footer(); ?>
    <script>
        // move the login form into the page main content area
        jQuery('#main').append(jQuery('#login'));
    </script>
    <?php
}
 

Ändern Sie anschließend das Design-Stylesheet,damit das Formular wiegewünscht angezeigt wird.

3) Sie können das Formular weiter ändern,indem Sie die angezeigten Meldungen anpassen:

 add_filter('login_message', 'user16975_login_message');
function user16975_login_message($message){
    if(strpos($message, 'register') !== false){
        $message = 'custom register message';
    } else {
        $message = 'custom login message';
    }
    return $message;
}

add_action('login_form', 'user16975_login_message2');
function user16975_login_message2(){
    echo 'another custom login message';
}

add_action('register_form', 'user16975_tweak_form');
function user16975_tweak_form(){
    echo 'another custom register message';
}
 

4) Wenn Sieein Front-End-Registrierungsformularbenötigen,möchten Sie wahrscheinlichnicht,dass registrierte Benutzer das Backend sehen,wenn sie sich anmelden.

 add_filter('user_has_cap', 'user16975_refine_role', 10, 3);
function user16975_refine_role($allcaps, $cap, $args){
    global $pagenow;

    $user = wp_get_current_user();
    if($user->ID != 0 && $user->roles[0] == 'subscriber' && is_admin()){
        // deny access to WP backend
        $allcaps['read'] = false;
    }

    return $allcaps;
}

add_action('admin_page_access_denied', 'user16975_redirect_dashbord');
function user16975_redirect_dashbord(){
    wp_redirect(home_url());
    die();
}
 

Esgibt viele Schritte,aber das Ergebnisist da!

I made a website some time ago that was displaying a customized registration form on the front end side. This website is not live anymore but here are some screenshots.

Here are the steps I have followed:

1) Activate the possibility for all visitors to request a new account via Settings > General > Membership option. The registration page now appears at the URL /wp-login.php?action=register

2) Customize the registration form so that it looks like your site front-end. This is more tricky and depends on the theme you are using.

Here is an example with twentythirteen :

// include theme scripts and styles on the login/registration page
add_action('login_enqueue_scripts', 'twentythirteen_scripts_styles');

// remove admin style on the login/registration page
add_filter( 'style_loader_tag', 'user16975_remove_admin_css', 10, 2);
function user16975_remove_admin_css($tag, $handle){
    if ( did_action('login_init')
    && ($handle == 'wp-admin' || $handle == 'buttons' || $handle == 'colors-fresh'))
        return "";

    else return $tag;
}

// display front-end header and footer on the login/registration page
add_action('login_footer', 'user16975_integrate_login');
function user16975_integrate_login(){
    ?><div id="page" class="hfeed site">
        <header id="masthead" class="site-header" role="banner">
            <a class="home-link" href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home">
                <h1 class="site-title"><?php bloginfo( 'name' ); ?></h1>
                <h2 class="site-description"><?php bloginfo( 'description' ); ?></h2>
            </a>

            <div id="navbar" class="navbar">
                <nav id="site-navigation" class="navigation main-navigation" role="navigation">
                    <h3 class="menu-toggle"><?php _e( 'Menu', 'twentythirteen' ); ?></h3>
                    <a class="screen-reader-text skip-link" href="#content" title="<?php esc_attr_e( 'Skip to content', 'twentythirteen' ); ?>"><?php _e( 'Skip to content', 'twentythirteen' ); ?></a>
                    <?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?>
                    <?php get_search_form(); ?>
                </nav><!-- #site-navigation -->
            </div><!-- #navbar -->
        </header><!-- #masthead -->

        <div id="main" class="site-main">
    <?php get_footer(); ?>
    <script>
        // move the login form into the page main content area
        jQuery('#main').append(jQuery('#login'));
    </script>
    <?php
}

Then modify the theme stylesheet to make the form appear as you want.

3) You can further modify the form by tweaking the displayed messages :

add_filter('login_message', 'user16975_login_message');
function user16975_login_message($message){
    if(strpos($message, 'register') !== false){
        $message = 'custom register message';
    } else {
        $message = 'custom login message';
    }
    return $message;
}

add_action('login_form', 'user16975_login_message2');
function user16975_login_message2(){
    echo 'another custom login message';
}

add_action('register_form', 'user16975_tweak_form');
function user16975_tweak_form(){
    echo 'another custom register message';
}

4) If you need a front-end registration form, you will probably don't want that registered users see the backend when they log-in.

add_filter('user_has_cap', 'user16975_refine_role', 10, 3);
function user16975_refine_role($allcaps, $cap, $args){
    global $pagenow;

    $user = wp_get_current_user();
    if($user->ID != 0 && $user->roles[0] == 'subscriber' && is_admin()){
        // deny access to WP backend
        $allcaps['read'] = false;
    }

    return $allcaps;
}

add_action('admin_page_access_denied', 'user16975_redirect_dashbord');
function user16975_redirect_dashbord(){
    wp_redirect(home_url());
    die();
}

There are lots of steps, but the result is here !

Vieleinfacher: Verwenden Sie hiereine WordPress-Funktionnamens wp_login_form() ( Codex-Seite) ).

Sie können Ihreigenes Pluginerstellen,umeinen Shortcode aufeiner Ihrer Seiten zu verwenden:

 <?php
/*
Plugin Name: WP Login Form Shortcode
Description: Use <code>[wp_login_form]</code> to show WordPress' login form.
Version: 1.0
Author: WP-Buddy
Author URI: http://wp-buddy.com
License: GPLv2 or later
*/

add_action( 'init', 'wplfsc_add_shortcodes' );

function wplfsc_add_shortcodes() {
    add_shortcode( 'wp_login_form', 'wplfsc_shortcode' );
}

function wplfsc_shortcode( $atts, $content, $name ) {

$atts = shortcode_atts( array(
        'redirect'       => site_url( $_SERVER['REQUEST_URI'] ),
        'form_id'        => 'loginform',
        'label_username' => __( 'Username' ),
        'label_password' => __( 'Password' ),
        'label_remember' => __( 'Remember Me' ),
        'label_log_in'   => __( 'Log In' ),
        'id_username'    => 'user_login',
        'id_password'    => 'user_pass',
        'id_remember'    => 'rememberme',
        'id_submit'      => 'wp-submit',
        'remember'       => false,
        'value_username' => NULL,
        'value_remember' => false
), $atts, $name );

// echo is always false
$atts['echo'] = false;

// make real boolean values
$atts['remember']       = filter_var( $atts['remember'], FILTER_VALIDATE_BOOLEAN );
$atts['value_remember'] = filter_var( $atts['value_remember'], FILTER_VALIDATE_BOOLEAN );

return '<div class="cct-login-form">' . wp_login_form( $atts ) . '</div>';

}
 

Siemüssen lediglich Ihr Formularim Frontendformatieren.

Way easier: use a WordPress function called wp_login_form() (Codex page here).

You can make your own plugin so that you can use a shortcode in on of your pages:

<?php
/*
Plugin Name: WP Login Form Shortcode
Description: Use <code>[wp_login_form]</code> to show WordPress' login form.
Version: 1.0
Author: WP-Buddy
Author URI: http://wp-buddy.com
License: GPLv2 or later
*/

add_action( 'init', 'wplfsc_add_shortcodes' );

function wplfsc_add_shortcodes() {
    add_shortcode( 'wp_login_form', 'wplfsc_shortcode' );
}

function wplfsc_shortcode( $atts, $content, $name ) {

$atts = shortcode_atts( array(
        'redirect'       => site_url( $_SERVER['REQUEST_URI'] ),
        'form_id'        => 'loginform',
        'label_username' => __( 'Username' ),
        'label_password' => __( 'Password' ),
        'label_remember' => __( 'Remember Me' ),
        'label_log_in'   => __( 'Log In' ),
        'id_username'    => 'user_login',
        'id_password'    => 'user_pass',
        'id_remember'    => 'rememberme',
        'id_submit'      => 'wp-submit',
        'remember'       => false,
        'value_username' => NULL,
        'value_remember' => false
), $atts, $name );

// echo is always false
$atts['echo'] = false;

// make real boolean values
$atts['remember']       = filter_var( $atts['remember'], FILTER_VALIDATE_BOOLEAN );
$atts['value_remember'] = filter_var( $atts['value_remember'], FILTER_VALIDATE_BOOLEAN );

return '<div class="cct-login-form">' . wp_login_form( $atts ) . '</div>';

}

All you have to do is to style your form on the frontend.

Wenn Siefür die Verwendung von Plugins offen sind,habeich zuvor das Benutzerregistrierungs-Add-Onfür Gravity Forms verwendet. Es hat sehrgutfunktioniert:

http://www.gravityforms.com/add-ons/user-registration/

Bearbeiten: Mirist klar,dass dies keine sehr detaillierte Lösungist,abergenau dastut,was Siebrauchen,undeine gute Lösung.

Bearbeiten: Ummeine Antwort weiter zuerweitern,können Siemit dem Benutzerregistrierungs-Add-Onfür Schwerkraftformulare alle Felderin einemmit Schwerkraftformularenerstellten Formularbenutzerspezifischen Feldern zuordnen. Sie könnenbeispielsweiseein Formularmit Vorname,Nachname,E-Mail,Website und Kennworterstellen. Bei der Übermittlung ordnet das Add-On diese Eingaben den relevanten Benutzerfeldern zu.

Eine weiteregroßartige Sacheist,dass Sie alle registrierten Benutzer zueiner Genehmigungswarteschlange hinzufügen können. Ihre Benutzerkonten werdenersterstellt,wenn sieim Backend voneinem Administratorgenehmigt wurden.

Wenn der obige Link unterbrochen wird,klicken Sieeinfachbei Google auf "Benutzerregistrierungs-Add-Onfür Schwerkraftformulare"

If you're open to the use of plugins, I've used the User Registration add-on for Gravity Forms before, it worked very well:

http://www.gravityforms.com/add-ons/user-registration/

Edit: I realise this isn't a very detailed solution, but it does exactly what you need and is a good solution.

Edit: To expand on my answer further, the User Registration add-on for gravity forms allows you to map any fields in a form created using Gravity Forms, to user-specific fields. For example, you can create a form with First Name, Last Name, Email, Website, Password. Upon submission, the add-on will map those inputs to the relevant user fields.

Another great thing about it, is you can add any registered users into an approval queue. Their user accounts would only be created once approved in the backend by an admin.

If the above link breaks, just Google "User Registration add on for Gravity Forms"