Vous souhaitez personnaliser le texte qui s'affiche lorsqu'aucun résultat n'est trouvé dans un champ Modern Dropdown ? Avec un simple extrait de code, vous pouvez modifier le message par défaut " Aucun résultat trouvé" et le rendre traduisible pour les sites multilingues. Cette fonctionnalité est particulièrement utile pour améliorer l'expérience de l'utilisateur en fournissant un retour d'information plus contextuel lorsque les résultats de la recherche sont vides.
Par défaut, les visiteurs verront le message " Aucun résultat trouvé" lorsque leur recherche n'aboutit à aucun résultat dans votre liste déroulante.
Dans ce tutoriel, nous vous fournirons le code PHP dont vous avez besoin pour modifier ce texte et nous vous guiderons à travers chaque étape.
Mise en place du formulaire
Tout d'abord, nous allons créer un nouveau formulaire et ajouter nos champs de formulaire qui comprendront au moins un champ de type Dropdown.
Une fois que vous avez ajouté le champ de formulaire Dropdown à votre formulaire, cliquez sur l'onglet Avancé et sélectionnez Moderne dans le menu déroulant Style.
Personnalisation du texte d'absence de résultat
Pour modifier le message par défaut, ajoutez ce code à votre site. Si vous ne savez pas comment ajouter un code personnalisé, consultez notre guide sur l'ajout d'extraits de code.
Ce snippet ne sera appliqué qu'au formulaire ID 1369 et modifiera le message noResultsText par défaut et le remplacera par ce que nous avons ajouté.
Si vous avez besoin d'aide pour trouver l'identifiant de votre formulaire, consultez notre guide sur la recherche des identifiants de formulaire et de champ.
Personnalisation du texte d'absence de résultat et du texte de sélection
Vous pouvez également personnaliser le texte de survol "Appuyer pour sélectionner" :
/**
* Change both No Results Found and Press to select text
*
* @link https://wpforms.com/developers/how-to-change-the-no-results-found-text-in-the-modern-dropdown/
*/
function wpf_dev_change_modern_dropdown_noresults_text( $config, $forms ) {
// Change 1369 to an ID of your actual form
if ( array_key_exists( 1369, $forms ) ) {
$config[ 'noResultsText' ] = __( 'Apologies, your search term was not found', 'your-text-domain' );
$config[ 'itemSelectText' ] = __( 'Choose this option.', 'your-text-domain' );
}
return $config;
}
add_filter( 'wpforms_field_select_choicesjs_config', 'wpf_dev_change_modern_dropdown_noresults_text', 10, 2 );
Et c'est tout ce dont vous avez besoin ! Désormais, au lieu de voir Aucun résultat trouvé, les utilisateurs verront votre message personnalisé.
Ensuite, vous souhaitez afficher tous les champs de votre formulaire dans votre message de confirmation ? Consultez notre tutoriel " Comment afficher tous les champs dans votre message de confirmation".