Crea un flusso utente WordPress personalizzato - Parte 2 registrazione nuovo utente

Nel primo tutorial di questa serie sulla personalizzazione dell'esperienza di accesso di WordPress, abbiamo creato un plug-in che consente di sostituire la schermata di accesso di WordPress con una pagina personalizzata. Oggi faremo un ulteriore passo avanti e sostituiremo il nuovo flusso di registrazione degli utenti allo stesso modo.

I motivi per personalizzare la pagina di accesso che abbiamo delineato nella Parte 1 (associando la pagina di registrazione al tema del tuo sito per nascondere WordPress e rendere l'esperienza utente senza problemi) si applicano anche alla registrazione di nuovi utenti, ma ci sono anche alcuni motivi più specifici per cui potresti vuoi creare la tua pagina di registrazione:

  • Innanzitutto, al momento della registrazione, potresti voler cambiare i campi che chiedi ai tuoi nuovi membri, aggiungere campi aggiuntivi o magari lasciarne alcuni. Ad esempio, in questo tutorial, rimuoveremo il campo del nome utente e utilizzeremo invece l'indirizzo email del nuovo utente come login.
  • In secondo luogo, c'è lo spam di registrazione. Quando ho aperto per la prima volta le registrazioni a tutti sul mio sito, non ci sono volute più di poche ore per la prima registrazione spam, la successiva successiva subito dopo. L'aggiunta di un campo reCAPTCHA su una pagina di registrazione personalizzata è un buon modo per gestirlo mantenendo l'esperienza dell'utente coerente.
  • Infine, potresti voler eseguire alcune azioni personalizzate alla registrazione, ad esempio aggiungendo il nuovo utente alla tua mailing list. Dopo aver creato il tuo flusso di registrazione, questo sarà più facile che mai.

Quindi, dotato di questa serie di motivi, iniziamo. 

In questo tutorial, imparerai come sostituire la schermata di registrazione di WordPress con una pagina personalizzata e implementare la registrazione con il tuo codice, senza violare i principi di progettazione di WordPress. 

La funzionalità sarà costruita sopra il plug-in che abbiamo creato nella parte 1 della serie di tutorial, quindi se non l'hai ancora letto, è una buona idea iniziare esaminando quel tutorial. Puoi scrivere tu stesso il codice mentre segui il tutorial o scaricare il codice di esempio dal progetto Github del tutorial.

Aggiungi una nuova pagina di registrazione utente personalizzata

La pagina di registrazione dei nuovi utenti di WordPress predefinita all'indirizzo wp-login.php? action = registro Somiglia a questo:

Non male, ma a meno che tu non stia utilizzando WordPress.org, probabilmente non è coerente con il tuo blog o il design del tuo sito web. 

Nota: se non riesci ad accedere alla pagina di registrazione sul tuo sito WordPress, è perché di default WordPress non consente ai nuovi utenti di registrarsi. Per cambiare questo, vai al impostazioni generali pagina nella dashboard di amministrazione e seleziona la casella di controllo prima di "Chiunque può registrarsiQuindi, salvare le impostazioni e tornare alla pagina di registrazione.

Nella prima parte della serie, abbiamo creato una pagina personalizzata per la visualizzazione del modulo di accesso e uno shortcode utilizzato per posizionare il modulo di accesso su quella pagina. Ora, faremo lo stesso per la registrazione: in primo luogo, creeremo uno shortcode per la visualizzazione del modulo di registrazione e quindi una pagina in cui verrà inserito questo shortcode.

È anche possibile posizionare lo shortcode su una pagina diversa o avere i moduli di login e registrazione su una singola pagina.

Passaggio 1: creare lo Shortcode

Basandoci sul plugin creato nella parte 1 della serie, iniziamo aggiungendo uno shortcode per la pagina di registrazione.

Alla fine della classe del plugin (Personalize_Login_PluginCostruttore, aggiungere la seguente definizione di shortcode:

add_shortcode ('custom-register-form', array ($ this, 'render_register_form'));

Quindi, crea la funzione responsabile per il rendering del nuovo modulo di registrazione utente:

/ ** * Un shortcode per il rendering del nuovo modulo di registrazione dell'utente. * * @param array $ attributi Attributi shortcode. * @param stringa $ contenuto Il contenuto del testo per lo shortcode. Non usato. * * @return string L'output shortcode * / public function render_register_form ($ attributes, $ content = null) // Analizza attributi shortcode $ default_attributes = array ('show_title' => false); $ attributes = shortcode_atts ($ default_attributes, $ attributes); if (is_user_logged_in ()) return __ ('Sei già iscritto.', 'personalize-login');  elseif (! get_option ('users_can_register')) return __ ('Registrazione di nuovi utenti non è attualmente consentito.', 'personalize-login');  else return $ this-> get_template_html ('register_form', $ attributes); 

Se hai già letto la Parte 1 della serie, noterai molte somiglianze tra questa funzione e la funzione di rendering del modulo di accesso da quel tutorial. 

Innanzitutto, via linee 10-12, noterai che lo shortcode accetta un attributo mostra titolo, utilizzato per definire se un titolo debba essere reso dallo shortcode o meno.

In secondo luogo, il modulo di registrazione non viene mostrato agli utenti che hanno già effettuato l'accesso (linee 14-15). Il messaggio restituito al posto del modulo è abbastanza semplice, quindi a seconda delle esigenze, potresti voler sostituire questo pezzo di codice con qualcosa di più elaborato, ad esempio un link alla dashboard. 

Un nuovo elemento è il controllo per l'opzione WordPress users_can_register sopra riga 16. Questa opzione è controllata da WordPress impostazioni generali campo Chiunque può registrarsi menzionato sopra. Per garantire che rispettiamo le impostazioni definite dall'utente in WordPress, non dovremmo visualizzare il modulo di registrazione se l'impostazione è impostata su falso. Invece, come vedi linea 17, la funzione restituirà una notifica sulla chiusura della registrazione.

Il rendering effettivo del modulo di registrazione è fatto su riga 19 usando un modello PHP, register_form.php, situato nel modelli directory che abbiamo creato nel tutorial precedente. Vedere la Parte 1 per una spiegazione più lunga su come funziona così come il codice per la funzione utilizzata, get_template_html.

Ora, aggiungiamo il modello di modulo di registrazione.

Passaggio 2: creare il modulo di registrazione

Nel modelli directory, aggiungere un nuovo file PHP e nominarlo register_form.php. Quindi, continua aggiungendo un modulo di registrazione con i campi che desideri riempire con il nuovo utente.

Ecco la versione che ho creato per questo tutorial; un modulo di registrazione piuttosto standard con campi per l'email, il nome e il cognome dell'utente. Il modulo non contiene un campo separato per un nome utente in quanto l'indirizzo email raddoppierà come uno.

Proprio come la nuova registrazione utente di WordPress, la nostra versione genererà la password e la invierà via email al nuovo utente. Questo serve come semplice controllo via email (l'utente non sarà in grado di accedere senza inserire un indirizzo email valido) e impone un certo livello di sicurezza della password. 

Naturalmente, questo approccio ha il proprio rischio per la sicurezza sotto forma di e-mailing password, quindi è una buona idea chiedere (o addirittura richiedere) all'utente di cambiare la password una volta loggato.

Sopra linee 2-4, il modello rende un titolo per il modulo se il mostra titolo l'attributo è impostato.

Quindi, via linea 6, dai un'occhiata al azione parametro: il modulo viene inviato all'URL di registrazione di WordPress predefinito che possiamo recuperare utilizzando la funzione wp_registration_url. Ne parleremo presto, ma menzionerò già ora che questo non significa che lasceremo che WordPress gestisca la registrazione ...

Il resto del modello è un modulo HTML piuttosto standard con campi per e-mail, nome e cognome.

Prima di vedere lo shortcode in azione, dobbiamo ancora creare la pagina di registrazione e posizionarci sopra lo shortcode.

Passaggio 3: creare la nuova pagina di registrazione dell'utente

Per mostrare il modulo di registrazione, è necessario aggiungere il seguente codice su una pagina WordPress:

[Modulo personalizzato-registrare-]

Questa potrebbe essere qualsiasi pagina, ma per ora, creiamo una nuova pagina per il modulo di registrazione.

Nella parte precedente, abbiamo creato una funzione, plugin_activated, per creare le pagine del plugin all'attivazione del plugin. All'interno della funzione, abbiamo aggiunto un array per la memorizzazione di tutte le pagine che il plugin dovrebbe creare. 

Ora, aggiungiamo le informazioni sulla nuova pagina all'array. Dopo l'aggiunta, la definizione dell'array dovrebbe apparire come questa, con la nuova pagina (con lo slug membro-registro) definito per ultimo:

// Informazioni necessarie per creare le pagine del plugin $ page_definitions = array ('member-login' => array ('title' => __ ('Accedi', 'personalize-login'), 'contenuto' => '[personalizzato -login-form] '),' member-account '=> array (' title '=> __ (' Il tuo account ',' personalize-login '),' content '=>' [account-info] '), 'member-register' => array ('title' => __ ('Register', 'personalize-login'), 'content' => '[custom-register-form]'),);

Il gancio di attivazione viene eseguito solo quando viene attivato un plug-in, quindi andare avanti e disattivare e quindi attivare il plug-in su plugin pagina. Ora, quando navighi verso l'URL http: /// I membri registrati, dovresti vedere qualcosa del genere (usando l'attuale tema predefinito di WordPress, Ventiquindici):

Passaggio 4: reindirizzare l'utente alla nostra nuova pagina di registrazione

Prima di passare all'esecuzione dell'azione di registrazione, assicuriamoci che l'utente venga sempre reindirizzato a questa nuova pagina di registrazione anziché alla nuova pagina utente predefinita a wp-login.php? action = registro.

Per fare questo, useremo il gancio di azione login_form_ azione che, come potresti ricordare dalla prima parte, viene sparato prima di ogni azione in wp-login.php. Come vedi dal link sopra, l'azione in questo caso è Registrare, e così, collegheremo la nostra funzione a login_form_register.

Nel costruttore del plugin, aggiungi la seguente riga:

add_action ('login_form_register', array ($ this, 'redirect_to_custom_register'));

Quindi, creare la funzione di callback:

/ ** * Reindirizza l'utente alla pagina di registrazione personalizzata invece * di wp-login.php? Action = register. * / public function redirect_to_custom_register () if ('GET' == $ _SERVER ['REQUEST_METHOD']) if (is_user_logged_in ()) $ this-> redirect_logged_in_user ();  else wp_redirect (home_url ('member-register'));  Uscita; 

Come abbiamo agganciato la funzione al login_form_register azione, sappiamo che l'utente sta tentando di accedere al nuovo modulo di registrazione dell'utente o di pubblicarlo.

Ecco perché la prima cosa che facciamo in questa funzione (su linea 6) Controlla il metodo di richiesta utilizzato per accedere alla pagina: il reindirizzamento viene eseguito solo su OTTENERE richieste come il INVIARE la richiesta sarà riservata per l'esecuzione dell'azione di registrazione. Di più su questo presto.

Quindi, la funzione continua controllando se l'utente ha già effettuato l'accesso (linea 7). 

Gli utenti connessi vengono reindirizzati alla pagina dell'account (o al dashboard dell'amministratore, se sono amministratori) utilizzando la funzione redirect_logged_in_user che abbiamo creato nella Parte 1. I visitatori vengono reindirizzati alla nostra nuova pagina, membro-registro.

Ora, con la pagina e il modulo sul posto, passiamo a ciò che accade quando l'utente invia il modulo.

Registra un nuovo utente

Quando l'utente invia il nuovo modulo di registrazione utente, i suoi contenuti sono pubblicati su wp-login.php? action = registro, lo stesso URL che abbiamo usato per reindirizzare l'utente alla pagina di registrazione sopra. 

Per fare le personalizzazioni menzionate in precedenza (soprattutto, usando l'indirizzo e-mail come nome utente) dovremo sostituire questa funzionalità con il nostro codice. Per fare ciò, creeremo innanzitutto una funzione per registrare un nuovo utente a livello di codice e quindi richiamare questa funzione in un gestore di azioni.

Passaggio 1: creare l'utente

Iniziamo con la creazione di una funzione che può essere utilizzata per registrare un nuovo utente utilizzando i dati raccolti dal modulo qui sopra: indirizzo email, nome e cognome. L'indirizzo email sarà l'unico identificatore univoco e il resto è solo qualcosa di carino da avere.

Nella classe plugin, aggiungi la seguente funzione privata:

/ ** * Convalida e quindi completa la nuova procedura di registrazione utente se tutto è andato a buon fine. * * @param string $ email L'indirizzo email del nuovo utente * @param stringa $ first_name Il nome del nuovo utente * @param stringa $ last_name Il cognome del nuovo utente * * @return int | WP_Error L'id dell'utente che è stato creato, o errore se fallito. * / private register_user ($ email, $ first_name, $ last_name) $ errors = new WP_Error (); // L'indirizzo email viene utilizzato sia come nome utente sia come indirizzo email. È anche l'unico parametro // che dobbiamo verificare se (! Is_email ($ email)) $ errors-> add ('email', $ this-> get_error_message ('email')); restituire $ errori;  if (username_exists ($ email) || email_exists ($ email)) $ errors-> add ('email_exists', $ this-> get_error_message ('email_exists')); restituire $ errori;  // Genera la password in modo che l'abbonato debba controllare l'e-mail ... $ password = wp_generate_password (12, false); $ user_data = array ('user_login' => $ email, 'user_email' => $ email, 'user_pass' => $ password, 'first_name' => $ first_name, 'last_name' => $ last_name, 'nickname' => $ first_name,); $ user_id = wp_insert_user ($ user_data); wp_new_user_notification ($ user_id, $ password); return $ user_id; 

Come accennato in precedenza, l'indirizzo email è l'unico identificativo univoco e anche l'unico parametro richiesto. Ecco perché iniziamo la funzione convalidando il suo valore. Innanzitutto riga 15, noi convalidiamo l'indirizzo email e poi, via riga 20 verifichiamo che l'indirizzo email non sia già in uso. Se una delle convalide fallisce, a Wp_Error oggetto viene restituito. Torneremo a visualizzare questi errori al più presto.

Se tutto va bene e non vengono trovati errori, la funzione continua generando una password linea 26.

Sopra righe 28-37, troverai il nucleo di questa funzione, la creazione del nuovo utente. L'utente viene aggiunto utilizzando la funzione WordPress wp_insert_user. (linea 37). Come unico parametro, la funzione accetta un array associativo con informazioni sull'utente che si sta creando. Come vedrai righe 28-35, noi usiamo $ e-mail sia per il nome utente (Login utente) e e-mail (e-mail) campi. Per un elenco completo dei campi che possono essere inclusi nell'array degli attributi, dai un'occhiata al codice WordPress.

Dopo aver creato l'utente, attivo linea 38, la funzione chiama wp_new_user_notification per inviare la password generata al nuovo utente e per notificare l'amministratore del sito del nuovo utente. 

Passaggio 2: Chiama il codice di registrazione quando un utente invia il modulo

Ora che abbiamo scritto il codice per la registrazione dell'utente, possiamo chiamarlo quando viene inviato il modulo di registrazione.

In precedenza, quando abbiamo aggiunto il reindirizzamento alla nostra pagina di registrazione personalizzata utilizzando l'azione login_form_register, Ho detto che avremmo usato la stessa azione anche per gestire il INVIARE richieste.

Come spesso accade nella programmazione, questo non è l'unico modo in cui possiamo gestire la nuova registrazione dell'utente, ma ha un vantaggio piuttosto importante: in questo modo, ci assicureremo che nessuno possa accidentalmente accedere al codice di registrazione predefinito in WordPress.

Per chiarezza, aggiungiamo una funzione separata e leghiamo alla stessa azione (tecnicamente, non vi è alcun motivo per cui non si possa altrettanto bene aggiungere questo codice alla funzione di reindirizzamento creata in precedenza). 

Nel costruttore della classe plugin, aggiungi una nuova definizione di azione:

add_action ('login_form_register', array ($ this, 'do_register_user'));

Quindi, crea la funzione:

/ ** * Gestisce la registrazione di un nuovo utente. * * Utilizzato tramite il gancio di azione "login_form_register" attivato su wp-login.php * quando si accede tramite l'azione di registrazione. * / public function do_register_user () if ('POST' == $ _SERVER ['REQUEST_METHOD']) $ redirect_url = home_url ('member-register'); if (! get_option ('users_can_register')) // Registrazione chiusa, visualizza errore $ redirect_url = add_query_arg ('register-errors', 'closed', $ redirect_url);  else $ email = $ _POST ['email']; $ first_name = sanitize_text_field ($ _POST ['first_name']); $ last_name = sanitize_text_field ($ _POST ['last_name']); $ result = $ this-> register_user ($ email, $ first_name, $ last_name); if (is_wp_error ($ result)) // Analizza gli errori in una stringa e append come parametro per reindirizzare $ errors = join (',', $ result-> get_error_codes ()); $ redirect_url = add_query_arg ('register-errors', $ errors, $ redirect_url);  else // Success, reindirizza alla pagina di accesso. $ redirect_url = home_url ('member-login'); $ redirect_url = add_query_arg ('registered', $ email, $ redirect_url);  wp_redirect ($ redirect_url); Uscita; 

La funzione inizia con un controllo del metodo di richiesta linea 8: la funzione è collegata all'azione WordPress login_form_register, lo stesso che abbiamo usato per reindirizzare l'utente, e il metodo di richiesta è ciò che differenzia i due usi l'uno dall'altro.

Sopra linea 11, verifichiamo che è consentita la registrazione di nuovi utenti. In caso contrario, l'utente viene reindirizzato alla pagina di registrazione con un codice di errore (chiuso) come parametro di query (register-errori).

D'altra parte, se la registrazione è aperta, la funzione raccoglie i parametri richiesti (righe 15-17) Dai dati della richiesta e li utilizza per chiamare la funzione creata in precedenza (riga 19) per creare il nuovo utente.

Dopo il register_user chiamata, la funzione reindirizza l'utente nel posto corretto a seconda che la nuova registrazione utente abbia avuto successo o meno: 

  • Dopo un reindirizzamento riuscito, l'utente viene reindirizzato alla pagina di accesso, con il parametro $ registrati indicando che un nuovo utente è stato appena creato. 
  • In caso di errore, il reindirizzamento torna al modulo di registrazione con i codici di errore della nuova funzione di registrazione utente combinati in un elenco separato da virgole e inclusi nella richiesta (righe 23-24).

Passaggio 3: Visualizza errori e messaggi di successo

Come abbiamo visto sopra, la funzione di registrazione reindirizza l'utente alla pagina di login se la registrazione è andata a buon fine e torna alla pagina di registrazione se c'erano errori, con lo stato passato come parametro di richiesta.

Ora aggiungiamo del codice per visualizzare quei messaggi all'utente, iniziando con i messaggi di errore sulla nuova pagina di registrazione dell'utente.

Nel render_register_form, aggiungi il seguente pezzo di codice subito prima di rendere il modello:

// Recupera possibili errori dai parametri di richiesta $ attributes ['errors'] = array (); if (isset ($ _REQUEST ['register-errors'])) $ error_codes = explode (',', $ _REQUEST ['register-errors']); foreach ($ error_codes as $ error_code) $ attributes ['errors'] [] = $ this-> get_error_message ($ error_code); 

Questo snippet verifica innanzitutto se sono stati inoltrati errori nel parametro request register-errori (linea 2). Se sì, passa attraverso tutti, cercando i messaggi di errore corrispondenti utilizzando il get_error_message funzione che abbiamo creato nella parte 1 della serie di tutorial. 

I messaggi di errore sono raccolti in un array nel $ attributi matrice per la stampa nel modello.

Per essere in grado di mostrare i messaggi di errore corretti, dovremo anche aggiungere i nuovi messaggi di errore alla funzione get_error_message. Nella struttura switch, aggiungi questi (o i tuoi) messaggi di errore:

// Casella degli errori di registrazione 'email': return __ ('L'indirizzo e-mail inserito non è valido.', 'Personalize-login'); case 'email_exists': return __ ('Esiste un account con questo indirizzo email.', 'personalize-login'); caso 'closed': return __ ('Registrazione di nuovi utenti non è attualmente consentito.', 'personalize-login');

Per visualizzare gli errori nella pagina di registrazione, aggiungere il seguente codice nel register_form.php modello tra il titolo e il modulo:

 0):?>  

Successivamente, aggiungiamo il messaggio di successo.

Quando un nuovo utente è stato registrato con successo, l'utente viene reindirizzato alla pagina di accesso, con un parametro, registrato = indirizzo email aggiunto all'URL. 

Nella funzione render_login_form, aggiungi le seguenti due righe per verificare se il parametro è presente:

// Controlla se l'utente ha appena registrato $ attributes ['registered'] = isset ($ _REQUEST ['registered']);

Quindi, nel modello login_form.php, aggiungi un messaggio che verrà mostrato se il registrato la bandiera è impostata:

 

%S. Abbiamo inviato la tua password all'indirizzo email che hai inserito. ',' Personalize-login '), get_bloginfo (' name ')); ?>

