How to Change the Required Field Indicator

Introduction

Do you want to change the required field indicator on your WPForms? If you’d like to use a different string of text or even a symbol, you can easily do this with PHP. This article will show you how to use PHP to change this text for the required fields of your form.

When a field is marked as required in WPForms, by default, a red asterisk will be displayed at the end of the field label as you can see in this screenshot below.

The required field indicator is by default a red asterisk

Creating your form

To begin, we’re going to create a new form and add our form fields. At least one of these fields will need to be set as a required field.

create the form with at least one required field

If you need any help creating a form, please review this documentation.

Adding the snippet to your site

Next, we’re going to add this snippet to our site.

If you need help in how to add snippets to your site, please see this tutorial.

Single Language

If you don’t have multiple languages on your site, please use this snippet and change the text to match what you would like.

/**
 * 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 );

The required field is now showing the text rather than the asterisk

You’ll just change the text (Required) to match the text you want to display.

And that’s it! You’ve successfully changed the look of your required fields! Would you like to style the placeholder text on your form fields? Take a look at our article on How to Style Placeholder Text for Form Fields.

Filter Reference: wpforms_get_field_required_label

FAQ

Q: How do I just change the color of the asterisk symbol?

A: To do this, just add this CSS to your site.

If you need help in how to add CSS to your site, please see this tutorial.

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

Just remember to change the #1e73be to match your own color choice.