Iniziare #
Metform ti consente di creare un modulo lungo con grande facilità. Ora puoi creare facilmente moduli multi-fase WordPress utilizzando qualsiasi widget.
Guarda la guida video per aggiungere il modulo in più passaggi Elementor:
Oppure segui le istruzioni passo passo riportate di seguito per aggiungere un modulo in più passaggi WordPress:
Passaggio -> 1 #
Cerca il Metforma widget e trascinalo nell'area di posizionamento del widget.

Passaggio -> 2 #
Clicca sul Modifica modulo pulsante a sinistra per aprire una finestra per creare un modulo.

Passaggio -> 3 #
Scegliere Nuovo per creare un nuovo modulo. Dai a Titolo. Ora puoi selezionare un modello vuoto e fare clic su Modifica modulo

Passaggio -> 4 #
Fare clic sul pulsante con il segno "Più" per aggiungere una nuova sezione.

Passaggio -> 5 #
Ora crea il tuo modulo utilizzando qualsiasi widget

Passaggio -> 6 #
Trascina e rilascia il file Passo successivo pulsante widget.

Passaggio -> 7 #
Per nominare la sezione. Fare clic sui sei punti per accedere alle impostazioni della sezione. Allora vai a layout ⇒ multistep. Qui modificare il titolo della scheda in più passaggi e aggiungere un'icona se vuoi. Puoi aggiungere un'icona dalla libreria o caricarne una nuova.

Passaggio -> 8 #
Per aggiungere un nuovo passaggio/fase del modulo, prendi nuovamente una nuova sezione facendo clic sul segno +.
Nota: ricorda che devi iniziare una nuova sezione (non la sezione interna) per una nuova scheda/passaggio del modulo.

Passaggio -> 9 #
Ora trascina nuovamente i widget per creare il secondo passaggio. Dopo di che aggiungere i pulsanti Precedente e Successivo. Poi seguire il passaggio 7 per dare un nome e un'icona propri a questa sezione/scheda

Passaggio -> 10 #
Ripetere i passaggi 7,8 e 9 per creare un altro passaggio del modulo. Ma questa volta aggiungi pulsante di invio invece di Avanti per completare il modulo in più passaggi Elementor.

Passaggio -> 11 #
Infine, fai clic su Aggiorna e chiudi per salvare il design del modulo in più passaggi e tornare alle impostazioni.

Passaggio -> 12 #
Ora è il momento di attivare la funzione multi-passo. Per farlo vai su Vai a Contenuto ⇒ Impostazioni multistep e modifica le seguenti impostazioni:
- Abilita multifase: Attiva questa opzione per abilitare l'opzione multifase.
- Altezza contenitore modulo adattivo: Questa opzione consentirà al modulo di assumere l'altezza del passaggio corrente.
- Visualizza navigazione multifase: Puoi disabilitare questa opzione nel caso in cui non desideri mostrare l'opzione di navigazione in alto.
- Abilita lo scorrimento verso l'alto: Attiva questa opzione per scorrere fino all'opzione in alto.
- Allineamento: Qui puoi impostare l'allineamento del navigatore a più passaggi su sinistra, destra o al centro.
- Tipografia: È possibile modificare la famiglia, il peso, la trasformazione, l'altezza della linea, ecc. per il multi-step.
- Imbottitura: Imposta la spaziatura interna sinistra, destra, superiore e inferiore per il modulo a più passaggi.
- Margine: Regola la spaziatura interna sinistra, destra, superiore e inferiore per il modulo a più passaggi.
- Testo
- Normale: Qui puoi modificare il colore, il colore dello sfondo, il tipo di bordo, la dimensione dell'icona, la spaziatura delle icone e la dimensione delle icone per la modalità normale.
- Attivo: Scegli il colore, il colore di sfondo, il tipo di bordo, la dimensione dell'icona, la spaziatura delle icone e la dimensione dell'icona per la modalità attiva.
- Passa il mouse: Modifica il colore, il colore dello sfondo, il tipo di bordo, la dimensione dell'icona, la spaziatura delle icone e la dimensione dell'icona per la modalità al passaggio del mouse.

Step-> 13 #
Infine, fai clic su Aggiorna per salvare.

Ecco un esempio di modulo in più passaggi creato da Metfrom:
