Attenzione!

Questo articolo contiene codice PHP e CSS ed è destinato agli sviluppatori. Offriamo questo codice per cortesia, ma non forniamo supporto per personalizzazioni del codice o sviluppo di terze parti.

Per ulteriore assistenza, consulta il tutorial di WPBeginner su come aggiungere codice personalizzato e CSS personalizzato.

Chiudi

Come cambiare l'indicatore del campo obbligatorio

Vuoi cambiare l'indicatore del campo obbligatorio sui tuoi WPForms? Se desideri utilizzare una stringa di testo diversa o anche un simbolo, puoi farlo facilmente con PHP. Questo articolo ti mostrerà come usare PHP per cambiare questo testo per i campi obbligatori del tuo modulo.

Quando un campo è contrassegnato come obbligatorio in WPForms, per impostazione predefinita, un asterisco rosso verrà visualizzato alla fine dell'etichetta del campo, come puoi vedere in questo screenshot qui sotto.

L'indicatore del campo obbligatorio è per impostazione predefinita un asterisco rosso

Creazione del tuo modulo

Per iniziare, creeremo un nuovo modulo e aggiungeremo i nostri campi. Almeno uno di questi campi dovrà essere impostato come obbligatorio.

crea il modulo con almeno un campo obbligatorio

Se hai bisogno di aiuto per creare un modulo, ti preghiamo di consultare questa documentazione.

Personalizzazione dell'indicatore del campo obbligatorio

Successivamente, aggiungeremo questo snippet al nostro sito.

Se hai bisogno di aiuto su come aggiungere snippet al tuo sito, consulta questo tutorial.

/**
 * Modify the required field indicator
 *
 * @link https://wpforms.com/developers/how-to-change-required-field-indicator/
 */

function wpf_dev_required_indicator( $text ) {

	return ' <span class="wpforms-required-label">' . __( '(Required)', 'wpforms' ) . '</span>';
}

add_filter( 'wpforms_get_field_required_label', 'wpf_dev_required_indicator', 10, 1 );

Il campo obbligatorio ora mostra il testo anziché l'asterisco

Cambierai semplicemente il testo (Obbligatorio) per farlo corrispondere al testo che desideri visualizzare.

E questo è tutto! Hai cambiato con successo l'aspetto dei tuoi campi obbligatori! Vuoi stilizzare il testo segnaposto sui campi del tuo modulo? Dai un'occhiata al nostro articolo su Come stilizzare il testo segnaposto per i campi del modulo.

Filtro di Riferimento

wpforms_get_field_required_label

FAQ

D: Come faccio a cambiare solo il colore del simbolo dell'asterisco?

R: Per fare ciò, aggiungi semplicemente questo CSS al tuo sito.

Se hai bisogno di aiuto su come aggiungere CSS al tuo sito, consulta questo tutorial.

.wpforms-form .wpforms-required-label {
    color: #1e73be !important;
}

Ricorda solo di cambiare il #1e73be per farlo corrispondere alla tua scelta di colore.

D: Perché lo snippet non funziona per me?

R: Se hai svuotato la cache del tuo sito e non vedi ancora modifiche, prova a cambiare la priorità della tua funzione. In uno snippet di codice, la priorità si riferisce all'ordine in cui le attività o le righe di codice devono essere eseguite. Proprio come in una lista di cose da fare, alcune attività sono più importanti e devono essere fatte prima di altre. Quindi, in questo particolare snippet, la nostra priorità è impostata su 10. Se noti che la modifica non ha effetto, prova a cambiare quel numero con un numero più alto per vedere se questo aiuta.

In questo esempio, impostiamo il numero di priorità su 20.

/**
 * Modify the required field indicator
 *
 * @link https://wpforms.com/developers/how-to-change-required-field-indicator/
 */

function wpf_dev_required_indicator( $text ) {

	return ' <span class="wpforms-required-label">' . __( '(Required)', 'wpforms' ) . '</span>';
}

add_filter( 'wpforms_get_field_required_label', 'wpf_dev_required_indicator', 20, 1 );