Souhaitez-vous modifier les sous-étiquettes du champ Adresse dans WPForms ? Ces sous-étiquettes permettent aux utilisateurs de savoir quel type d'information ils doivent remplir. Dans ce tutoriel, nous allons vous montrer comment changer ces sous-étiquettes en utilisant PHP.
Par défaut, le champ du formulaire Adresse affiche des champs supplémentaires. Chacun de ces champs possède ses propres étiquettes, appelées sous-étiquettes.
Création du formulaire
Nous allons commencer par créer le formulaire et ajouter nos champs, dont celui de l'adresse.
Si vous avez besoin d'aide pour créer votre formulaire, consultez cette documentation.
Modification des sous-étiquettes d'adresse
Il est maintenant temps d'ajouter l'extrait à votre site.
Si vous avez besoin d'aide pour savoir où et comment ajouter des snippets à votre site, veuillez consulter ce tutoriel.
Schéma d'adresse pour les États-Unis uniquement
L'extrait de code ci-dessous vous permettra de modifier les sous-étiquettes de votre champ Adresse pour le schéma américain.
/**
* 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 );
Programme d'adresses internationales uniquement
L'extrait de code ci-dessous vous permettra de modifier les sous-étiquettes de votre champ Adresse pour le schéma international.
/**
* 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 );
Et c'est tout ! Vous souhaitez créer d'autres schémas d'adresses à utiliser dans votre champ Adresse? Consultez notre article sur la création de schémas supplémentaires pour le champ d'adresse.
Filtre de référence
FAQ
Q : Puis-je les modifier pour un seul formulaire ?
R : Absolument, si vous ne souhaitez modifier ces sous-étiquettes que pour un formulaire particulier, utilisez plutôt cet extrait et n'oubliez pas de mettre à jour l'ID de formulaire 123 pour qu'il corresponde à votre propre ID de formulaire. Si vous avez besoin d'aide pour trouver l'identifiant de votre formulaire, consultez ce guide utile.
/**
* 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 );
Comme vous pouvez le voir dans l'extrait, tout ce que nous avons à faire est d'ajouter la vérification de l'ID du formulaire avec if ( absint( $form_data[ 'id' ] ) !== 123 ) { return $properties; } Le reste de l'extrait reste exactement le même que l'exemple avec tous les formulaires.