Come creare pagine di accesso e registrazione separate in WooCommerce

Pubblicato: 2021-05-18

Pagine di accesso e registrazione separate in WooCommerce Stai cercando un modo per separare in modo programmatico le pagine Accesso e Registrazione? Questo breve tutorial ti fornirà una soluzione semplice.

Potresti voler inviare i clienti disconnessi a una pagina di accesso e i clienti non registrati a una pagina separata. Per impostazione predefinita, WooCommerce visualizza il modulo di accesso e il modulo di registrazione sulla stessa pagina.

Vale la pena ricordare che la pagina WooCommerce My Account è visualizzata dallo shortcode [woocommerce_my_account].

Avere entrambi i moduli di accesso e di registrazione sulla stessa pagina potrebbe non essere una buona idea se desideri utilizzare pagine di destinazione o pagine di vendita con un obiettivo specifico come la registrazione dell'utente. Ciò significa che il modulo di accesso non è richiesto in questa pagina.

Come creare pagine di accesso e registrazione separate in WooCommerce

In questo breve tutorial, ti mostreremo come separare le pagine di login e di registrazione. Ti mostreremo come creare due nuovi shortcode, uno per il modulo di accesso e uno per il modulo di registrazione. Questi shortcode possono essere utilizzati ovunque sul tuo sito.

Vediamo come puoi raggiungere questo obiettivo.

Passaggi per creare pagine di accesso e registrazione separate in WooCommerce

Prima di procedere, è importante notare che il contenuto utilizzato per creare lo shortcode viene copiato dai file modello di WooCommerce. Ciò significa che quando WooCommerce rilascia modifiche su questi file durante un aggiornamento, è necessario modificare alcune parti del codice.

Continua a leggere, poiché ti mostreremo anche come utilizzare gli shortcode.

Ecco i passaggi che devi seguire:

Accedi al tuo sito WordPress e accedi alla Dashboard come utente amministratore.
Dal menu Dashboard, fai clic su Menu Aspetto > Menu Editor temi . Quando viene aperta la pagina dell'editor del tema, cerca il file delle funzioni del tema in cui aggiungeremo la funzione che creerà lo shortcode della pagina di registrazione.
Aggiungi il seguente codice al file php :

add_shortcode( 'wc_reg_form_njengah', 'njengah_separate_registration_form' );

function njengah_separate_registration_form() {

if ( is_admin() ) return;

if ( is_user_logged_in() ) return;

ob_start();

// NOTE: THE FOLLOWING <FORM></FORM> IS COPIED FROM woocommerce\templates\myaccount\form-login.php

// IF WOOCOMMERCE RELEASES AN UPDATE TO THAT TEMPLATE, YOU MUST CHANGE THIS ACCORDINGLY

do_action( 'woocommerce_before_customer_login_form' );

?>

<form method="post" class="woocommerce-form woocommerce-form-register register" <?php do_action( 'woocommerce_register_form_tag' ); ?> >

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

<?php if ( 'no' === get_option( 'woocommerce_registration_generate_username' ) ) : ?>

<p class="woocommerce-form-row woocommerce-form-row--wide form-row form-row-wide">

<label for="reg_username"><?php esc_html_e( 'Username', 'woocommerce' ); ?> <span class="required">*</span></label>

<input type="text" class="woocommerce-Input woocommerce-Input--text input-text" name="username" id="reg_username" autocomplete="username" value="<?php echo ( ! empty( $_POST['username'] ) ) ? esc_attr( wp_unslash( $_POST['username'] ) ) : ''; ?>" /><?php // @codingStandardsIgnoreLine ?>

</p>

<?php endif; ?>

<p class="woocommerce-form-row woocommerce-form-row--wide form-row form-row-wide">

<label for="reg_email"><?php esc_html_e( 'Email address', 'woocommerce' ); ?> <span class="required">*</span></label>

<input type="email" class="woocommerce-Input woocommerce-Input--text input-text" name="email" id="reg_email" autocomplete="email" value="<?php echo ( ! empty( $_POST['email'] ) ) ? esc_attr( wp_unslash( $_POST['email'] ) ) : ''; ?>" /><?php // @codingStandardsIgnoreLine ?>

</p>

<?php if ( 'no' === get_option( 'woocommerce_registration_generate_password' ) ) : ?>

<p class="woocommerce-form-row woocommerce-form-row--wide form-row form-row-wide">

<label for="reg_password"><?php esc_html_e( 'Password', 'woocommerce' ); ?> <span class="required">*</span></label>

<input type="password" class="woocommerce-Input woocommerce-Input--text input-text" name="password" id="reg_password" autocomplete="new-password" />

</p>

<?php else : ?>

<p><?php esc_html_e( 'A password will be sent to your email address.', 'woocommerce' ); ?></p>

<?php endif; ?>

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

<p class="woocommerce-FormRow form-row">

<?php wp_nonce_field( 'woocommerce-register', 'woocommerce-register-nonce' ); ?>

<button type="submit" class="woocommerce-Button woocommerce-button button woocommerce-form-register__submit" name="register" value="<?php esc_attr_e( 'Register', 'woocommerce' ); ?>"><?php esc_html_e( 'Register', 'woocommerce' ); ?></button>

</p>

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

</form>

<?php

return ob_get_clean();

}

Il secondo shortcode è [wc_login_form_bbloomer]. Dovresti aggiungerlo a una pagina nuova di zecca. Aggiungi il seguente codice nello stesso file:

add_shortcode( 'wc_login_form_njengah', 'njengah_separate_login_form' );

function njengah_separate_login_form() {

if ( is_admin() ) return;

if ( is_user_logged_in() ) return;

ob_start();

woocommerce_login_form( array( 'redirect' => 'https://custom.url' ) );

return ob_get_clean();

}

Come utilizzare gli shortcode

Come accennato in precedenza, lo shortcode [woocommerce_my_account] mostra la pagina Il mio account. Se desideri mantenere il modulo di accesso e la dashboard della pagina dell'account mentre sei connesso alla stessa pagina, dovresti utilizzare il primo shortcode: [woocommerce_my_account] .

Se vuoi avere login + il mio account e una pagina di registrazione separata:

[wc_reg_form_njengah] nella pagina di registrazione
[woocommerce_my_account] nella pagina Login + Account

Se desideri avere una pagina separata per il login, la registrazione e il mio account:

wc_reg_form_njengah] nella pagina di registrazione
[wc_login_form_njengah] nella pagina di accesso
[woocommerce_my_njengah ] nella pagina Il mio account

Tuttavia, devi disabilitare "Consenti ai clienti di creare un account", come mostrato di seguito: conti

Conclusione

Questo è tutto ciò che devi fare per separare le pagine di accesso e di registrazione. Ricordati di copiare e incollare lo shortcode su una nuova pagina.

Ti consigliamo di creare un tema figlio. Ciò garantirà che le modifiche non vadano perse durante un aggiornamento.

Ci auguriamo che questo post abbia aiutato a risolvere il tuo problema.

Come creare pagine di accesso e registrazione separate in WooCommerce

Come creare pagine di accesso e registrazione separate in WooCommerce

Passaggi per creare pagine di accesso e registrazione separate in WooCommerce

Come utilizzare gli shortcode

Conclusione

Articoli simili