Comment afficher le formulaire d'inscription d'utilisateur WordPress au début du site?

Question

Comment afficher le formulaire d’inscription d’utilisateur WordPress (celui qui apparaît dans la page "www.monsiteweb.com/wp-register.php") au début de mon blog?

J'ai personnalisé le formulaire d'inscription. Mais je ne sais pas comment appeler ce formulaire sur la page d'accueil. Tout soutien sera vraiment d'une grande aide.

Merci d'avance. :)

Answer 1

Le processus comprend 2 étapes:

1. montrer le formulaire frontal
2. sauvegarder les données lors de la soumission

Il y a 3 approches différentes qui me viennent à l'esprit pour montrer l'interface:

• utilisez le formulaire d'inscription intégré, les styles d'édition, etc. pour le rendre plus "similaire à l'interface"
• utiliser une page/publication WordPress et afficher le formulaire à l'aide d'un shortcode
• utiliser un modèle dédié qui n'est connecté à aucune page/publication, mais appelé par une URL spécifique

Pour cette réponse, je vais utiliser ce dernier. Les raisons sont:

• utiliser le formulaire d'inscription intégré peut être une bonne idée, les personnalisations profondes peuvent être très difficiles avec le formulaire intégré, et si l'on souhaite également personnaliser les champs du formulaire, la douleur augmente
• utiliser une page WordPress en combinaison avec un shortcode, n'est pas si fiable, et je pense aussi que les shorcodes ne devraient pas être utilisés pour des fonctionnalités, juste pour le formatage et autres

1: Construire l'URL

Nous savons tous que le formulaire d’inscription par défaut d’un site WordPress est souvent une cible pour les spammeurs. L'utilisation d'une URL personnalisée est une aide pour résoudre ce problème. De plus, je souhaite également utiliser un variable url, c’est-à-dire que l’url du formulaire d’enregistrement ne doit pas toujours être identique, ce qui rend la vie des spammeurs plus difficile. L'astuce se fait en utilisant un nonce dans l'URL:

/**
* Generate dynamic registration url
*/
function custom_registration_url() {
  $nonce = urlencode( wp_create_nonce( 'registration_url' ) );
  return home_url( $nonce );
}

/**
* Generate dynamic registration link
*/
function custom_registration_link() {
  $format = '<a href="%s">%s</a>';
  printf(
    $format,
    custom_registration_url(), __( 'Register', 'custom_reg_form' )
  );
}

L'utilisation de cette fonction permet d'afficher facilement dans les modèles un lien vers le formulaire d'enregistrement, même s'il est dynamique.

2: Reconnaître l'URL, premier talon de la classe Custom_Reg\Custom_Reg

Maintenant, nous devons reconnaître l'URL. Pour le but, je vais commencer à écrire un cours, qui sera terminé plus tard dans la réponse:

<?php
// don't save, just a stub
namespace Custom_Reg;

class Custom_Reg {

  function checkUrl() {
    $url_part = $this->getUrl();
    $nonce = urlencode( wp_create_nonce( 'registration_url' ) );
    if ( ( $url_part === $nonce ) ) {
      // do nothing if registration is not allowed or user logged
      if ( is_user_logged_in() || ! get_option('users_can_register') ) {
        wp_safe_redirect( home_url() );
        exit();
      }
      return TRUE;
    }
  }

  protected function getUrl() {
    $home_path = trim( parse_url( home_url(), PHP_URL_PATH ), '/' );
    $relative = trim(str_replace($home_path, '', esc_url(add_query_arg(array()))), '/');
    $parts = explode( '/', $relative );
    if ( ! empty( $parts ) && ! isset( $parts[1] ) ) {
      return $parts[0];
    }
  }

}

La fonction regarde la première partie de l'URL après home_url(), et si elle correspond à notre nonce, elle retourne TRUE. Cette fonction sera utilisée pour vérifier notre demande et effectuer les actions nécessaires pour afficher notre formulaire.

3: la classe Custom_Reg\Form

Je vais maintenant écrire une classe, qui sera responsable de générer le balisage de formulaire. Je l'utiliserai aussi pour stocker dans une propriété le chemin du fichier de modèle à utiliser pour afficher le formulaire.

<?php 
// file: Form.php
namespace Custom_Reg;

class Form {

  protected $fields;

  protected $verb = 'POST';

