Cómo posicionar la descripción del campo encima del campo del formulario

Descripción general

¿Te gustaría posicionar la descripción del campo encima de los campos de tu formulario? Esto se puede lograr fácilmente con un pequeño fragmento de PHP añadido a tu sitio. Este tutorial te mostrará cómo puedes cambiar la descripción de tu campo para que esté encima de los campos de tu formulario.

Por defecto, WPForms colocará todas las descripciones de los campos justo debajo de la entrada del campo del formulario.

Configuración

Para mover estas descripciones encima del campo del formulario, primero necesitarás copiar este fragmento a tu sitio. Si necesitas ayuda sobre cómo y dónde añadir fragmentos a tu sitio, consulta este tutorial.

/**
 * Move the field description above the form field.
 *
 * @link   https://wpforms.com/developers/how-to-position-the-field-description-above-the-form-field/
 */

function wpf_dev_field_properties( $properties, $field, $form_data ) {
    
    // Only process this snippet on form ID 225
    if ( absint( $form_data[ 'id' ] ) !== 225 ) {
        return $properties;
    } 
    
    {
        // Position the field description above the form field
        $properties[ 'description' ][ 'position' ] = 'before';
    }

    return $properties;
}
add_filter( 'wpforms_field_properties', 'wpf_dev_field_properties', 10, 3 );

El código mostrado arriba moverá las descripciones encima de los campos del formulario pero solo si el ID del formulario es225. Solo recuerda cambiar el ID del formulario de 225 para que coincida con tu propio ID de formulario. Si necesitas ayuda para encontrar tu ID de formulario, por favor revisa este tutorial.

Una vez que hayas añadido este fragmento de código, verás que las descripciones ahora aparecerán encima de los campos del formulario.

¡Y eso es todo! Ahora has movido con éxito las descripciones de los campos en tu formulario para que estén encima de los campos del formulario. ¿También te gustaría aprender a limitar el número de caracteres para el campo de texto de tu formulario? Echa un vistazo a nuestro artículo sobre Cómo limitar el número de caracteres para un campo de texto.

Relacionado

Referencia del filtro: wpforms_field_properties

Preguntas frecuentes

P: He añadido el fragmento pero esto todavía no me funciona.

R: Si has añadido el fragmento pero no puedes ver el cambio, por favor, borra toda la caché del sitio y confirma también que has actualizado el fragmento de arriba para reflejar el ID del formulario en tu formulario.

P: ¿Cómo puedo hacer esto para todos mis formularios en lugar de solo para uno?

R: Si deseas esta funcionalidad para todos los formularios, simplemente elimina la llamada al ID del formulario. A continuación, se muestra un ejemplo de ese fragmento.

/**
 * Move the field description above the form field.
 *
 * @link   https://wpforms.com/developers/how-to-position-the-field-description-above-the-form-field/
 */

function wpf_dev_field_properties( $properties, $field, $form_data ) {

        // Position the field description above the form field
        $properties[ 'description' ][ 'position' ] = 'before';

    return $properties;
}
add_filter( 'wpforms_field_properties', 'wpf_dev_field_properties', 10, 3 );