Riassunto AI
Vuoi aggiungere opzioni immagine ai tuoi moduli? WPForms semplifica l'aggiunta di immagini ai tuoi campi Scelta multipla, Caselle di controllo, Elementi multipli ed Elementi casella di controllo in modo che i tuoi utenti possano vedere l'opzione o l'elemento che hai elencato.
Questa guida ti mostrerà come aggiungere scelte immagine a campi esistenti o nuovi in WPForms.
Impostazione delle scelte immagine
Prima di iniziare, dovrai assicurarti che WPForms sia installato e attivato sul tuo sito WordPress e che tu abbia verificato la tua licenza. Quindi puoi creare un nuovo modulo o modificarne uno esistente per accedere al generatore di moduli.
Una volta aperto il generatore di moduli, potrai aggiungere scelte di immagini a uno qualsiasi dei seguenti tipi di campo:
- Scelta multipla
- Caselle di controllo
- Elementi multipli
- Elementi casella di controllo
Inoltre, puoi aggiungere immagini sia ai campi nuovi che a quelli esistenti di questi tipi di campo.
Per il nostro esempio, vogliamo mostrare immagini per le opzioni dell'articolo in un modulo d'ordine. Per fare ciò, aggiungeremo prima un campo Articoli multipli al nostro modulo.

Ora che abbiamo aggiunto il nostro campo, il passo successivo è modificare l'etichetta del campo e aggiungere testo per le opzioni disponibili. Poiché stiamo utilizzando un campo Articoli multipli, dobbiamo anche aggiungere i prezzi per ogni articolo.

Una volta che questa configurazione di base è pronta, selezioneremo l'opzione Usa scelte di immagini.

Non appena questa opzione sarà abilitata, un pulsante Carica immagine verrà aggiunto a ogni opzione. Inoltre, un'immagine segnaposto verrà visualizzata per ogni opzione nell'area di anteprima.
Aggiunta di immagini
Per aggiungere un'immagine a un'opzione, fai clic sul pulsante Carica immagine.

Questo aprirà la Libreria multimediale di WordPress. Da qui, puoi selezionare un file che è già stato aggiunto al tuo sito o caricare una nuova immagine. Una volta scelta l'immagine che desideri utilizzare, fai clic sul pulsante Usa immagine.

Per questo esempio, abbiamo già modificato tutte le immagini in modo che siano di dimensioni 150x150 pixel. Questo aiuterà le nostre opzioni di immagine ad apparire più uniformi e professionali.
Ecco come appariranno le nostre scelte di immagini ai nostri utenti:

Personalizzazione delle opzioni immagine
WPForms include anche diverse opzioni integrate per personalizzare le tue scelte di immagini. Per visualizzare queste opzioni, apri la scheda Avanzate nelle Opzioni campo.

Oltre a qualsiasi altra opzione di personalizzazione disponibile per il campo che stai utilizzando, due opzioni vengono aggiunte quando viene selezionata l'opzione Usa scelte di immagini: Stile scelta immagine e Layout scelta.

Stile scelta immagine
Ci sono tre opzioni disponibili per lo stile delle scelte di immagini: Moderno, Classico e Nessuno.

Andremo ad analizzare ciascuna di queste opzioni di seguito:
Stile moderno
L'opzione Modern visualizzerà qualsiasi opzione selezionata all'interno di una casella ombreggiata e aggiungerà anche un segno di spunta verde e bianco al centro dell'opzione selezionata.

Stile Classico
L'opzione Classic aggiungerà semplicemente un bordo spesso, grigio scuro attorno a qualsiasi opzione selezionata.

Nessuno
Se preferisci non aggiungere alcuno stile speciale, seleziona l'opzione None. Questa opzione visualizzerà normali caselle di controllo o pulsanti di opzione accanto al testo per ogni opzione.

Layout Scelta
Per qualsiasi campo in cui sono consentite scelte di immagini, avrai diverse opzioni di layout. Questo determinerà quante colonne vengono utilizzate per visualizzare le scelte all'interno di questo campo.
Le opzioni Choice Layout includono Una Colonna, Due Colonne, Tre Colonne e Inline.

Per impostazione predefinita, l'opzione Inline sarà selezionata quando l'opzione Aggiungi scelte di immagini è abilitata. Questo posizionerà automaticamente quante più scelte possibile all'interno di ogni riga.
Questo è tutto! Ora puoi aggiungere immagini a qualsiasi campo Scelta Multipla, Caselle di controllo, Elementi Multipli e Elementi Casella di controllo nei tuoi moduli. Se hai utilizzato un campo Elementi Multipli e prevedi di accettare pagamenti, non dimenticare di configurare un'integrazione con Stripe, PayPal, Authorize.Net, o Square.
Successivamente, desideri testare i tuoi moduli prima di aggiungerli al tuo sito? Assicurati di consultare la nostra checklist pre-lancio per tutti i nostri suggerimenti e raccomandazioni prima di lanciare un modulo.