  protected $template;

  protected $form;

  public function __construct() {
    $this->fields = new \ArrayIterator();
  }

  public function create() {
    do_action( 'custom_reg_form_create', $this );
    $form = $this->open();
    $it =  $this->getFields();
    $it->rewind();
    while( $it->valid() ) {
      $field = $it->current();
      if ( ! $field instanceof FieldInterface ) {
        throw new \DomainException( "Invalid field" );
      }
      $form .= $field->create() . PHP_EOL;
      $it->next();
    }
    do_action( 'custom_reg_form_after_fields', $this );
    $form .= $this->close();
    $this->form = $form;
    add_action( 'custom_registration_form', array( $this, 'output' ), 0 );
  }

  public function output() {
    unset( $GLOBALS['wp_filters']['custom_registration_form'] );
    if ( ! empty( $this->form ) ) {
      echo $this->form;
    }
  }

  public function getTemplate() {
    return $this->template;
  }

  public function setTemplate( $template ) {
    if ( ! is_string( $template ) ) {
      throw new \InvalidArgumentException( "Invalid template" );
    }
    $this->template = $template;
  }

  public function addField( FieldInterface $field ) {
    $hook = 'custom_reg_form_create';
    if ( did_action( $hook ) && current_filter() !== $hook ) {
      throw new \BadMethodCallException( "Add fields before {$hook} is fired" );
    }
    $this->getFields()->append( $field );
  }

  public function getFields() {
    return $this->fields;
  }

  public function getVerb() {
    return $this->verb;
  }

  public function setVerb( $verb ) {
    if ( ! is_string( $verb) ) {
     throw new \InvalidArgumentException( "Invalid verb" );
    }
    $verb = strtoupper($verb);
    if ( in_array($verb, array( 'GET', 'POST' ) ) ) $this->verb = $verb;
  }

  protected function open() {
    $out = sprintf( '<form id="custom_reg_form" method="%s">', $this->verb ) . PHP_EOL;
    $nonce = '<input type="hidden" name="_n" value="%s" />';
    $out .= sprintf( $nonce,  wp_create_nonce( 'custom_reg_form_nonce' ) ) . PHP_EOL;
    $identity = '<input type="hidden" name="custom_reg_form" value="%s" />';
    $out .= sprintf( $identity,  __CLASS__ ) . PHP_EOL;
    return $out;
  }

  protected function close() {
    $submit =  __('Register', 'custom_reg_form');
    $out = sprintf( '<input type="submit" value="%s" />', $submit );
    $out .= '</form>';
    return $out;
  }

}

La classe génère un balisage de formulaire qui boucle tous les champs ajoutés en appelant la méthode create sur chacun d’eux. Chaque champ doit être une instance de Custom_Reg\FieldInterface. Un champ caché supplémentaire est ajouté pour la vérification nonce. La méthode de formulaire est 'POST' par défaut, mais elle peut être définie sur 'GET' à l'aide de la méthode setVerb. Une fois créée, le balisage est enregistré dans la propriété d'objet $form qui est répercutée par la méthode output(), raccordée à 'custom_registration_form' hook: dans le modèle de formulaire, il suffit d'appeler do_action( 'custom_registration_form' ) pour afficher le formulaire.

4: le modèle par défaut

Comme je l'ai dit, le modèle de formulaire peut être facilement remplacé, mais nous avons besoin d'un modèle de base comme solution de secours. J'écrirai ici un modèle très approximatif, davantage une preuve de concept qu'un véritable modèle.

<?php
// file: default_form_template.php
get_header();

global $custom_reg_form_done, $custom_reg_form_error;

if ( isset( $custom_reg_form_done ) && $custom_reg_form_done ) {
  echo '<p class="success">';
  _e(
    'Thank you, your registration was submitted, check your email.',
    'custom_reg_form'
  );
  echo '</p>';
} else {
  if ( $custom_reg_form_error ) {
    echo '<p class="error">' . $custom_reg_form_error  . '</p>';
  }
  do_action( 'custom_registration_form' );
}

get_footer();

5: l'interface Custom_Reg\FieldInterface

Chaque champ doit être un objet qui implémente l'interface suivante

<?php 
// file: FieldInterface.php
namespace Custom_Reg;

interface FieldInterface {

