Vuoi sapere come creare una pagina di accesso con Elementor ?

In WordPress, puoi andare su tuodominio.com/wp-login.php per accedere alla pagina di accesso del tuo sito web. Se disponi di un sito Web di grandi dimensioni con più autori/utenti, potresti voler creare una pagina di accesso personalizzata con il tuo design per rafforzare l'identità del marchio del tuo sito Web.

Con Elementor, puoi creare facilmente una pagina di accesso personalizzata per il tuo sito Web WordPress, senza codificare o installare plug-in aggiuntivi.

Elementor ha un widget, il widget di accesso, che puoi utilizzare per creare una pagina di accesso personalizzata. Elementor offre anche modelli di pagine di accesso in modo da poter creare una pagina di accesso in pochissimo tempo.

Come creare una pagina di accesso WordPress personalizzata con Elementor

Tieni presente che il widget di accesso è disponibile solo su Elementor Pro. Quindi, prima di poter creare una pagina di accesso personalizzata, devi aggiornare Elementor alla versione pro.

1. Come creare una pagina di accesso da un modello

Come accennato in precedenza, Elementor offre modelli che ti consentono di creare una pagina di accesso personalizzata in pochissimo tempo. Per usarne uno, inizia creando una nuova pagina (Pagine -> Aggiungi) e modificalo con Elementor.

Nell'editor di Elementor, fai clic sull'icona della cartella per aprire la libreria del modello.

Cerca un modello di pagina di accesso personalizzato. Puoi utilizzare la casella di ricerca per facilitare il tuo lavoro. Una volta trovato il modello che ti piace, passaci sopra con il mouse e fai clic sul pulsante INSERIRE.

Attendi un momento finché Elementor non ha finito di caricare il modello. Una volta caricato il modello, puoi fare clic su Pubblicare per pubblicarlo.

Voilà.

Per visualizzare la pagina, puoi fare clic sull'icona a tre linee nell'angolo superiore del pannello di sinistra e selezionare Mostra pagina.

Ed ecco il risultato finale se hai scelto il nostro stesso modello.

Come creare una pagina di accesso con Elementor

2. Come creare una pagina di accesso personalizzata da zero

Se desideri avere il tuo design della pagina di accesso, puoi anche creare la tua pagina di accesso personalizzata da zero. Per iniziare, crea una nuova pagina e modificala con Elementor.

Nell'editor di Elementor, aggiungi una nuova sezione facendo clic sull'icona più. È possibile selezionare una struttura di colonne in base al design che si desidera creare.

Una volta che la sezione è pronta, aggiungi il widget Connessione trascinandolo dal pannello di sinistra all'area della tela.

Come creare una pagina di accesso con Elementor

Vai alla scheda Contenuto sul pannello di sinistra per impostare le opzioni di base. Ci sono 3 blocchi di opzioni che puoi manipolare:

1. Campi modulo

Puoi aprire questo blocco per abilitare/disabilitare il tag e impostare la dimensione di input.

2. Pulsante

Puoi aprire questo blocco per impostare il testo del pulsante, la dimensione del pulsante e l'allineamento del pulsante.

3. Opzioni aggiuntive

Puoi aprire questo blocco per abilitare/disabilitare elementi della tua pagina di accesso come il link MPassword dimenticata e l'opzione Ricordati di me. Poiché desideri creare una pagina di accesso, attivare l'opzione Reindirizzamento dopo l'accesso e incolla l'URL della dashboard di WordPress (tuodominio.com/wp-admin) nel campo disponibile. Puoi anche attivare l'opzione Reindirizza dopo il logout se lo si desidera.

Puoi attivare l'opzione Etichetta personalizzata se desideri utilizzare etichette personalizzate e segnaposto personalizzati sul tuo forma connessione.

Una volta che il file définition opzioni di base completate, vai a la scheda Stile per personalizzare il forma connessione. Sono disponibili 5 blocchi di opzioni di stile:

1. Forma

Puoi aprire questo blocco per definire lo spazio tra le linee, il colore dei collegamenti e il colore del puntamento dei collegamenti.

2. Etichetta

Puoi vedere questo blocco solo se attivi l'etichetta di forma. Puoi aprire questo blocco per impostare la spaziatura tra le etichette del modulo, il colore del testo e la tipografia (famiglia di caratteri, dimensione del carattere, stile del carattere, ecc.).

3. Campi

Puoi aprire questo blocco per definire il colore dei campi di testo, la tipografia (famiglia di caratteri, dimensione del carattere, stile del carattere, ecc.), lo sfondo del controllo, il colore del bordo del controllo, la larghezza del bordo del campo e il raggio del bordo del campo.

4. Pulsante

Puoi aprire questo blocco per personalizzare il pulsante di accesso. Puoi impostare cose come il colore del testo del pulsante, il colore del testo al passaggio del mouse, la tipografia, il colore dello sfondo del pulsante, il raggio del bordo e il riempimento del testo del pulsante.

5. Messaggio di accesso

Puoi aprire questo blocco per personalizzare il messaggio una volta che i tuoi utenti hanno effettuato l'accesso. Ecco il messaggio:

Puoi impostare il colore del testo e la tipografia del messaggio.

Una volta terminato lo stile del widget di accesso, puoi personalizzare altri widget sulla tua pagina. Una volta completata la modifica della pagina, pubblica/aggiorna la tua pagina e avrai creato con successo la pagina di accesso personalizzata.

Leggi anche: Come esportare e importare i modelli Elementor

Una cosa cruciale da notare. Dopo aver creato la pagina di accesso personalizzata, non eliminare il file wp-login.php sul tuo sito WordPress. Il tuo sito WordPress ha ancora bisogno di questo file per gestire il processo di accesso.

Ottieni Elementor Pro ora!

Conclusione

Ecco ! Questo è tutto per questo articolo che ti mostra come creare una pagina di accesso con Elementor. Se hai dubbi su come arrivarci ffacci sapere in commentaires.

Tuttavia, puoi anche consultare le nostre risorse, se hai bisogno di più elementi per realizzare i tuoi progetti di creazione di siti Internet, consultando la nostra guida su Creazione di blog WordPress o quello acceso Divi: il miglior tema WordPress di tutti i tempi.

Ma nel frattempo, condividi questo articolo sui tuoi diversi social network.

...