Vuoi creare un menu a schermo intero in Elementor ? In tal caso, questo articolo ti mostrerà come. Non è necessario alcun componente aggiuntivo per creare un menu a schermo intero Elementor. Tutto quello che serve è Elementor Pro.
La versione pro diElementor viene fornito con un generatore di popup che ti consente di creare bellissimi popup. Puoi utilizzare questa funzione per creare menu a schermo intero in Elementor.
Se non vedi di cosa vogliamo parlare oggi, guarda questo video.
Come creare un menu a schermo intero in Elementor?
Prima di iniziare, assicurati di averlo aggiornato il tuo Elementor alla versione pro. Una volta che sei pronto, vai su Modelli -> Popup. Crea un nuovo modello popup facendo clic sul pulsante Aggiungi nuovo.
Assegna un nome al tuo modello popup e fai clic sul pulsante CREA UN MODELLO.
Elementor offre dozzine di modelli popup tra cui scegliere. In questo tutorial, creeremo il modello da zero. Quindi chiudi la libreria dei modelli per aprire l'editor di Elementor.
Prima di iniziare a creare il modello popup, definisci prima il layout. Per fare ciò, apri le impostazioni della finestra popup facendo clic sull'icona a forma di ingranaggio nell'angolo in basso a sinistra.
Nel blocco disposizione, sotto la scheda Parametri, impostare la larghezza su VW del 100 e l'altezza su Adatta allo schermo. Puoi anche impostare effetti di animazione di entrata e uscita.
Dopo aver definito il layout, inizia a creare il modello aggiungendo una nuova sezione. Puoi aggiungere qualsiasi elemento desideri al modello. Per aggiungere voci di menu, puoi utilizzare il widget Menu di navigazione o il widget Elenco icone.
Vedi anche: Come impostare la posizione personalizzata per il menu mobile in Elementor
In questa guida, utilizzeremo il widget Elenco icone.
Modifica ogni elemento nell'elenco. È possibile aggiungere l'etichetta della voce di menu nel campo Testo e aggiungi il link nel campo Collegamento.
Vai alla scheda Style agli elenchi di stili. È possibile impostare lo spazio tra le voci dell'elenco e l'allineamento nel Blocco elenco. Per impostare la dimensione e il colore dell'icona (se utilizzi le icone), puoi aprire il blocco Icona. Per impostare la tipografia (dimensione del carattere, famiglia di caratteri, stile del carattere) e il colore del testo degli elementi dell'elenco, è possibile aprire il Blocco testo.
Se vuoi, puoi cambiare lo sfondo della sezione. Per personalizzare il pulsante di chiusura del popup, apri nuovamente le impostazioni del popup e vai alla scheda Style. Apri il blocco pulsante di chiusura e vedrai alcune opzioni per personalizzare il pulsante di chiusura come il colore di sfondo, le dimensioni e la posizione.
Una volta terminata la creazione del modello popup, fai clic sull'icona della freccia accanto al pulsante PUBBLICARE e selezionare Visualizza termini.
Imposta dove vuoi che appaia il popup facendo clic sul pulsante AGGIUNGI UNA CONDIZIONE e fare clic sul pulsante SEGUENTE per impostare il trigger.
Attiva l'opzione Al clic e fare clic su SALVA E CHIUDI.
Chiamata modello popup
Una volta che il modello popup è pronto, puoi chiamarlo. Poiché desideri creare un menu a schermo intero, puoi creare un'intestazione con Elementor o modificare un'intestazione esistente.
Leggi questo post per saperne di più su come creare un'intestazione personalizzata con Elementor.
Puoi chiamare il modello popup che hai appena creato con qualsiasi widget Elementor che ha un'opzione per aggiungere un collegamento, come un pulsante, un'icona, una casella di icone, testo, immagine, ecc.
In questo tutorial utilizziamo il widget Icon Box. Seleziona il widget per accedere alla modalità di modifica. Sotto la scheda Contenuto Dal pannello di sinistra, trova il campo in cui aggiungere il collegamento.
Imposta il link come dinamico e seleziona Popup.
Seleziona il modello popup appena creato facendo clic sull'icona della chiave inglese.
Pubblica/Aggiorna il tuo modello di intestazione.
Ottieni subito Elementor Pro!!!
Conclusione
Ecco ! Questo è tutto per questo articolo che ti mostra come crea un menu a schermo intero in Elementor. Se hai dubbi su come arrivarci, faccelo sapere all'interno 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.
...