Questo è tutto. Ora hai creato un nuovo flusso di registrazione utente completo con la convalida dei parametri e la segnalazione degli errori. 

Vai avanti e crea un nuovo account utente per testare il flusso.

Se stai testando il plug-in su un server locale, a meno che tu non abbia configurato le impostazioni dell'email, potresti non ricevere l'e-mail contenente la password - è normale.

Combatti lo spam di registrazione con ReCaptcha di Google

Mentre il modulo di registrazione è ora completo, continueremo a personalizzarlo un po 'di più aggiungendo un controllo reCAPTCHA (è la casella di controllo "Io non sono un robot" che troverai su molti dei più grandi siti online) per prevenire gli spammer di registrazione dalla creazione di account sul tuo sito web.

Passaggio 1: Ottieni la tua chiave Captcha

Per prima cosa, visita il sito reCAPTCHA. Clicca sul "Ottieni reCAPTCHA"nell'angolo in alto a destra per accedere alla pagina di amministrazione di reCAPTCHA.

Se non hai effettuato l'accesso al tuo account Google, ti verrà chiesto di accedere. Se non ne hai ancora uno, dovrai crearne uno per utilizzare questo strumento. 

Nella pagina dell'account reCAPTCHA, troverai il seguente modulo. Usalo per inserire informazioni sul tuo sito web. 

