Creare e visualizzare moduli popup

Published: 16 luglio 2026 · Last updated: 21 luglio 2026 · By Marcus Biel

Un popup viene visualizzato sopra i contenuti del tuo sito web. Posiziona l’offerta di iscrizione direttamente nel campo visivo del visitatore, lasciando invariata la pagina sottostante.

I popup sono utili per offerte di newsletter, sconti, registrazioni a eventi, lead magnet e altre call to action mirate. Poiché interrompono la normale esperienza sulla pagina, il momento e la frequenza di visualizzazione sono importanti quanto il design.

Questa guida spiega le impostazioni specifiche dei popup. Layout, blocchi di contenuto, campi degli iscritti, tag, tipografia, livelli e flussi di iscrizione sono descritti nella guida principale del generatore di moduli di iscrizione.

Creare un popup

Apri “Signup Forms”, fai clic su “Create Form” e seleziona “Popup”. Inserisci un nome interno chiaro e continua nel generatore.

Puoi anche modificare un popup esistente facendo clic sul suo nome nella panoramica dei moduli di iscrizione.

Usa un nome che descriva l’offerta o il posizionamento, ad esempio “Popup sconto homepage”, “Popup registrazione webinar” o “Popup download guida”. Il nome interno non viene mostrato automaticamente ai visitatori.

Scegliere un modello per il popup

I popup offrono un modulo vuoto, un modulo standard e quattro modelli predefiniti:

• Sconto essenziale
• Guida accogliente
• Webinar scuro
• Community delicata

Scegli un modello le cui dimensioni e struttura dei contenuti siano adatte all’offerta. In seguito puoi modificare tutto: testi, campi, colori, immagini, spaziatura e layout.

Progettare il popup

Usa il generatore visuale per organizzare il popup. Puoi combinare il modulo di iscrizione con testo, immagini, video, elenchi, pulsanti, link social, un contatore degli iscritti, spaziatori e separatori.

Mantieni il messaggio principale abbastanza breve da poter essere compreso immediatamente. In genere, un titolo chiaro, una breve spiegazione e un pulsante di invio specifico sono più efficaci di diversi messaggi in competizione tra loro.

Seleziona il blocco del modulo di iscrizione per configurare campi, informazioni obbligatorie, tag nascosti, indicatore di avanzamento, contatore degli iscritti, campi di input e pulsante di invio. Apri “Page settings” per modificare lo sfondo generale del popup e le impostazioni predefinite dell’aspetto.

Il popup viene visualizzato sopra il sito web con un controllo di chiusura. Lascia spazio visivo sufficiente attorno ai testi e ai campi importanti, in modo che il modulo resti facile da usare su uno schermo piccolo.

Configurare il comportamento del popup

Seleziona il blocco del modulo di iscrizione e apri “Widget Settings”. Questa sezione controlla quando viene mostrato il popup e con quale frequenza un visitatore può visualizzarlo.

Ritardo di visualizzazione

“Display Delay” definisce quanti secondi Maildroppa attende prima di visualizzare il popup su una pagina web incorporata.

Inserisci 0 per mostrarlo senza ulteriore ritardo. Usa un valore maggiore quando vuoi dare ai visitatori il tempo di leggere la pagina prima che venga visualizzata l’offerta. Il generatore accetta un ritardo fino a 86.400 secondi.

Scegli il ritardo in base alla pagina. Un ritardo breve può essere appropriato su una pagina di campagna mirata, mentre un ritardo più lungo può risultare meno invasivo in un articolo.

Frequenza di visualizzazione

“Display Frequency” controlla il periodo dopo il quale il popup può essere mostrato nuovamente allo stesso visitatore. Le opzioni disponibili sono:

• Sempre
• Una volta all’ora
• Una volta al giorno
• Una volta alla settimana
• Una volta al mese

Usa “Always” con cautela. Un popup che interrompe ripetutamente lo stesso visitatore può diventare frustrante. Per un’offerta generica sul sito, una frequenza giornaliera o settimanale è spesso un punto di partenza migliore.

La frequenza viene memorizzata nel browser del visitatore. Pertanto, eseguire il test in un altro browser, in una finestra di navigazione privata o dopo aver cancellato i dati memorizzati dal browser può produrre un risultato diverso.

Usare l’intento di uscita

Abilita “Exit Intent Popup” quando vuoi che il popup si apra dopo che il visitatore sposta il puntatore fuori dall’area della pagina, indicando che potrebbe essere sul punto di uscire.

Quando l’intento di uscita è abilitato, il popup attende questo comportamento invece di seguire la normale visualizzazione ritardata. La frequenza di visualizzazione selezionata continua a impedirne la visualizzazione troppo ravvicinata.

L’intento di uscita si basa sul movimento del puntatore ed è quindi principalmente rilevante nei browser desktop e laptop. I dispositivi touch non forniscono lo stesso segnale di uscita. Assicurati sempre che i visitatori da dispositivi mobili possano comunque scoprire la tua offerta di iscrizione tramite la pagina stessa o un altro modulo appropriato.

Aprire manualmente un popup da un elemento della pagina

