Generatore di moduli di iscrizione: progetta i moduli

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

Il Generatore di moduli di iscrizione è l’editor visuale per tutti i moduli di iscrizione e le landing page di Maildroppa.

Puoi usarlo per organizzare i layout, aggiungere testo e immagini, configurare i campi degli iscritti, cambiare colori e caratteri, assegnare tag e decidere cosa succede dopo l’invio del modulo. La tela mostra il risultato mentre lavori, quindi non devi scrivere codice per progettare un’esperienza di iscrizione completa.

Maildroppa usa lo stesso generatore per quattro tipi di modulo:

• Le Landing page sono pagine complete e indipendenti che pubblichi e condividi tramite un link.
• I Moduli incorporati vengono inseriti direttamente in una pagina del tuo sito web.
• I Popup vengono visualizzati sopra il tuo sito web e possono anche essere aperti da un elemento della pagina.
• Gli Slide-in vengono visualizzati sul bordo o nella posizione selezionata della finestra del browser.

Questa guida spiega tutte le funzioni condivise da questi tipi di modulo. Le guide collegate illustrano solo le impostazioni e i passaggi specifici di ciascun tipo.

Apertura del Generatore di moduli di iscrizione

Apri “Signup Forms” in Maildroppa. Puoi quindi fare clic su “Create Form” per creare una nuova Landing page, un Modulo incorporato, un Popup o uno Slide-in.

Per continuare a lavorare su un modulo esistente, fai clic sul suo nome oppure scegli “Edit Form” dal menu delle azioni con tre puntini nella panoramica dei moduli di iscrizione.

Assegna al modulo un nome interno chiaro. Nomi come “Newsletter homepage”, “Popup webinar” o “Lead magnet estivo” sono più facili da riconoscere in seguito rispetto a nomi generici come “Modulo 1”. Il nome del modulo ti aiuta a gestirlo in Maildroppa e non viene mostrato automaticamente ai visitatori.

Comprendere il Generatore

Il generatore è suddiviso in quattro aree principali.

La barra superiore contiene il nome del modulo e le azioni principali. Qui puoi tornare alla panoramica, visualizzare un’anteprima del lavoro e salvarlo. Le Landing page mostrano inoltre in questa barra i controlli per la bozza e la pubblicazione.

La barra laterale sinistra contiene “Layout”, “Content” e “Layers”. Usala per creare la struttura, aggiungere nuovi elementi e gestire tutto ciò che è già stato posizionato sulla tela.

La tela è l’area di lavoro centrale. Mostra la pagina o il modulo attuale. Fai clic su un elemento per selezionarlo. Puoi anche trascinare gli elementi in una posizione diversa o aggiungerne di nuovi dalla barra laterale sinistra.

La barra laterale destra contiene “Settings” e “Page settings”. “Settings” modifica l’elemento selezionato. “Page settings” modifica lo sfondo generale e le impostazioni predefinite del design.

Sugli schermi più piccoli, le barre laterali si aprono come pannelli usando i pulsanti “Content” e “Settings”. Le funzioni disponibili rimangono le stesse.

Iniziare con un modello

Quando crei un modulo, il generatore propone design iniziali per il tipo di modulo selezionato. Puoi iniziare con un design vuoto, usare il modulo standard oppure scegliere un modello già pronto.

I modelli forniscono un layout iniziale, colori, tipografia e contenuti di esempio. Non limitano ciò che puoi modificare in seguito. Dopo aver selezionato un modello, ogni elemento può ancora essere modificato, spostato, duplicato, rielaborato nello stile o rimosso.

Ogni tipo di modulo dispone di modelli adatti al proprio scopo. Ad esempio, le Landing page includono design completi per Newsletter, Lead magnet, Webinar e Lista d’attesa. I Moduli incorporati, i Popup e gli Slide-in hanno i propri design iniziali compatti.

Se non sai quale modello scegliere, seleziona quello la cui struttura è più vicina al tuo obiettivo. Modificare testo, colori e immagini è solitamente più rapido che ricreare la stessa struttura partendo da una tela vuota.

Creare il layout

Apri “Layout” nella barra laterale sinistra per aggiungere una nuova riga di celle. I layout disponibili includono:

• Una cella
• Due, tre o quattro celle uguali
• Due celle con rapporto 2:1
• Due celle con rapporto 1:2

Fai clic su un layout per aggiungerlo nella posizione di inserimento attuale oppure trascinalo sulla tela. Puoi quindi inserire contenuti in ogni cella.

Seleziona un riquadro o una colonna per modificarne dimensioni, spaziatura, allineamento, sfondo, bordo e padding nella barra laterale destra. Nei layout a più colonne puoi anche modificare la larghezza relativa delle colonne.

Usa i layout per creare un ordine di lettura chiaro. Una singola colonna funziona bene per i moduli di iscrizione compatti. Un layout a due colonne è utile quando un’immagine, un elenco di vantaggi o informazioni su un evento devono apparire accanto al modulo di iscrizione.

Aggiungere contenuti

