Would you like to change the Address field sublabels in WPForms? These sublabels let users know what type of information that the user is expected to fill in. In this tutorial, we’ll walk you through how to change these sublabels using PHP.
By default the Address form field will display additional fields. Each of those fields have their own labels called sublabels.
Creating the form
We’ll begin by creating the form and adding our fields which will include the Address form field.
If you need any assistance in creating your form, please check out this documentation.
Changing the address sublabels
It’s now time to add the snippet to your site.
If you need any assistance in where and how to add snippets to your site, please review this tutorial.
US Address Scheme only
The below code snippet will allow you to change the sublabels on your Address field for the US scheme.
/**
* Change the sublabels for the Address field for the US Address Scheme.
*
* @link https://wpforms.com/developers/how-to-change-the-address-field-sublabels/
*/
function wpf_dev_address_field_properties_usa( $properties, $field, $form_data ) {
// check for address scheme
if ( $field[ 'scheme' ] === 'us' ){
// Change sublabel values
$properties[ 'inputs' ][ 'address1' ][ 'sublabel' ][ 'value' ] = __( 'Street Address' );
$properties[ 'inputs' ][ 'address2' ][ 'sublabel' ][ 'value' ] = __( 'Apartment #' );
$properties[ 'inputs' ][ 'city' ][ 'sublabel' ][ 'value' ] = __( 'City' );
$properties[ 'inputs' ][ 'state' ][ 'sublabel' ][ 'value' ] = __( 'State' );
$properties[ 'inputs' ][ 'postal' ][ 'sublabel' ][ 'value' ] = __( 'Zip' );
}
return $properties;
}
add_filter( 'wpforms_field_properties_address', 'wpf_dev_address_field_properties_usa', 10, 3 );
International address scheme only
The below code snippet will allow you to change the sublabels on your Address field for the International scheme.
/**
* Change the sublabels for the Address field for the International Address Scheme.
*
* @link https://wpforms.com/developers/how-to-change-the-address-field-sublabels/
*/
function wpf_dev_address_field_properties_international( $properties, $field, $form_data ) {
// check for address scheme
if ( $field['scheme'] === 'international' ){
// Change sublabel values
$properties[ 'inputs' ][ 'address1' ][ 'sublabel' ][ 'value' ] = __( 'Address' );
$properties[ 'inputs' ][ 'address2' ][ 'sublabel' ][ 'value' ] = __( 'Apartment / Suite #' );
$properties[ 'inputs' ][ 'city' ][ 'sublabel' ][ 'value' ] = __( 'City' );
$properties[ 'inputs' ][ 'state' ][ 'sublabel' ][ 'value' ] = __( 'State / Province / Region' );
$properties[ 'inputs' ][ 'postal' ][ 'sublabel' ][ 'value' ] = __( 'Postal Code' );
$properties[ 'inputs' ][ 'country' ][ 'sublabel' ][ 'value' ] = __( 'Country' );
}
return $properties;
}
add_filter( 'wpforms_field_properties_address', 'wpf_dev_address_field_properties_international', 10, 3 );
And that’s it! Would you like to create additional address schemes to be used in your Address field? Take a look at our article on How to Create Additional Schemes for the Address Field.
Reference Filter
FAQ
Q: Can I change these for only one form?
A: Absolutely, if you only wish to change these sublabels for a particular form, use this snippet instead and remember to update the form ID 123 to match your own form ID. If you need help finding your form ID, please review this helpful guide.
/**
* Change the sublabels for the Address field for the US Address Scheme.
*
* @link https://wpforms.com/developers/how-to-change-the-address-field-sublabels/
*/
function wpf_dev_address_field_properties_usa( $properties, $field, $form_data ) {
// Only process this snippet on the form ID 123
if ( absint( $form_data[ 'id' ] ) !== 123 ) {
return $properties;
}
// check for address scheme
if ( $field[ 'scheme' ] === 'us' ){
// Change sublabel values
$properties[ 'inputs' ][ 'address1' ][ 'sublabel' ][ 'value' ] = __( 'Street Address' );
$properties[ 'inputs' ][ 'address2' ][ 'sublabel' ][ 'value' ] = __( 'Apartment #' );
$properties[ 'inputs' ][ 'city' ][ 'sublabel' ][ 'value' ] = __( 'City' );
$properties[ 'inputs' ][ 'state' ][ 'sublabel' ][ 'value' ] = __( 'State' );
$properties[ 'inputs' ][ 'postal' ][ 'sublabel' ][ 'value' ] = __( 'Zip' );
}
return $properties;
}
add_filter( 'wpforms_field_properties_address' , 'wpf_dev_address_field_properties_usa', 10, 3 );
As you can see in the snippet, all we need to do is add in the check for the form ID with if ( absint( $form_data[ 'id' ] ) !== 123 ) { return $properties; } , the rest of the snippet remains the exact same as the example with all forms.