Iniziamo la panoramica dei moduli presenti nel Divi Builder con “Accedi”, il primo che (almeno nella versione di Divi tradotta in italiano) appare in lista.
A cosa serve il modulo “Accedi”?
Questo modulo permette di inserire un form di login per entrare in WordPress. È proprio il form che appare quando ci logghiamo da nomesito/wp-admin e che, in molti siti, viene posizionato anche in vari altri posti per permettere l’accesso agli utenti. Il Divi Builder ci dà la possibilità di customizzarlo in maniera semplice e flessibile e inserirlo dove vogliamo.
I campi da riempire che mostra (nome utente e password) sono proprio quelli che vedi nella schermata di accesso a WordPress (Nome utente e Password). Puoi inserire un titolo e del testo, come vedrai poco più avanti; il link da utilizzare per recuperare eventualmente la password è quello predefinito.
Un esempio semplice di form di Login fatto con “Accedi”
Oltre a questo, il form risultante rispecchierà già di suo lo stile e i colori del sito; saranno in linea con quelli che avrai impostato su Divi e potrai comunque modificarli in dettaglio grazie alle varie opzioni disponibili. Alcune di esse sono comuni a molti altri moduli del Builder, come l’opzione di scelta dello sfondo o la personalizzazione dei font.
Installazione
Spostati nel builder fino al punto dove vuoi che appaia il tuo form di login e clicca sul “+” per inserire un nuovo modulo, poi dalla lista seleziona “Accedi”. Se hai Divi in un’altra lingua, cerca l’icona col lucchetto ;).
Fatto? Ok! Adesso che abbiamo inserito il modulo dove vogliamo, possiamo iniziare a personalizzarlo.
Come personalizzare il Modulo “Accedi”
Facciamo un clic sull’icona dell’ingranaggio e apriamo l’interfaccia di modifica; ci troveremo nella Tab Contenuti, con le varie sezioni che ci permetteranno di personalizzare i vari elementi che appariranno nel form.
Testo
Titolo: inseriremo un titolo per il nostro modulo di accesso; ho scritto “Titolo form”, con grande fantasia…
Body: contenuto che apparirà sotto al titolo, prima dei campi di testo. Come si può vedere, c’è un classico editor dove scrivere e formattare il nostro testo.
Redirigi
Possiamo scegliere se far redirezionare l’utente alla pagina corrente (quella in cui si trova quando accede). Abbiamo due opzioni (sì/no).
Collegamento
Possiamo rimandare l’utente ad un altro URL dopo l’accesso, che scriveremo nell’apposito campo. Possiamo anche utilizzare un contenuto dinamico: posizionando il puntatore a destra, apparirà l’icona. Facendoci clic, potremo scegliere il link tra quelli disponibili (“homepage” nel mio caso).
In “Modulo Link Target” sceglieremo se, dopo il clic sul pulsante, il modulo farà aprire il collegamento appena impostato sulla stessa finestra del browser o su una nuova.
Sfondo
Qui ritroviamo lo stesso tipo di scelte che Divi presenta nella sezione Sfondo dei vari moduli; le scelte presentate dalle quattro icone sono (da sinistra a destra) colore, gradiente, immagine e video.
L’opzione Utilizza colore di sfondo serve ad attivare o disattivare la possibilità di scegliere un colore. L’icona del cellulare in alto ci permette, se vogliamo, di settare opzioni diverse a seconda dei dispositivi.
Etichetta di amministratore
Come in ogni altro, ci permette di dare un nome, diverso da quello di default Accedi, anche a questo modulo.
Il form è già funzionante così; le altre opzioni riguardano principalmente la formattazione del testo e gli effetti visivi che possiamo applicare.
Se hai seguito questo esempio, potrai salvare la tua pagina e, visualizzandola, non vedrai i campi Nome utente e Password, perché sei già loggato. Se vuoi vedere come appare il modulo ad un utente esterno, devi usare una finestra di navigazione anonima o un altro browser.