Una volta inviato il modulo, fare clic su Registrare, vedrai una pagina con le istruzioni per abilitare reCAPTCHA sul tuo sito e due chiavi utilizzate per l'utilizzo dell'API: Chiave del sito e Chiave segreta.

Per memorizzare le chiavi nel nostro plugin WordPress, dovremo creare due campi di impostazioni. Per mantenere le cose semplici, le aggiungeremo al impostazioni generali e non creare ancora una pagina delle impostazioni personalizzate.

Per aggiungere i campi delle impostazioni, innanzitutto agganciare una nuova azione. Nel costruttore del plugin, aggiungi la seguente nuova riga:

add_filter ('admin_init', array ($ this, 'register_settings_fields'));

Quindi creare la funzione per definire i campi delle impostazioni e le due funzioni di callback per il rendering dei campi delle impostazioni:

/ ** * Registra i campi delle impostazioni necessari al plug-in. * / public function register_settings_fields () // Crea i campi delle impostazioni per le due chiavi utilizzate da reCAPTCHA register_setting ('general', 'personalize-login-recaptcha-site-key'); register_setting ('general', 'personalize-login-recaptcha-secret-key'); add_settings_field ('personalize-login-recaptcha-site-key', '', array ($ this,' render_recaptcha_site_key_field '),' general '); add_settings_field ('personalize-login-recaptcha-secret-key', '', array ($ this,' render_recaptcha_secret_key_field '),' general ');  public function render_recaptcha_site_key_field () $ value = get_option ('personalize-login-recaptcha-site-key', "); echo '';  public function render_recaptcha_secret_key_field () $ value = get_option ('personalize-login-recaptcha-secret-key', "); echo ''; 