Un popup può aprirsi quando un visitatore fa clic su un pulsante, un’immagine o un link specifico del tuo sito web. Questo è il trigger manuale al clic. È diverso da “Exit Intent Popup”, che reagisce quando un visitatore sposta il puntatore fuori dalla pagina.

Configura e installa il trigger manuale al clic come segue:

1. Apri il popup nel Signup Form Builder.
2. Fai clic sul blocco del modulo di iscrizione nell’area di lavoro e apri “Settings” sulla destra.
3. Espandi “Widget Settings” e abilita “Open popup when a customer clicks a page element”.
4. Fai clic su “Save changes”.
5. Torna alla panoramica dei moduli di iscrizione e attiva il popup se è inattivo.
6. Fai clic su “Show Code Snippet” nella riga del popup.

La finestra di dialogo contiene i due valori necessari sul tuo sito web:

1. Copia il codice completo dalla scheda “JavaScript” e aggiungilo alla pagina del sito web in cui il popup deve essere disponibile.
2. Sotto il codice, copia l’ID mostrato sotto “Add this ID to element from which you want to manually trigger Popup”.
3. Aggiungi quel valore esatto all’attributo id del pulsante, dell’immagine o del link che deve aprire il popup.

L’ID segue questo formato:

maildroppa-popup-btn-[form-id]

Ad esempio:

<button id="maildroppa-popup-btn-[form-id]">Scarica la guida</button>

JavaScript carica il popup. L’ID collega il popup all’elemento della pagina selezionato. Entrambi devono essere presenti sulla stessa pagina pubblicata. Quando un visitatore fa clic sull’elemento con quell’ID esatto, lo script di Maildroppa apre il popup.

Se il pulsante del tuo sito web ha già un ID assegnato da un altro sistema di popup, sostituiscilo con l’ID del trigger Maildroppa quando vuoi che Maildroppa gestisca il clic. Non inserire il popup Maildroppa all’interno di un secondo popup fornito dal generatore del tuo sito web.

Usa ogni ID HTML una sola volta per pagina. Se più elementi devono aprire lo stesso popup, chiedi alla persona che implementa il sito web di collegare tali elementi senza duplicare lo stesso ID.

Collegare il flusso di iscrizione

Controlla il flusso di iscrizione assegnato nell’intestazione del generatore. Questo determina la risposta immediata all’invio, l’email di Double Opt-in e il risultato dopo la conferma.

Puoi selezionare un flusso esistente, modificarlo o crearne uno separato per questo popup. Un flusso dedicato è utile quando l’offerta richiede un messaggio di conferma o la consegna di un lead magnet specifici.

Visualizzare l’anteprima e salvare

Fai clic su “Preview” per controllare il design e il comportamento del popup senza modificare la versione utilizzata sul tuo sito web. Controlla il layout, il controllo di chiusura, l’ordine dei campi, lo spazio per la convalida e la risposta all’invio.

Fai clic su “Save changes” quando il popup è pronto. Poi torna alla panoramica dei moduli di iscrizione.

Attivare e incorporare automaticamente il popup

Attiva il popup dal menu delle azioni con tre puntini se non è già attivo. Poi fai clic su “Show Code Snippet” e copia il codice completo dalla scheda “JavaScript”.

Aggiungi lo script a ogni pagina del sito web in cui il popup deve essere disponibile. Il codice contiene l’ID univoco del modulo del popup e carica la configurazione salvata più recente.

La scheda “HTML” fornisce il markup generato per implementazioni personalizzate. Se lo utilizzi, testa con attenzione tutti i comportamenti e i passaggi di invio, perché il codice e gli stili del tuo sito web possono influire sul risultato.

Questa sezione si applica quando il popup deve aprirsi automaticamente in base al ritardo di visualizzazione o al comportamento dell’intento di uscita. Per un pulsante, un’immagine o un link che apre il popup al clic, segui

.

Per istruzioni generali sull’incorporamento, consulta Creare e incorporare un modulo incorporato.

Testare il popup sul tuo sito web

Testa il popup sulla pagina reale del sito web dopo aver aggiunto il codice:

1. Controlla il ritardo configurato.
2. Prova il pulsante di chiusura e fai clic all’esterno del modulo.
3. Se abilitato, sposta il puntatore fuori dalla pagina per testare l’intento di uscita.
4. Se abilitato, fai clic sull’elemento della pagina configurato per testare il trigger manuale.
5. Controlla il layout su uno schermo stretto.
6. Invia il modulo e completa il processo di Double Opt-in.
7. Verifica l’iscritto e i tag nascosti in Maildroppa.

L’impostazione della frequenza può impedire che il popup venga visualizzato nuovamente durante test ripetuti. Usa una finestra di navigazione privata o cancella i dati memorizzati pertinenti dal browser quando ti serve una visita di test pulita.

Aggiornare o disattivare il popup

Per aggiornare il popup, aprilo in Maildroppa, modifica il design o il comportamento, visualizzane l’anteprima e fai clic su “Save changes”. Lo snippet JavaScript continuerà a usare lo stesso ID del modulo.

Per interromperne temporaneamente la visualizzazione, scegli “Deactivate” dal menu delle azioni. La disattivazione conserva il popup e i dati dei report precedenti. Rimuovi anche lo script o l’elemento trigger dal sito web se non sono più necessari.