Come nascondere le etichette delle scelte immagine con WPForms

Introduzione

Vuoi nascondere le etichette delle scelte immagine nei campi modulo Scelta multipla e Casella di controllo? Utilizzare l'opzione per visualizzare le immagini per questi campi invece delle sole etichette è un ottimo modo per catturare l'attenzione dei tuoi visitatori, ma forse vorresti lasciare che le immagini parlino da sole e rimuovere le etichette che appaiono sotto queste immagini? Utilizzando un piccolo snippet CSS puoi nascondere facilmente le etichette per queste immagini e in questo tutorial ti mostreremo esattamente come!

Creazione del tuo modulo

Per iniziare, creeremo un nuovo modulo e aggiungeremo i nostri campi. Poiché sappiamo già che vogliamo usare immagini per il nostro campo Casella di controllo, aggiungeremo questo campo e le immagini corrispondenti.

Se hai bisogno di assistenza nella creazione del tuo modulo, consulta questa guida utile. Inoltre, se hai bisogno di assistenza su come configurare un campo utilizzando le Scelte immagine, esamina questa documentazione.

Aggiungere CSS per nascondere le etichette delle scelte immagine

Ora che il modulo è stato creato, puoi vedere le etichette sotto le immagini.

Poiché vogliamo nascondere queste etichette, aggiungeremo del CSS per nasconderle.

Se hai bisogno di aiuto nell'aggiungere CSS al tuo sito, consulta questo tutorial.

Copia e incolla semplicemente questo CSS sul tuo sito.

form.wpforms-form .wpforms-field-container ul.wpforms-image-choices span.wpforms-image-choices-label {
    display: none;
}

Questo CSS non solo nasconderà le etichette che appaiono sotto le immagini, ma rimuoverà anche qualsiasi margine (spazio) applicato automaticamente sotto le immagini.

Vuoi rimuovere anche lo spazio bianco posizionato attorno alle scelte immagine? Dai un'occhiata al nostro articolo su Come rimuovere lo spazio bianco attorno alle scelte immagine.