Visualizzazione di Shortcode all'interno delle etichette dei campi del modulo

Desideri migliorare le etichette dei tuoi moduli con tooltip interattivi o contenuti dinamici utilizzando gli shortcode? Sebbene WPForms non supporti gli shortcode nelle etichette per impostazione predefinita, puoi aggiungere facilmente questa funzionalità utilizzando PHP.

Questa guida ti mostrerà come visualizzare qualsiasi shortcode all'interno delle etichette dei campi del tuo modulo.

Installazione del plugin Shortcodes Ultimate (facoltativo)

Se non hai già un plugin per shortcode, puoi installare Shortcodes Ultimate dal repository dei plugin di WordPress. Questo passaggio è facoltativo se hai già un altro plugin per shortcode o stai utilizzando gli shortcode integrati del tuo tema.

Per assistenza nell'installazione dei plugin, puoi consultare la guida di WPBeginner su come installare un plugin.

Creazione del tuo modulo

Puoi creare un nuovo modulo o modificare un modulo esistente. Per qualsiasi aiuto su come creare un modulo, ti preghiamo di consultare questa documentazione.

Non avremo bisogno dell'etichetta Label per il campo modulo Telefono poiché utilizzeremo il testo del tooltip come etichetta, quindi nella scheda Avanzate del campo modulo seleziona l'opzione Nascondi etichetta e quindi fai clic su Salva sul modulo.

Aggiunta del codice

Per visualizzare gli shortcode nelle etichette dei tuoi moduli, dovrai aggiungere uno snippet di codice al tuo sito. Se non sei sicuro di come aggiungere codice personalizzato, ti preghiamo di consultare la nostra guida su come aggiungere snippet di codice.

Nello snippet di codice sopra, dovrai modificare tre valori chiave:

• Alla riga 10: Sostituisci 1055 con l'ID del tuo modulo
• Alla riga 10: Sostituisci 4 con l'ID del tuo campo
• Alla riga 12: Sostituisci lo shortcode con il tuo shortcode desiderato

Ora, quando i tuoi visitatori vedranno il modulo e faranno clic sul tooltip, vedranno il tuo messaggio.

FAQ

D: Come aggiungo shortcode diversi per moduli ed etichette diverse?

R: Se desideri riutilizzare questo snippet per altri moduli utilizzando shortcode diversi, potresti certamente farlo.

/**
 * Run shortcodes on the form label field.
 *
 * @link   https://wpforms.com/developers/how-to-display-shortcodes-inside-the-label-of-the-form-field/
 */
 
function add_shortcode_to_label( $field, $form_data ) {
         
        // Check that the form ID is 1055 and the field id is 4 for the Phone field
    if ( 1055 === absint( $form_data[ 'id' ] ) && 4 === absint( $field[ 'id' ] ) ) {
 
        echo do_shortcode( ' [su_tooltip text="Your information is completely protected and will not be sold!<br><a href=&ldquo;https://myexamplesite.com/privacy/&ldquo;>Click here to learn more.</a>" behavior="click" hide_delay="500"]Click Me![/su_tooltip] ' );
     
        }
     
        // Check that the form ID is 1055 and the field id is 2 for the Name field
    if ( 1055 === absint( $form_data[ 'id' ] ) && 2 === absint( $field[ 'id' ] ) ) {
 
        echo do_shortcode( ' [su_tooltip text="I am a different tooltip for a different field on the same form." behavior="click" hide_delay="500"]Click Me Too![/su_tooltip] ' );
     
        }   
 
        // Check that the form ID is 1072 and the field id is 6 for the Comments field
    if ( 1072 === absint( $form_data[ 'id' ] ) && 6 === absint( $field[ 'id' ] ) ) {
 
        echo do_shortcode( ' [su_tooltip text="I am a different tooltip for a different field on a completely different form." behavior="click" hide_delay="500"]Click Me Too![/su_tooltip] ' );
     
        }
     
}
add_action( 'wpforms_display_field_before', 'add_shortcode_to_label', 16, 2 );

E questo è tutto ciò che ti serve per visualizzare qualsiasi shortcode all'interno di un campo modulo Etichetta. Desideri visualizzare shortcode all'interno del campo HTML? Dai un'occhiata al nostro articolo su Come visualizzare shortcode all'interno del campo HTML.

Azione di riferimento

wpforms_display_field_before