I moduli popup possono essere strumenti di marketing essenziali, che vi permettono di raccogliere indirizzi email, promuovere offerte e molto altro. Tuttavia, creare popup attraenti e personalizzati in WordPress non è sempre semplice.
Per fortuna, il plugin Elementor page builder permette di creare e personalizzare facilmente i popup sul vostro sito web. Potete modificarli per adattarli al design del vostro sito e aggiungere dei trigger basati sul comportamento degli utenti o sulla loro provenienza.
Questa guida vi fornirà una panoramica dei diversi tipi di popup di Elementor e dei motivi per cui potreste volerli utilizzare. Poi vi spiegheremo come creare questi popup con gli strumenti Elementor gratuiti e Pro. Cominciamo!
Una Panoramica sui Popup di Elementor
Elementor è uno dei più popolari plugin di page builder per siti web WordPress. Vi permette di trascinare e posizionare gli elementi per progettare pagine belle e facili da usare:
Inoltre, Elementor vi permette di creare una serie di popup. Si tratta di moduli personalizzati che appaiono sul vostro sito dopo un tempo predeterminato o dopo che l’utente ha completato una particolare azione.
I popup possono essere strumenti essenziali per diversi motivi. Potete usarli per raccogliere contatti e ampliare la vostra lista di email marketing. I popup di Elementor si integrano con i software di email marketing e inviano gli indirizzi dei clienti direttamente alla piattaforma di vostra scelta.
Potete anche usarli per promuovere offerte, sconti ed eventi legati al vostro negozio di ecommerce. Per questo motivo, i popup possono essere parte integrante della vostra strategia di marketing.
Inoltre, i popup possono aiutarvi a entrare in contatto con i vostri clienti. Potete inserire dei sondaggi per chiedere il feedback dei clienti e migliorare i vostri prodotti e servizi.
Tuttavia, i popup possono risultare scadenti e invadenti se non li progettate bene e se non scegliete i giusti trigger per il vostro pubblico. Pertanto, dovrete assicurarvi di usarli in modo efficace. È qui che entra in gioco Elementor.
Tipi di Popup di Elementor
Elementor offre più di 100 modelli di popup che potete personalizzare in base alle vostre esigenze. Questi modelli includono:
- Moduli per raccogliere contatti
- Popup per iscrizioni via email
- Popup promozionali
- Moduli di accesso e di benvenuto
- Popup a contenuto limitato
- Moduli di upsell e cross-sell
Questi modelli di popup sono integrati nei kit di Elementor, che includono varie caratteristiche di design per diversi tipi di siti web:
Inoltre, potete scegliere tra diversi posizionamenti e design visivi dei popup, tra cui:
- Modale
- Slide-in
- A schermo intero
- Barra superiore o inferiore
Infine, potete usare l’editor di Elementor per personalizzare rapidamente qualsiasi modello di popup in base alle vostre esigenze. Ora vi spieghiamo come farlo con Elementor Pro e con Elementor gratuito.
Come Creare un Popup con Elementor (Gratis)
In precedenza, il plugin Essential Addons for Elementor aveva una funzione Modal Popup che permetteva agli utenti di creare un modulo popup gratuito. L’utilizzo di questa funzione era uno dei modi più popolari per evitare di pagare Elementor Pro. Potete trovare molti video tutorial di qualche anno fa che vi mostrano come usare questo metodo.
Tuttavia, la funzione gratuita Modal Popup si è trasformata in un elemento premium Lightbox e Modal. Non è più gratuito. Pertanto, dovrete passare a Elementor Pro o pagare per uno dei plugin Elementor premium che tratteremo più avanti in questo articolo.
Come Creare un Popup con Elementor Pro (in 5 Semplici Passi)
Elementor Pro è dotato di una funzione di popup integrata che useremo in questo tutorial. Per prima cosa dovete acquistare e attivare Elementor Pro. Poi potrete accedere alla bacheca di WordPress per iniziare a creare i popup.
Passo 1: Creare il Popup
Iniziate navigando su Elementor > Templates > Popup nella vostra bacheca di WordPress. Poi, fate clic su ADD NEW POPUP per crearne uno nuovo:
Vi verrà chiesto di dare un nome al vostro template. Una volta deciso il nome, selezionate CREATE TEMPLATE:
In questo modo verrà lanciato il costruttore di pagine di Elementor. A questo punto potete scegliere tra i modelli di popup esistenti o creare il vostro da zero. Nel nostro esempio, abbiamo scelto uno dei template esistenti da modificare:
Ora potete giocare con le impostazioni del design per personalizzare il vostro popup. Per esempio, potete modificare il layout, l’allineamento, le immagini di sfondo e i colori.
Passo 2: Scegliere le Condizioni di Visualizzazione
Una volta che il design vi soddisfa, fate clic sulla freccia rivolta verso l’alto accanto a PUBLISH. Quindi, selezionate Display Conditions dal menu che appare:
Successivamente, andate su ADD CONDITION per scegliere la posizione in cui il popup di Elementor verrà visualizzato sul vostro sito web. Potete quindi selezionare una posizione tra le seguenti opzioni: Entire site, Archives, Singular o WooCommerce:
Fatta questa scelta, cliccate su NEXT. Vi ritroverete sulla sezione Triggers del vostro modulo popup.
Passo 3: Impostare i Trigger del Popup
Nella pagina Triggers potete decidere cosa devono fare gli utenti per visualizzare il vostro popup Elementor. Per impostazione predefinita, ogni opzione è disattivata e potete attivarla cliccando sul cursore. Poi dovrete specificare i valori per il vostro trigger.
Per esempio, se scegliete On Page Load, dovrete scegliere entro quanti secondi visualizzare il popup:
Con On Scroll, potete scegliere in quale direzione l’utente deve scorrere e quanta parte della pagina deve coprire prima che appaia il popup:
L’impostazione On Scroll To Element richiede l’inserimento di un ID CSS. Quando un utente raggiunge quell’elemento della vostra pagina, il popup apparirà:
Con On Click, dovrete specificare quante volte un utente deve cliccare sul vostro sito web prima che il popup venga visualizzato:
L’impostazione After Inactivity vi permette di attivare il popup dopo che l’utente è rimasto inattivo sulla vostra pagina per un determinato periodo di tempo:
Infine, potete scegliere di attivare l’opzione On Page Exit Intent. Questa impostazione attiverà il vostro popup quando un utente cercherà di lasciare la pagina:
Quando avete finito, fate clic su SAVE & CLOSE o su NEXT per passare alle Advanced Rules. Vedremo queste regole tra un po’.
Passo 4: Aggiungere un Pulsante Popup al Sito (Opzionale)
Potreste voler attivare il popup di Elementor quando un utente fa clic su un elemento specifico della vostra pagina. Per esempio, potreste creare un pulsante con la scritta “Iscriviti ora” e inserirlo nel footer. Quando un utente fa clic sul pulsante, vedrà il vostro modulo di registrazione via email sul suo schermo.
Per prima cosa, dovrete creare un pulsante Elementor sul vostro sito web. Aprite l’articolo o la pagina nell’editor di Elementor e scegliete pulsante (Button) dal menu. Trascinate e rilasciate il pulsante sulla pagina:
Una volta specificato il testo del pulsante e personalizzato il suo aspetto, fate clic su Link > Dynamic Tags. Quindi, scegliete Actions > Popup dal menu a tendina:
Fate clic su Popup e scegliete Open popup dal menu a tendina Action. Potete anche selezionare il vostro modulo dal menu Popup:
Infine, selezionate UPDATE per pubblicare il pulsante. Ogni volta che un utente ci clicca sopra, arriverà sul vostro modulo di iscrizione.
Fase 5: Salvare i Template di Popup per Usarli in Seguito
Potete anche salvare i vostri popup come template. Aprite il vostro popup nell’editor di Elementor e fate clic sulla freccia verso l’alto accanto a UPDATE. Scegliete Save as Template dal menu:
Vi verrà chiesto di dare un nome al vostro template. Quando avete finito, fate clic su SAVE:
Il popup verrà salvato nella vostra libreria di template. Ora potete usarlo quando create una pagina o un articolo con i template.
Come Configurare le Impostazioni Avanzate del Popup di Elementor
Abbiamo già spiegato come creare un popup Elementor di base. Tuttavia, ci sono anche alcune impostazioni avanzate che potreste voler usare.
Aprite di nuovo il vostro popup con l’editor di Elementor e andate su Display Rules. Diamo un’occhiata alle diverse impostazioni.
Impostazioni di Visualizzazione del Popup
Alcune impostazioni avanzate di visualizzazione del popup vi permettono di controllare quando gli utenti vedono il vostro modulo. Queste configurazioni possono essere utili per indirizzare i visitatori di ritorno piuttosto che quelli che arrivano per la prima volta.
Per esempio, potete scegliere di visualizzare il popup dopo che la persona ha visualizzato la pagina per un certo numero di volte:
In alternativa, potete scegliere di mostrare il popup dopo X sessioni (Show after X sessions). Questa impostazione si rivolge alle visite complessive piuttosto che a pagine specifiche:
L’impostazione per mostrare il popup fino a X volte (Show up to X times) può limitare il numero di volte in cui gli utenti vedranno il vostro popup. Potreste considerare di attivarla se non volete spammare continuamente le persone con moduli invadenti:
Potete anche usare le impostazioni mostra sui dispositivi (Show on devices) e mostra sui browser (Show on browsers) per limitare la visualizzazione del vostro popup. I popup possono essere particolarmente invadenti sui dispositivi mobili, quindi potreste considerare di disabilitarli in questi casi:
Offrire una migliore esperienza agli utenti da mobile è una bella mossa per soddisfare le persone che visitano il vostro sito. Inoltre, può dare impulso ai vostri sforzi di ottimizzazione per i motori di ricerca (SEO) e aiutare il vostro sito web a posizionarsi più in alto nei risultati di ricerca.
Impostazioni Origine Utente
Infine, Elementor vi permette di configurare le impostazioni di visualizzazione dei popup in base alla provenienza degli utenti. Queste impostazioni possono essere utili se indirizzate le visite verso una landing page promozionale e poi usate il popup per pubblicizzare offerte o per richiedere i dati di contatto.
Le seguenti impostazioni vi permettono di specificare gli URL e di scegliere quali link attivano i popup:
Infine, potete scegliere di nascondere i popup agli utenti che hanno effettuato il login. Potreste usare questa impostazione se gestite un sito web a pagamento:
Quando avete terminato di impostare tutte le opzioni, fate clic su SAVE & CLOSE. Se necessario, potete tornarci sopra e modificare qualsiasi configurazione.
I 3 Migliori Plugin per i Popup di Elementor
Come abbiamo visto, Elementor Pro facilita la creazione di popup per il vostro sito web. Tuttavia, potreste non essere pronti a passare al page builder premium. Oppure potreste essere alla ricerca di ulteriori funzioni di design.
Ecco alcuni dei migliori plugin per i popup di Elementor che tengono conto di queste considerazioni.
1. JetPopUp (Crocoblock)
JetPopUp è un plugin facile da usare con un’interfaccia drag-and-drop che si integra perfettamente con Elementor. Vi permette di creare moduli popup dinamici e personalizzati, tra cui iscrizioni via email, moduli di consenso ai cookie e conti alla rovescia.
JetPopUp brilla per le sue caratteristiche interattive. Potete scegliere tra diverse impostazioni di animazione, come lo scorrimento, il capovolgimento e la rotazione. Inoltre, il plugin dispone di vari modelli che potete personalizzare in base alle vostre esigenze.
Questo plugin vi permette anche di selezionare e personalizzare diverse impostazioni di visualizzazione. Per esempio, potete mostrare i vostri moduli JetPopUp agli utenti in date particolari, quando cercano di abbandonare il vostro sito web o dopo un certo tempo di scorrimento.
Caratteristiche:
- Scegliete tra i template di popup preimpostati
- Selezionate diverse condizioni di visualizzazione del popup
- Includete ed escludete condizioni specifiche
- Usate effetti di animazione
Prezzi: JetPopUp costa 22 dollari all’anno. Questo pacchetto include l’integrazione con MailChimp, un widget popup e l’assistenza clienti. Potete anche passare a un abbonamento all-inclusive per 130 dollari all’anno. Include 20 plugin aggiuntivi e 150 widget extra.
2. Widget Box Popup (PowerPack)
Se state cercando impostazioni avanzate per i popup di Elementor, prendete in considerazione Popup Box Widget di PowerPack. Vi permette di creare popup personalizzati che includono elementi dinamici come video, immagini e mappe di Google.
Questo plugin vi permette di attivare i popup in base a varie azioni dell’utente, tra cui l’intento di uscita e ritardi temporali personalizzati. Potete anche creare popup interattivi in due fasi con link e altri elementi di chiamata all’azione (CTA).
Inoltre, Popup Box Widget dispone di impostazioni di animazione avanzate. Potete ingrandire i vostri popup, usare la formattazione dei giornali o animazioni 3D.
Caratteristiche:
- Scegliete tra gli effetti di animazione
- Create popup a due fasi
- Usate ritardi temporali e trigger per l’utente
- Visualizzate immagini, video e altri elementi interattivi
Prezzi: Popup Box Widget è incluso in un abbonamento PowerPack. I piani partono da 49 dollari all’anno e includono più di 70 widget Elementor diversi.
3. Lightbox e Modal (Essential Addons for Elementor)
Abbiamo parlato brevemente di questo plugin popup per Elementor. Lightbox & Modal è un widget versatile che fa parte dello strumento Essential Addons for Elementor. Vi aiuta a creare popup con funzioni interattive come video, immagini e animazioni.
Lightbox & Modal è stato progettato per funzionare con pulsanti e link sul vostro sito web Elementor. Potete creare pulsanti, icone e testi personalizzati che attivano i vostri moduli popup. Inoltre, il widget può utilizzare ritardi temporali e altre azioni dell’utente.
Nel complesso, Lightbox & Modal potrebbe essere l’opzione migliore per interagire con i vostri utenti piuttosto che presentare semplicemente delle informazioni.
Caratteristiche:
- Usare i trigger dei pulsanti per i popup
- Visualizzare immagini, video e contenuti personalizzati
- Personalizzare i layout dei popup
- Scegliere tra diversi tipi di animazione
Prezzi: Lightbox & Modal è incluso in Essential Addons for Elementor Pro. I piani partono da 39,97 dollari all’anno e offrono più di 70 widget e sette estensioni.
Riepilogo
I moduli popup possono essere essenziali per le vostre campagne di lead generation e di marketing. Possono anche aiutarvi a interagire con le persone che visitano le vostre pagine e invogliarle a rimanere. Per fortuna, potete creare popup personalizzati con il costruttore di pagine Elementor.
È facilissimo creare popup con Elementor Pro. Potete personalizzarli per adattarli al vostro branding e decidere dove visualizzarli sul vostro sito. Potete anche configurare delle impostazioni di visualizzazione avanzate per mostrare il popup in base alle azioni e alle origini dell’utente.
Progettare un bel sito web con Elementor è solo il primo passo. Avrete anche bisogno di un provider di hosting di applicazioni, hosting di database e hosting WordPress gestito al vostro fianco.
Date un’occhiata ai nostri piani tariffari e scoprite come Kinsta può dare una carica in più al vostro sito!
Lascia un commento