  /**
   * Return the field id, used to name the request value and for the 'name' param of
   * html input field
   */
  public function getId();

  /**
   * Return the filter constant that must be used with
   * filter_input so get the value from request
   */
  public function getFilter();

  /**
   * Return true if the used value passed as argument should be accepted, false if not
   */
  public function isValid( $value = NULL );

  /**
   * Return true if field is required, false if not
   */
  public function isRequired();

  /**
   * Return the field input markup. The 'name' param must be output 
   * according to getId()
   */
  public function create( $value = '');
}

Je pense que les commentaires expliquent ce que les classes implémentant cette interface devraient faire.

6: Ajout de champs

Maintenant nous avons besoin de champs. Nous pouvons créer un fichier appelé 'fields.php' où nous définissons les classes de champs:

<?php
// file: fields.php
namespace Custom_Reg;

abstract class BaseField implements FieldInterface {

  protected function getType() {
    return isset( $this->type ) ? $this->type : 'text';
  }

  protected function getClass() {
    $type = $this->getType();
    if ( ! empty($type) ) return "{$type}-field";
  }

  public function getFilter() {
    return FILTER_SANITIZE_STRING;
  }

  public function isRequired() {
    return isset( $this->required ) ? $this->required : FALSE;
  }

  public function isValid( $value = NULL ) {
    if ( $this->isRequired() ) {
      return $value != '';
    }
    return TRUE;
  }

  public function create( $value = '' ) {
    $label = '<p><label>' . $this->getLabel() . '</label>';
    $format = '<input type="%s" name="%s" value="%s" class="%s"%s /></p>';
    $required = $this->isRequired() ? ' required' : '';
    return $label . sprintf(
      $format,
      $this->getType(), $this->getId(), $value, $this->getClass(), $required
    );
  }

  abstract function getLabel();
}


class FullName extends BaseField {

  protected $required = TRUE;

  public function getID() {
    return 'fullname';
  }

  public function getLabel() {
    return __( 'Full Name', 'custom_reg_form' );
  }

}

class Login extends BaseField {

  protected $required = TRUE;

  public function getID() {
    return 'login';
  }

  public function getLabel() {
    return __( 'Username', 'custom_reg_form' );
  }
}

class Email extends BaseField {

  protected $type = 'email';

  public function getID() {
    return 'email';
  }

  public function getLabel() {
    return __( 'Email', 'custom_reg_form' );
  }

  public function isValid( $value = NULL ) {
    return ! empty( $value ) && filter_var( $value, FILTER_VALIDATE_EMAIL );
  }
}

class Country extends BaseField {

  protected $required = FALSE;

  public function getID() {
    return 'country';
  }

  public function getLabel() {
    return __( 'Country', 'custom_reg_form' );
  }
}

J'ai utilisé une classe de base pour définir la mise en œuvre par défaut de l'interface. Toutefois, il est possible d'ajouter des champs très personnalisés implémentant directement l'interface ou étendant la classe de base et redéfinissant certaines méthodes.

À ce stade, nous avons tout pour afficher le formulaire, nous avons maintenant besoin de quelque chose pour valider et enregistrer les champs.

7: La classe Custom_Reg\Saver

<?php
// file: Saver.php
namespace Custom_Reg;

class Saver {

  protected $fields;

  protected $user = array( 'user_login' => NULL, 'user_email' => NULL );

  protected $meta = array();

  protected $error;

  public function setFields( \ArrayIterator $fields ) {
    $this->fields = $fields;
  }

  /**
  * validate all the fields
  */
  public function validate() {
    // if registration is not allowed return false
    if ( ! get_option('users_can_register') ) return FALSE;
    // if no fields are setted return FALSE
    if ( ! $this->getFields() instanceof \ArrayIterator ) return FALSE;
    // first check nonce
    $nonce = $this->getValue( '_n' );
    if ( $nonce !== wp_create_nonce( 'custom_reg_form_nonce' ) ) return FALSE;
    // then check all fields
    $it =  $this->getFields();
    while( $it->valid() ) {
      $field = $it->current();
      $key = $field->getID();
      if ( ! $field instanceof FieldInterface ) {
        throw new \DomainException( "Invalid field" );
      }
      $value = $this->getValue( $key, $field->getFilter() );
      if ( $field->isRequired() && empty($value) ) {
        $this->error = sprintf( __('%s is required', 'custom_reg_form' ), $key );
        return FALSE;
      }
      if ( ! $field->isValid( $value ) ) {
        $this->error = sprintf( __('%s is not valid', 'custom_reg_form' ), $key );
        return FALSE;
      }
      if ( in_array( "user_{$key}", array_keys($this->user) ) ) {
        $this->user["user_{$key}"] = $value;
      } else {
        $this->meta[$key] = $value;
      }
      $it->next();
    }
    return TRUE;
  }

