web-dev-qa-db-fra.com

Formulaire de connexion personnalisé

Je suis très nouveau sur WordPress. J'essaie d'afficher un formulaire de connexion dans la section en-tête de mon site Web. Cependant, lorsque je regarde tous les fichiers de mon répertoire, c'est très accablant et j'ai peur de toucher à quoi que ce soit.

Est-ce que quelqu'un connaît de bons tutoriels sur le sujet ou peut-être éclaircit la question?

loginwp-login-form
5
Javacadabra

Le formulaire de connexion est un simple formulaire html qui envoie le nom d’utilisateur et le mot de passe à wp-login.php. C'est le moyen le plus simple de créer un formulaire de connexion personnalisé:

<?php
$redirect_to = '';
?>
<form name="loginform" id="loginform" action="<?php echo site_url( '/wp-login.php' ); ?>" method="post">
<p>Username: <input id="user_login" type="text" size="20" value="" name="log"></p>
<p>Password: <input id="user_pass" type="password" size="20" value="" name="pwd"></p>
<p><input id="rememberme" type="checkbox" value="forever" name="rememberme"></p>

<p><input id="wp-submit" type="submit" value="Login" name="wp-submit"></p>

<input type="hidden" value="<?php echo esc_attr( $redirect_to ); ?>" name="redirect_to">
<input type="hidden" value="1" name="testcookie">
</form>

Ligne par ligne:

  • $redirect_to: Si vous souhaitez que l'utilisateur redirige vers une page spéciale, insérez l'URL ici. L'URL sera inséré dans le champ caché à la fin du formulaire
  • <form ... action="...">: Les données doivent être envoyées à wp-login.php. Ce fichier est à la racine de votre installation WordPress. Créez l'URL appropriée avec site_url() (veuillez vous reporter au codex pour plus d'informations sur site_url()). La méthode doit être définie sur post
  • Un champ de saisie pour le nom d'utilisateur avec l'ID user_login
  • Un champ de saisie pour le mot de passe avec l'ID user_pass
  • Un champ de saisie pour la case à cocher 'RememberMe' (facultatif)
  • Un bouton d'envoi
  • Le champ masqué si l'utilisateur doit être redirigé après la connexion (facultatif)
  • Un champ caché pour un testcookie (facultatif, mais utile)

Créez un formulaire et personnalisez-le avec css. C'est tout.

9
Ralf912

  1. Créez un fichier de modèle dans votre répertoire de thème enfant, par exemple login.php. Placez le formulaire de connexion dans ce fichier:

    <form action="" method="post">
  <div>
    User name: <input name="log" type="text" />
  </div>
  <div>
    Password: <input name="pwd" type="password" />
  </div>
  <div>
    <input type="submit" value="Login" />
    <input type="hidden" name="action" value="my_login_action" />
  </div>
</form>

    Changez ce que vous voulez, mais vous devriez laisser les attributs de nom intacts

  2. Créez un fichier functions.php dans votre répertoire de thème enfant ou, si vous en avez un, modifiez-le. Vous allez remplir les demandes de connexion qu'il contient:

    add_action('init', function(){

  // not the login request?
  if(!isset($_POST['action']) || $_POST['action'] !== 'my_login_action')
    return;

  // see the codex for wp_signon()
  $result = wp_signon();

  if(is_wp_error($result))
    wp_die('Login failed. Wrong password or user name?');

  // redirect back to the requested page if login was successful    
  header('Location: ' . $_SERVER['REQUEST_URI']);
  exit;
});

  3. Créez une copie de votre modèle header.php, placez-la dans votre dossier de thèmes enfants et modifiez-la. Ajoutez ce code à l'endroit où vous souhaitez que le formulaire de connexion apparaisse:

    <?php

 if(!is_user_logged_in()){
   get_template_part('login');
 }

?>
7
onetrickpony

En outre, vous pouvez personnaliser le formulaire de connexion d'origine dans votre thème WP.

Il y a quelques choses que vous pouvez faire. 1) Vous pouvez changer le logo Wp:

<?php
//Custom logo
function my_custom_login_logo() {
    echo '<style type="text/css">
        h1 a { background-image:url('.get_bloginfo('template_url').'/images/logo.png) !important; }
    </style>';
}

add_action('login_head', 'my_custom_login_logo');

// Custom login

function my_login_logo_url() {
    return get_bloginfo( 'url' );
}
add_filter( 'login_headerurl', 'my_login_logo_url' );
function my_login_logo_url_title() {
    return '[url]';
}
add_filter( 'login_headertitle', 'my_login_logo_url_title' );

?>

2) Vous pouvez supprimer le tremblement de WP login:

<?php

function my_login_head() {
    remove_action('login_head', 'wp_shake_js', 12);
}
add_action('login_head', 'my_login_head');

?>

3) Supprimer les erreurs de connexion:

<?php

add_filter('login_errors',create_function('$a', "return null;"));

?>

Important: N'utilisez pas toutes ces parties de code pour functions.php. Commencez par en créer trois avec les noms décrivant la function comme (ex my_custom_login_logo.php, my_login_head.php et remove_login_errors.php) puis appelez les 3 fonctions au functions.php e.x. require_once('includes/secure/my_custom_login_logo.php');require_once('includes/secure/my_login_head.php');require_once('includes/secure/remove_login_errors.php');

comprend et sécurisé, sont des dossiers. J'espère vous aider. Bienvenue.

2
user24259

ajouter des codes à wp-login.php. codes de forme ci-dessous.

    <form id="loginform" action="<?php echo site_url( '/wp-login.php' ); ?>" method="POST">

                            <h5><strong>ÜYE GİRİŞİ</strong>  <a href="uyeol.html"><i class="fa fa-gear"></i> ÜYELİK OLUŞTUR.</a></h5>
                            <div class="newsletter-form">

                                <div class="newsletter-email">
                                    <input id="user_login" type="text" name="grs_tcno" value="" placeholder="Kullanıcı">
                                </div>

                                <div class="newsletter-Zip">
                                    <input id="user_pass" type="password" name="grs_sifre" value="" placeholder="Parola">
                                </div>

                                <div class="newsletter-submit">
                                    <input id="wp-submit" type="submit" name="girisyap" value="login">
                                    <input type="hidden" value="<?php echo esc_attr( $redirect_to ); ?>" name="redirect_to">
                                      <input type="hidden" value="1" name="testcookie">
                                    <i class="icons icon-right-thin"></i>
                                </div>

                            </div>
0
Mehmet Şar