Poiché questo tutorial non riguarda l'API di impostazioni di WordPress, non passeremo attraverso la dichiarazione del campo delle impostazioni. Se non hai familiarità con l'aggiunta delle impostazioni in WordPress, dai un'occhiata a questa completa serie di tutorial di Tom McFarlin.

Ora vai al impostazioni generali pagina e copia le chiavi reCAPTCHA nei due campi appena creati e salva le impostazioni.

Passaggio 2: Visualizza CAPTCHA

Con i preparativi effettuati, ora possiamo aggiungere il campo reCAPTCHA e utilizzarlo per verificare che i nostri utenti siano umani.

Nel render_registration_form, prima recuperare la chiave del sito reCAPTCHA dalle impostazioni di WordPress e memorizzarla nel $ attributi array per renderlo disponibile nel modello:

// Recupera chiave recaptcha $ attributes ['recaptcha_site_key'] = get_option ('personalize-login-recaptcha-site-key', null);

Quindi, utilizzando il parametro, aggiungi un segnaposto per il campo reCAPTCHA nel modulo di registrazione, proprio sopra il pulsante di invio:

 

Il campo RECAPTCHA effettivo verrà inserito all'interno di div sopra usando JavaScript. Quindi, al fine di mostrare il campo, avremo ancora bisogno di includere il JavaScript nel piè di pagina.