  /**
  * Save the user using core register_new_user that handle username and email check
  * and also sending email to new user
  * in addition save all other custom data in user meta
  *
  * @see register_new_user()
  */
  public function save() {
    // if registration is not allowed return false
    if ( ! get_option('users_can_register') ) return FALSE;
    // check mandatory fields
    if ( ! isset($this->user['user_login']) || ! isset($this->user['user_email']) ) {
      return false;
    }
    $user = register_new_user( $this->user['user_login'], $this->user['user_email'] );
    if ( is_numeric($user) ) {
      if ( ! update_user_meta( $user, 'custom_data', $this->meta ) ) {
        wp_delete_user($user);
        return FALSE;
      }
      return TRUE;
    } elseif ( is_wp_error( $user ) ) {
      $this->error = $user->get_error_message();
    }
    return FALSE;
  }

  public function getValue( $var, $filter = FILTER_SANITIZE_STRING ) {
    if ( ! is_string($var) ) {
      throw new \InvalidArgumentException( "Invalid value" );
    }
    $method = strtoupper( filter_input( INPUT_SERVER, 'REQUEST_METHOD' ) );
    $type = $method === 'GET' ? INPUT_GET : INPUT_POST;
    $val = filter_input( $type, $var, $filter );
    return $val;
  }

  public function getFields() {
    return $this->fields;
  }

  public function getErrorMessage() {
    return $this->error;
  }

}

Cette classe a 2 méthodes principales, une (validate) qui boucle les champs, les valide et enregistre les bonnes données dans un tableau, la seconde (save) enregistre toutes les données de la base de données et envoie le mot de passe par courrier électronique au nouvel utilisateur.

8: Utilisation de classes définies: terminer la classe Custom_Reg

Maintenant nous pouvons travailler à nouveau sur la classe Custom_Reg, en ajoutant les méthodes qui "collent" l'objet défini et les font fonctionner

<?php 
// file Custom_Reg.php
namespace Custom_Reg;

class Custom_Reg {

  protected $form;

  protected $saver;

  function __construct( Form $form, Saver $saver ) {
    $this->form = $form;
    $this->saver = $saver;
  }

  /**
   * Check if the url to recognize is the one for the registration form page
   */
  function checkUrl() {
    $url_part = $this->getUrl();
    $nonce = urlencode( wp_create_nonce( 'registration_url' ) );
    if ( ( $url_part === $nonce ) ) {
      // do nothing if registration is not allowed or user logged
      if ( is_user_logged_in() || ! get_option('users_can_register') ) {
        wp_safe_redirect( home_url() );
        exit();
      }
      return TRUE;
    }
  }

  /**
   * Init the form, if submitted validate and save, if not just display it
   */
  function init() {
    if ( $this->checkUrl() !== TRUE ) return;
    do_action( 'custom_reg_form_init', $this->form );
    if ( $this->isSubmitted() ) {
      $this->save();
    }
    // don't need to create form if already saved
    if ( ! isset( $custom_reg_form_done ) || ! $custom_reg_form_done ) {
      $this->form->create();
    }
    load_template( $this->getTemplate() );
    exit();
  }

  protected function save() {
    global $custom_reg_form_error;
    $this->saver->setFields( $this->form->getFields() );
    if ( $this->saver->validate() === TRUE ) { // validate?
      if ( $this->saver->save() ) { // saved?
        global $custom_reg_form_done;
        $custom_reg_form_done = TRUE;
      } else { // saving error
        $err =  $this->saver->getErrorMessage(); 
        $custom_reg_form_error = $err ? : __( 'Error on save.', 'custom_reg_form' );
      }
    } else { // validation error
       $custom_reg_form_error = $this->saver->getErrorMessage();
    }
  }

