web-dev-qa-db-fra.com

Est-il possible de supprimer le champ nom d'utilisateur de la page d'inscription? Si c'est le cas, comment?

Est-il possible de supprimer le champ nom d'utilisateur de la page d'inscription?

Je veux que les utilisateurs entrent seulement leur email et mot de passe.
Un nouvel utilisateur doit être créé en fonction de ces deux paramètres uniquement.

Est-ce possible et si oui, comment?

user-registration
15
phpnwordpress

Absolument OUI, vous pouvez y parvenir.

Règle 1: WordPress nécessite un nom d'utilisateur. Nous devons fournir un nom d'utilisateur.

Règle 2: Ne modifiez pas le code principal de WordPress.

Nous pouvons y parvenir en masquant le champ Nom d'utilisateur, en obtenant un courrier électronique et en le stockant comme nom d'utilisateur.

Étape 1: Supprimer le nom d'utilisateur textfield 

add_action('login_head', function(){
?>
    <style>
        #registerform > p:first-child{
            display:none;
        }
    </style>

    <script type="text/javascript" src="<?php echo site_url('/wp-includes/js/jquery/jquery.js'); ?>"></script>
    <script type="text/javascript">
        jQuery(document).ready(function($){
            $('#registerform > p:first-child').css('display', 'none');
        });
    </script>
<?php
});

Étape 2: supprimez l'erreur de nom d'utilisateur 

//Remove error for username, only show error for email only.
add_filter('registration_errors', function($wp_error, $sanitized_user_login, $user_email){
    if(isset($wp_error->errors['empty_username'])){
        unset($wp_error->errors['empty_username']);
    }

    if(isset($wp_error->errors['username_exists'])){
        unset($wp_error->errors['username_exists']);
    }
    return $wp_error;
}, 10, 3);

Étape 3: manipulez la fonctionnalité d’enregistrement en arrière-plan. 

add_action('login_form_register', function(){
    if(isset($_POST['user_login']) && isset($_POST['user_email']) && !empty($_POST['user_email'])){
        $_POST['user_login'] = $_POST['user_email'];
    }
});

Mettez le code ci-dessus dans le fichier functions.php de votre thème.

Vous pouvez également télécharger un plugin complet pour y parvenir.

Plugin: https://wordpress.org/plugins/smart-wp-login/

11
Nishant Kumar

L'étape 3 du poste de Nishant Kumars vérifie si isset($_POST['user_login']) n'a pas fonctionné pour moi, car la connexion est ce que nous voulons réellement supprimer.

Ma solution est la suivante (dans le functions.php du thème), également en tant que fonction distincte, pour rester avec le style de code wordpress:

function copy_username_to_email (){
    if(isset($_POST['user_email']) && !empty($_POST['user_email'])){
        $_POST['user_login'] = $_POST['user_email'];
    }
}
add_action('login_form_register', 'copy_username_to_email');
4
mcnesium

@Nishant Kumar a donné la réponse parfaite à cette question, qui devrait être acceptée. Cependant, il y a un problème après la version Wordpress 4.0. De codex -

Remarque: depuis la version 4.0, ces propriétés sont privées, voir [28511] .

Le filtre registration_errors nécessite ici une petite modification.

//Remove error for username, only show error for email only.

add_filter('registration_errors', 'remove_username_empty_error', 10, 3);

function remove_username_empty_error($wp_error, $sanitized_user_login, $user_email){

    if(isset($wp_error->errors['empty_username'])){
        $wp_error->remove('empty_username');
    }    
    if(isset($wp_error->errors['username_exists'])){
        $wp_error->remove('username_exists');
    }
    return $wp_error;
}

Note: Comme l'a mentionné @mcnesium, si nous nous sommes complètement débarrassés du champ du nom d'utilisateur (dans mon cas, j'ai utilisé Theme mon plugin de connexion pour remplacer le formulaire d'enregistrement habituel et que je venais de supprimer le champ du nom d'utilisateur), alors $_POST['user_login'] sera être null et la condition ne correspondra pas du tout. Nous ferions mieux de supprimer cela de la condition suggérée par @mcnesium.

4
maksbd19

En parcourant la réponse de @ nishant-kumar, voici un fichier JS de Vanilla, aucun script JS supplémentaire, 1 étape, aucune modification en arrière-plan nécessaire, solution permettant de créer un formulaire d'inscription avec uniquement l'entrée de courrier électronique:

/** Hook your code to the login / Sign up page **/
add_action('login_head', function(){

    /* Style to hide the user_name field group */
    ?>
    <style>
        #registerform > p:first-child{
            display:none;
        }
    </style>

    <script type="text/javascript">
        /* Execute this action when the DOM is ready AND after everything in the page is loaded */
        let user_email;
        window.addEventListener('load',function() {
            user_email = document.querySelector('[name="user_email"]');
            if(user_email) { // Execute only if there is a user_email field on page
                user_email.addEventListener('keyup',syncUserName);
                user_email.addEventListener('change',syncUserName);
            }
        });

        /* sync user_email's value with the hidden user_login field */
        function syncUserName() {
                document.querySelector('[name="user_login"]').value = user_email.value;
        }

    </script>
<?php
});

Vous devez juste ajouter ce code dans votre fichier functions.php (ou dans votre plugin custom , si vous en avez un)

2
Gfra54

Je pense que toute solution à cette demande va être un "hack", car wordpress requiert un nom d'utilisateur pour tous les utilisateurs enregistrés. Même le plugin mentionné ci-dessus est très probablement juste trouver le nom d'utilisateur via l'adresse e-mail, puis utiliser ce nom d'utilisateur pour se connecter au site.

Si vous êtes d'accord avec un hack, voici un concept qui pourrait fonctionner:

1) Pré-remplissez le champ de nom d'utilisateur de votre formulaire d'inscription avec un numéro unique. L'utilisation de l'horodatage actuel est une bonne idée pour éviter de recevoir des doublons. Vous devez alors masquer ce champ afin que l'utilisateur ne le voie pas à l'écran lorsqu'il remplit son formulaire.

Si vous utilisez jQuery, vous pouvez utiliser quelque chose comme:

$(document).ready(function() {
    var timestamp = (new Date).getTime();
    $('form input.username').val(timestamp);
    $('form input.username').css('display', 'none');
});

Dans cet exemple, "form input.username" serait le sélecteur jQuery pour trouver le champ nom d'utilisateur. Vous devrez vérifier la structure html de votre page pour vous assurer que le sélecteur correspond à la structure.

2) Utilisez un plugin comme celui mentionné précédemment ( http://wordpress.org/extend/plugins/wp-email-login/ ) pour permettre aux utilisateurs de se connecter avec leur adresse email.

1
Matt Keys