Apri “Content” nella barra laterale sinistra per aggiungere singoli blocchi di contenuto. Puoi fare clic su un blocco per inserirlo oppure trascinarlo nella posizione desiderata sulla tela.

Il generatore offre i seguenti blocchi di contenuto:

Signup form — Contiene i campi degli iscritti e il pulsante di invio. Un design richiede un blocco Signup form prima di poter essere salvato come modulo funzionante. Una volta presente, il blocco non viene più proposto come blocco di contenuto aggiuntivo.

Text — Aggiunge titoli, paragrafi o altro testo formattato.

Image — Aggiunge un’immagine da un URL, un caricamento o la libreria multimediale di Maildroppa. Puoi fornire un testo alternativo, aggiungere un link e controllare dimensioni, proporzioni, ritaglio, punto focale, rotazione e capovolgimento.

Video — Aggiunge un video di YouTube o Vimeo, un URL di incorporamento o un file video diretto. Puoi anche configurare un’immagine di anteprima e l’aspetto del pulsante di riproduzione.

List — Aggiunge un elenco puntato o numerato. Modifica le voci e controlla il colore dei marcatori, la spaziatura, la tipografia e l’allineamento.

Button — Aggiunge un pulsante con link e testo, URL, dimensioni, larghezza, colori, bordo, tipografia e allineamento configurabili.

Social links — Aggiunge icone collegate a servizi come Facebook, Instagram, LinkedIn, TikTok, YouTube o al tuo sito web.

Subscriber counter — Mostra il numero attuale di iscritti confermati. Puoi aggiungere un offset, modificare l’etichetta e definire lo stile del numero e del testo.

Spacer — Aggiunge spazio vuoto controllato. La spaziatura desktop e mobile può essere impostata separatamente.

Divider — Aggiunge una linea orizzontale con colore, spessore, larghezza, stile, allineamento e spaziatura configurabili.

Le Landing page offrono inoltre sezioni complete riutilizzabili. Sono illustrate nella guida alle Landing page.

Selezionare e organizzare gli elementi

Fai clic su un elemento sulla tela per selezionarlo. Le relative impostazioni vengono visualizzate nella barra laterale destra.

I controlli sull’elemento selezionato o nelle sue vicinanze consentono di spostarlo, duplicarlo o eliminarlo. Puoi anche trascinare un elemento in un’altra cella o posizione. Un indicatore mostra il punto in cui verrà inserito.

Apri “Layers” quando la pagina contiene molti riquadri, colonne e blocchi di contenuto annidati. Il pannello Layers mostra l’intera struttura in un elenco. Da qui puoi:

• Selezionare un elemento
• Rinominarlo per identificarlo più facilmente
• Spostarlo verso l’alto o verso il basso
• Trascinarlo in un’altra posizione
• Bloccarlo o sbloccarlo
• Duplicarlo
• Eliminarlo

Il blocco è utile quando vuoi evitare di spostare accidentalmente uno sfondo, un’immagine o una sezione già completati. Sblocca il livello quando vuoi modificarlo o riposizionarlo nuovamente.

Usa “Undo” e “Redo” nella barra degli strumenti del generatore per tornare indietro o avanzare tra le modifiche recenti al design.

Modificare il testo

Fai clic all’interno di un elemento di testo per modificare direttamente il contenuto sulla tela. La barra degli strumenti del testo fornisce gli stili per paragrafi e titoli, insieme alle opzioni di formattazione comuni.

A seconda del testo selezionato, puoi usare grassetto, corsivo, sottolineato, barrato, pedice, apice, allineamento, elenchi puntati o numerati, link ed emoji. Le impostazioni del testo selezionato consentono inoltre di modificare tipografia e colori senza cambiare ogni altro elemento di testo.

Usa le impostazioni tipografiche globali in “Page settings” quando tutti i titoli, il testo principale, i link o i pulsanti devono condividere uno stile coerente. Usa le impostazioni dell’elemento selezionato quando vuoi che solo un blocco abbia un aspetto diverso.

Configurare il modulo di iscrizione

Seleziona il blocco Signup form sulla tela per aprirne le impostazioni. Le sezioni disponibili riguardano la barra di avanzamento, il contatore degli iscritti, i campi, i tag nascosti, il contenitore del modulo, i campi di input e il pulsante di invio.

Campi degli iscritti

L’indirizzo email è il campo centrale di un modulo di iscrizione. Puoi anche aggiungere i campi degli iscritti presenti nel tuo account Maildroppa.

Per ogni campo puoi modificare l’etichetta e il testo segnaposto, decidere se è obbligatorio e scegliere se mostrare l’etichetta del campo. I campi possono essere riordinati trascinandoli o usando i controlli di spostamento.

Chiedi solo le informazioni di cui hai realmente bisogno. I moduli più brevi sono più rapidi da completare, mentre i campi aggiuntivi sono utili quando le informazioni verranno usate per la segmentazione o la personalizzazione.

Tag nascosti