  protected function isSubmitted() {
    $type = $this->form->getVerb() === 'GET' ? INPUT_GET : INPUT_POST;
    $sub = filter_input( $type, 'custom_reg_form', FILTER_SANITIZE_STRING );
    return ( ! empty( $sub ) && $sub === get_class( $this->form ) );
  }

  protected function getTemplate() {
    $base = $this->form->getTemplate() ? : FALSE;
    $template = FALSE;
    $default = dirname( __FILE__ ) . '/default_form_template.php';
    if ( ! empty( $base ) ) {
      $template = locate_template( $base );
    }
    return $template ? : $default;
  }

   protected function getUrl() {
    $home_path = trim( parse_url( home_url(), PHP_URL_PATH ), '/' );
    $relative = trim( str_replace( $home_path, '', add_query_arg( array() ) ), '/' );
    $parts = explode( '/', $relative );
    if ( ! empty( $parts ) && ! isset( $parts[1] ) ) {
      return $parts[0];
    }
  }

}

Le constructeur de la classe accepte une instance de Form et une de Saver.

La méthode init() (à l'aide de checkUrl()) examine la première partie de l'URL après home_url() et, si elle correspond au nonce correct, vérifie si le formulaire a déjà été soumis. Si c'est le cas, utilisez l'objet Saver, validez et enregistrez les données utilisateur, sinon Imprimez simplement le formulaire.

La méthode init() déclenche également le hook d’action 'custom_reg_form_init' en passant l’instance de formulaire en argument: ce hook devrait être utilisé pour ajouter des champs, pour configurer le modèle personnalisé et pour personnaliser la méthode de formulaire.

9: Assembler les choses

Maintenant, nous devons écrire le fichier de plugin principal, où nous pouvons

• exiger tous les fichiers
• charger le textdomain
• processus de démarrage entier en utilisant la classe instanciation Custom_Reg et appelez la méthode init() avec un point d’accroché relativement précoce
• utilisez le 'custom_reg_form_init' pour ajouter les champs à la classe de formulaire

Alors:

<?php 
/**
 * Plugin Name: Custom Registration Form
 * Description: Just a rough plugin example to answer a WPSE question
 * Plugin URI: https://wordpress.stackexchange.com/questions/10309/
 * Author: G. M.
 * Author URI: https://wordpress.stackexchange.com/users/35541/g-m
 *
 */

if ( is_admin() ) return; // this plugin is all about frontend

load_plugin_textdomain(
  'custom_reg_form',
  FALSE,
  plugin_dir_path( __FILE__ ) . 'langs'
); 

require_once plugin_dir_path( __FILE__ ) . 'FieldInterface.php';
require_once plugin_dir_path( __FILE__ ) . 'fields.php';
require_once plugin_dir_path( __FILE__ ) . 'Form.php';
require_once plugin_dir_path( __FILE__ ) . 'Saver.php';
require_once plugin_dir_path( __FILE__ ) . 'CustomReg.php';

/**
* Generate dynamic registration url
*/
function custom_registration_url() {
  $nonce = urlencode( wp_create_nonce( 'registration_url' ) );
  return home_url( $nonce );
}

/**
* Generate dynamic registration link
*/
function custom_registration_link() {
  $format = '<a href="%s">%s</a>';
  printf(
    $format,
    custom_registration_url(), __( 'Register', 'custom_reg_form' )
  );
}

/**
* Setup, show and save the form
*/
add_action( 'wp_loaded', function() {
  try {
    $form = new Custom_Reg\Form;
    $saver = new Custom_Reg\Saver;
    $custom_reg = new Custom_Reg\Custom_Reg( $form, $saver );
    $custom_reg->init();
  } catch ( Exception $e ) {
    if ( defined('WP_DEBUG') && WP_DEBUG ) {
      $msg = 'Exception on  ' . __FUNCTION__;
      $msg .= ', Type: ' . get_class( $e ) . ', Message: ';
      $msg .= $e->getMessage() ? : 'Unknown error';
      error_log( $msg );
    }
    wp_safe_redirect( home_url() );
  }
}, 0 );

/**
* Add fields to form
*/
add_action( 'custom_reg_form_init', function( $form ) {
  $classes = array(
    'Custom_Reg\FullName',
    'Custom_Reg\Login',
    'Custom_Reg\Email',
    'Custom_Reg\Country'
  );
  foreach ( $classes as $class ) {
    $form->addField( new $class );
  }
}, 1 );

10: tâches manquantes

Maintenant tout est fini. Nous venons de personnaliser le modèle, en ajoutant probablement un fichier de modèle personnalisé dans notre thème.

Nous pouvons ajouter des styles et des scripts spécifiques uniquement à la page d'inscription personnalisée de cette manière.

add_action( 'wp_enqueue_scripts', function() {
  // if not on custom registration form do nothing
  if ( did_action('custom_reg_form_init') ) {
    wp_enqueue_style( ... );
    wp_enqueue_script( ... );
  }
});

En utilisant cette méthode, nous pouvons mettre en file d'attente certains scripts js afin de gérer la validation côté client, par exemple. celui-là . Le balisage nécessaire au bon fonctionnement de ce script peut être facilement manipulé en modifiant la classe Custom_Reg\BaseField.

Si nous voulons personnaliser le courrier électronique d'inscription, nous pouvons utiliser méthode standard et enregistrer les données personnalisées sur méta, nous pouvons les utiliser dans le courrier électronique.

La dernière tâche que nous souhaitons probablement mettre en œuvre est d'empêcher la demande d'inscription au formulaire d'enregistrement par défaut, aussi simple que:

add_action( 'login_form_register', function() { exit(); } );

Tous les fichiers peuvent être trouvés dans un Gist ici .

Answer 2

TLDR; Mettez la forme suivante dans votre thème, les attributs name et id sont importants:

<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>

J'ai trouvé un excellent article sur Tutsplus sur Créer un formulaire d'inscription Wordpress de fantaisie à partir de zéro . Cela passe beaucoup de temps à mettre en forme le formulaire, mais la section suivante est assez simple sur le code wordpress requis:

Étape 4. WordPress

Il n'y a rien d'extraordinaire ici; nous n'avons besoin que de deux extraits WordPress, cachés dans le fichier wp-login.php.

Le premier extrait:

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

Et:

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

Edit: J'ai ajouté le dernier bit de l'article pour expliquer où placer les extraits de code ci-dessus - il s'agit simplement d'un formulaire qui peut être inséré dans n'importe quel modèle de page ou barre latérale ou en faire un shortcode. . La section importante est la form qui contient les extraits ci-dessus et les champs obligatoires importants.

Le code final devrait ressembler à ceci:

<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 -->

Veuillez noter qu'il est vraiment important , et nécessaire, d'avoir user_login en tant que name et en tant qu'attribut id dans votre entrée de texte; il en va de même pour l'entrée de courrier électronique. Sinon, ça ne marchera pas.

Et avec ça, nous avons fini!

Answer 3

this Article fournit un excellent tutoriel sur la création de vos propres formulaires d’inscription/connexion/restauration de mot de passe frontal.

ou si vous êtes à la recherche d'un plugin, j'ai déjà utilisé ceux-ci et je les recommande:

• Ajax Connexion/Inscription
• Connectez-vous avec Ajax

Answer 4

Il y a quelque temps, j'ai créé un site Web affichant un formulaire d'inscription personnalisé au recto. Ce site n'est plus en ligne mais voici quelques captures d'écran. 

Voici les étapes que j'ai suivies:

1) Activez la possibilité pour tous les visiteurs de demander un nouveau compte via l'option Paramètres> Général> Adhésion. La page d'inscription apparaît maintenant à l'URL /wp-login.php?action=register

2) Personnalisez le formulaire d'inscription de sorte qu'il ressemble à votre site. Ceci est plus compliqué et dépend du thème que vous utilisez.

Voici un exemple avec vingt-treize:

// 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
}

Modifiez ensuite la feuille de style du thème pour que le formulaire apparaisse comme vous le souhaitez.

3) Vous pouvez modifier le formulaire en modifiant les messages affichés:

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) Si vous avez besoin d'un formulaire d'inscription front-end, vous ne voudrez probablement pas que les utilisateurs enregistrés voient le backend lorsqu'ils se connectent.

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();
}

Il y a beaucoup d'étapes, mais le résultat est là!

Answer 5

Plus facile: utilisez une fonction WordPress appelée wp_login_form() ( page Codex ici ).

Vous pouvez créer votre propre plugin pour pouvoir utiliser un shortcode sur l'une de vos 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>';

}

Tout ce que vous avez à faire est de styliser votre formulaire sur le front-end.