WordPress ha un'azione specifica solo per questo uso. Aggiungi la seguente riga nel costruttore del plugin: 

add_action ('wp_print_footer_scripts', array ($ this, 'add_captcha_js_to_footer'));

Quindi, creare la funzione, add_captcha_js_to_footer che stampa il tag include JavaScript che carica l'API reCAPTCHA da Google:

/ ** * Una funzione di azione utilizzata per includere il file JavaScript reCAPTCHA * alla fine della pagina. * / public function add_captcha_js_to_footer () echo "";

Ora, quando vai alla pagina di registrazione, dovresti vedere il campo reCAPTCHA sul posto:

Passaggio 3: controllare il CAPTCHA

Se il controllo basato su JavaScript "non un robot" ha esito positivo, il widget reCAPTCHA aggiunge un nuovo parametro al modulo, g-Recaptcha-risposta. Quindi, nelle convalide sul lato server in do_register_user funzione, possiamo usare il parametro per verificare che l'utente abbia superato il test.

Innanzitutto, creiamo una funzione per verificare il parametro reCAPTCHA:

/ ** * Verifica che il parametro reCAPTCHA inviato con la richiesta di registrazione * sia valido. * * @return bool True se CAPTCHA è OK, altrimenti falso. * / private function verify_recaptcha () // Questo campo è impostato dal widget recaptcha se il controllo ha esito positivo if (isset ($ _POST ['g-recaptcha-response'])) $ captcha_response = $ _POST ['g-recaptcha -risposta'];  else return false;  // Verifica la risposta captcha da Google $ response = wp_remote_post ('https://www.google.com/recaptcha/api/siteverify', array ('body' => array ('secret' => get_option ('personalize -login-recaptcha-secret-key '),' response '=> $ captcha_response))); $ successo = falso; if ($ response && is_array ($ response)) $ decoded_response = json_decode ($ response ['body']); $ successo = $ decoded_response-> successo;  return $ success; 

Sopra righe 9-13, la funzione recupera la risposta reCAPTCHA. Se non viene trovato, l'utente non ha nemmeno provato a completare il test prima di inviare il modulo.

Quindi, via righe 16-24, la funzione usa wp_remote_post inviare a INVIARE richiedere al server reCAPTCHA di verificare la risposta ricevuta. La richiesta accetta due parametri, incorporati in un array con l'id corpo: la chiave segreta reCAPTCHA e la risposta che stiamo convalidando, leggono dal parametro request g-Recaptcha-rispos