I tag nascosti non vengono mostrati ai visitatori. Quando qualcuno si iscrive tramite il modulo, Maildroppa assegna automaticamente i tag selezionati a quell’iscritto.

È utile per identificare la fonte o l’interesse alla base di un’iscrizione. Ad esempio, un modulo per un webinar può applicare il tag “Webinar”, mentre un modulo per un lead magnet può applicare un tag relativo all’argomento scaricato.

Barra di avanzamento

La barra di avanzamento può essere disabilitata oppure visualizzata come percentuale o indicatore a due passaggi.

Per un indicatore percentuale puoi modificare testo, colori, dimensione del carattere, peso e allineamento. Per un indicatore a due passaggi puoi modificare le etichette di entrambi i passaggi e scegliere i colori attivo e inattivo.

Un indicatore di avanzamento può aiutare a spiegare che l’invio del modulo è il primo passaggio e la conferma dell’email Double Opt-in è il secondo.

Contatore degli iscritti nel modulo

Il modulo di iscrizione può mostrare il numero attuale di iscritti confermati prima o dopo il pulsante di invio.

Puoi aggiungere un offset, scrivere un’etichetta, scegliere la posizione e modificare tipografia e allineamento. L’offset viene aggiunto al numero di iscritti confermati mostrato da Maildroppa.

Questo contatore del modulo è diverso dal blocco di contenuto indipendente “Subscriber counter”. Usa l’impostazione del modulo quando il numero deve essere direttamente collegato all’area di invio. Usa il blocco di contenuto quando il contatore deve apparire altrove nel design.

Design del modulo, dei campi e del pulsante

Le impostazioni “Signup Form Block” controllano il contenitore intorno ai campi, inclusi sfondo, bordo, raggio degli angoli e spaziatura.

Le impostazioni dei campi controllano sfondi, etichette, testo, segnaposto, bordi e spaziatura. Il pulsante di invio dispone di impostazioni separate per testo, tipografia, colori, bordo, dimensioni e allineamento.

Puoi fare clic direttamente sulla barra di avanzamento o sul pulsante di invio sulla tela per aprire subito le impostazioni della relativa parte.

Modificare l’aspetto generale

Apri “Page settings” nella barra laterale destra per modificare il design generale. Per Moduli incorporati, Popup e Slide-in, queste impostazioni si applicano alla tela del modulo e non a una pagina completa ospitata.

Puoi configurare lo sfondo principale, l’immagine di sfondo, la larghezza massima e la spaziatura mobile. Le impostazioni dell’aspetto definiscono i valori predefiniti per:

• Carattere e colore del testo principale
• Colore dei link, sottolineatura e colore al passaggio del mouse
• Carattere, colore, peso, dimensione e altezza della riga dei titoli
• Pulsanti
• Riquadri, bordi, raggi degli angoli, spazi e padding
• Padding della pagina mobile e punto in cui le colonne si dispongono in pila

Queste impostazioni predefinite mantengono coerente il design. I singoli blocchi possono comunque sovrascriverle quando necessario.

Collegare un flusso di iscrizione

Ogni modulo è collegato a un Signup Flow. Il flusso di iscrizione controlla il percorso dell’iscritto dopo l’invio del modulo:

• Cosa vede il visitatore subito dopo aver inviato il modulo
• Quale email Double Opt-in viene inviata
• Cosa succede dopo che l’iscritto conferma l’indirizzo email

Apri il controllo del flusso di iscrizione nell’intestazione del generatore per vedere il flusso attualmente assegnato. Puoi selezionare un altro flusso esistente, modificare quello selezionato o crearne uno nuovo.

Un flusso di iscrizione può essere usato da più moduli. Se modifichi un flusso condiviso, la modifica interessa ogni modulo che lo utilizza. Per questo Maildroppa ti consente di scegliere se modificare il flusso condiviso o creare una copia separata per il modulo attuale.

Visualizzare l’anteprima e salvare

Fai clic su “Preview” per controllare il design completo e l’esperienza di iscrizione prima di renderla pubblica. L’anteprima è utile per verificare testi lunghi, proporzioni delle immagini, ordine dei campi, etichette dei pulsanti e l’equilibrio generale del modulo.

Per Moduli incorporati, Popup e Slide-in, fai clic su “Save changes” quando vuoi salvare la versione attuale.

Le Landing page usano i controlli per la bozza e la pubblicazione nella barra superiore. Possono essere salvate senza essere pubblicate e le modifiche a una pagina già pubblicata restano non pubblicate finché non le pubblichi. Il flusso completo è spiegato in Creare e pubblicare una Landing page.

Dopo il salvataggio, torna alla panoramica dei moduli di iscrizione per attivare e incorporare un modulo nel sito web oppure gestire una Landing page pubblicata.

Continua con il tipo di modulo

Il lavoro di design comune è ora completato. Continua con la guida relativa al modulo che stai creando:

• Creare e pubblicare una Landing page
• Creare e incorporare un Modulo incorporato
• Configurare e visualizzare un Popup
• Configurare e posizionare uno Slide-in