How to Position the Field Description Above the Form Field

Overview

Would you like to position the field description above your form fields? This can be easily achieved with a small PHP snippet added to your site. This tutorial will show you how you can change your field description to be above your form fields.

By default, WPForms will place all field descriptions directly below the form field input.

By default the field description is set to below the form field

Setup

In order to move these descriptions above the form field, you’ll first need to copy the PHP code snippet shown below to your site.

/**
 * 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 ) {
	if( 225 != $form_data[ 'id' ] ) 
		add_action( 'wpforms_display_fields_after');
		$properties['description']['position'] = 'before';
	return $properties;
}
add_filter( 'wpforms_field_properties', 'wpf_dev_field_properties', 10, 3 );

The code shown above is going to move the descriptions above the form fields but only if the form ID is225. Just remember to change the form ID from 225 to match the form ID of the specific form on your site.

Once you’ve added this code snippet, you’ll see the descriptions will now appear above the form fields.

Position of the field description is now above with the PHP snippet

And that’s it! You’ve now successfully moved the field descriptions on your form to be above the form fields. Would you also like to learn how to limit the number of characters for your form’s text field? Have a look at our article on How to Limit the Number of Characters for a Text Field.