Introduction
Souhaitez-vous traiter les Smart Tags dans les étiquettes des champs de vos formulaires ? Avec un petit snippet PHP, cela peut être facilement réalisé. Dans ce tutoriel, nous allons vous montrer comment traiter les Smart Tags dans les étiquettes des champs de vos formulaires.
L'utilisation de balises intelligentes est un outil très utile pour extraire et afficher dynamiquement des données spécifiques dans votre formulaire.
Par défaut, les étiquettes intelligentes ne seront pas traitées si elles sont placées dans les étiquettes de champ de votre formulaire.
Toutefois, cette fonctionnalité peut s'avérer utile si, par exemple, vous souhaitez afficher le nom d'un utilisateur connecté, l'URL de votre page ou même d'autres détails à l'aide de balises intelligentes personnalisées.
Dans le cadre de ce tutoriel, nous allons créer un formulaire que seuls les utilisateurs connectés pourront voir. Nous voulons donc le rendre plus personnel en utilisant leur prénom dans l'étiquette d'un champ du formulaire Paragraphe.
Ajout du snippet
Nous allons commencer par ajouter notre extrait à notre site. Si vous avez besoin d'aide pour ajouter des snippets à votre site, consultez ce tutoriel.
Ci-dessous, nous allons vous montrer deux méthodes, l'une qui cible un ID de formulaire spécifique et l'autre qui s'applique à tous les formulaires. Il vous suffit de sélectionner le snippet que vous souhaitez utiliser.
Cibler un identifiant de formulaire spécifique
Dans ce snippet, nous ne ciblons que l'ID du formulaire 365. Si vous avez besoin d'aide pour trouver l'ID de votre formulaire, veuillez consulter ce tutoriel.
/** * Run Smart Tags on all field labels. * * @link https://wpforms.com/developers/how-to-process-smart-tags-in-field-labels/ */ function wpf_dev_textarea_field_display( $field, $field_atts, $form_data ) { // Optional, you can limit to specific forms. Below, we restrict output to // form #365. if ( absint( $form_data[ 'id' ] ) !== 365 ) { return $field; } $field[ 'label' ] = wpforms()->smart_tags->process( $field[ 'label' ], $form_data ); return $field; } add_filter( 'wpforms_textarea_field_display', 'wpf_dev_textarea_field_display', 10, 3 );
Utilisation pour tous les WPForms
Le code ci-dessous permet de le faire sur toutes les WPForms.
/** * Run Smart Tags on field labels in WPForms. * * @link https://wpforms.com/developers/how-to-process-smart-tags-in-field-labels/ */ function wpf_dev_textarea_field_display( $field, $field_atts, $form_data ) { $field[ 'label' ] = wpforms()->smart_tags->process( $field[ 'label' ], $form_data ); return $field; } add_filter( 'wpforms_textarea_field_display', 'wpf_dev_textarea_field_display', 10, 3 );
Création du formulaire
Ensuite, nous allons créer notre formulaire et ajouter nos champs. Nous allons utiliser notre nouvelle balise intelligente dans l'étiquette du champ pour extraire le prénom de l'utilisateur. Nous allons donc modifier l'étiquette de ce champ en Tell us a little about yourself {user_first_name}.
Si vous avez besoin d'aide pour créer votre formulaire, veuillez consulter cette documentation.
Lorsque votre formulaire se charge, vous verrez le nom tiré de votre nouvelle étiquette intelligente.
Utilisation des étiquettes intelligentes dans les notifications par courrier électronique
Vous pouvez également utiliser des étiquettes intelligentes dans vos notifications.
Pour ce faire, naviguez vers Paramètres à partir du générateur de formulaires et sélectionnez Notifications.
Lors de la configuration de votre message de notification par courrier électronique, vous pouvez sélectionner l'option Afficher les étiquettes intelligentes pour inclure les étiquettes intelligentes que vous souhaitez inclure dans votre message.
Utilisation de Smart Tags dans d'autres étiquettes de champs de formulaire
Vous trouverez ci-dessous l'extrait nécessaire pour chacun des différents champs du formulaire que vous pouvez traiter avec des Smart Tags dans l'étiquette de chacun de ces champs spécifiques.
Comme indiqué ci-dessus, ces extraits sont spécifiques à un seul identifiant de formulaire. Si vous souhaitez les rendre accessibles à tous les formulaires, il vous suffit de supprimer le bloc de l'extrait qui fait référence à l'identifiant du formulaire.
/** * Run Smart Tags on field labels in WPForms. * * @link https://wpforms.com/developers/how-to-process-smart-tags-in-field-labels/ */ // Run smart tags on text field label. function wpf_dev_text_field_display( $field, $field_atts, $form_data ) { // Optional, you can limit to specific forms. Below, we restrict output to // form #365. if( $form_data[ 'id' ] != 365 ) return $field; $field[ 'label' ] = wpforms()->smart_tags->process( $field[ 'label' ], $form_data ); return $field; } add_filter( 'wpforms_text_field_display', 'wpf_dev_text_field_display', 10, 3 ); // Run smart tags on textarea field label. function wpf_dev_textarea_field_display( $field, $field_atts, $form_data ) { // Optional, you can limit to specific forms. Below, we restrict output to // form #365. if( $form_data[ 'id' ] != 365 ) return; $field[ 'label' ] = wpforms()->smart_tags->process( $field[ 'label' ], $form_data ); return $field; } add_filter( 'wpforms_textarea_field_display', 'wpf_dev_textarea_field_display', 10, 3 ); // Run smart tags on checkbox field label. function wpf_dev_checkbox_field_display( $field, $field_atts, $form_data ) { // Optional, you can limit to specific forms. Below, we restrict output to // form #365. if( $form_data[ 'id' ] != 365 ) return; $field[ 'label' ] = wpforms()->smart_tags->process( $field[ 'label' ], $form_data ); return $field; } add_filter( 'wpforms_checkbox_field_display', 'wpf_dev_checkbox_field_display', 10, 3 ); // Run smart tags on email field label. function wpf_dev_email_field_display( $field, $field_atts, $form_data ) { // Optional, you can limit to specific forms. Below, we restrict output to // form #365. if( $form_data[ 'id' ] != 365 ) return; $field[ 'label' ] = wpforms()->smart_tags->process( $field[ 'label' ], $form_data ); return $field; } add_filter( 'wpforms_email_field_display', 'wpf_dev_email_field_display', 10, 3 ); // Run smart tags on select field label. function wpf_dev_select_field_display( $field, $field_atts, $form_data ) { // Optional, you can limit to specific forms. Below, we restrict output to // form #365. if( $form_data[ 'id' ] != 365 ) return; $field[ 'label' ] = wpforms()->smart_tags->process( $field[ 'label' ], $form_data ); return $field; } add_filter( 'wpforms_select_field_display', 'wpf_dev_select_field_display', 10, 3 ); // Run smart tags on radio field label. function wpf_dev_radio_field_display( $field, $field_atts, $form_data ) { // Optional, you can limit to specific forms. Below, we restrict output to // form #365. if( $form_data[ 'id' ] != 365 ) return; $field[ 'label' ] = wpforms()->smart_tags->process( $field[ 'label' ], $form_data ); return $field; } add_filter( 'wpforms_radio_field_display', 'wpf_dev_radio_field_display', 10, 3 ); // Run smart tags on number field label. function wpf_dev_number_field_display( $field, $field_atts, $form_data ) { // Optional, you can limit to specific forms. Below, we restrict output to // form #365. if( $form_data[ 'id' ] != 365 ) return; $field[ 'label' ] = wpforms()->smart_tags->process( $field[ 'label' ], $form_data ); return $field; } add_filter( 'wpforms_number_field_display', 'wpf_dev_number_field_display', 10, 3 ); // Run smart tags on name field label. function wpf_dev_name_field_display( $field, $field_atts, $form_data ) { // Optional, you can limit to specific forms. Below, we restrict output to // form #365. if( $form_data[ 'id' ] != 365 ) return; $field[ 'label' ] = wpforms()->smart_tags->process( $field[ 'label' ], $form_data ); return $field; } add_filter( 'wpforms_name_field_display', 'wpf_dev_name_field_display', 10, 3 ); // Run smart tags on phone field label. function wpf_dev_phone_field_display( $field, $field_atts, $form_data ) { // Optional, you can limit to specific forms. Below, we restrict output to // form #365. if( $form_data[ 'id' ] != 365 ) return; $field[ 'label' ] = wpforms()->smart_tags->process( $field[ 'label' ], $form_data ); return $field; } add_filter( 'wpforms_phone_field_display', 'wpf_dev_phone_field_display', 10, 3 ); // Run smart tags on address field label. function wpf_dev_address_field_display( $field, $field_atts, $form_data ) { // Optional, you can limit to specific forms. Below, we restrict output to // form #365. if( $form_data[ 'id' ] != 365 ) return; $field[ 'label' ] = wpforms()->smart_tags->process( $field[ 'label' ], $form_data ); return $field; } add_filter( 'wpforms_address_field_display', 'wpf_dev_address_field_display', 10, 3 ); // Run smart tags on URL field label. function wpf_dev_url_field_display( $field, $field_atts, $form_data ) { // Optional, you can limit to specific forms. Below, we restrict output to // form #365. if( $form_data[ 'id' ] != 365 ) return; $field[ 'label' ] = wpforms()->smart_tags->process( $field[ 'label' ], $form_data ); return $field; } add_filter( 'wpforms_url_field_display', 'wpf_dev_url_field_display', 10, 3 ); // Run smart tags on password field label. function wpf_dev_password_field_display( $field, $field_atts, $form_data ) { // Optional, you can limit to specific forms. Below, we restrict output to // form #365. if( $form_data[ 'id' ] != 365 ) return; $field[ 'label' ] = wpforms()->smart_tags->process( $field[ 'label' ], $form_data ); return $field; } add_filter( 'wpforms_password_field_display', 'wpf_dev_password_field_display', 10, 3 ); // Run smart tags on payment checkbox field label. function wpf_dev_payment_checkbox_field_display( $field, $field_atts, $form_data ) { // Optional, you can limit to specific forms. Below, we restrict output to // form #365. if( $form_data[ 'id' ] != 365 ) return; $field[ 'label' ] = wpforms()->smart_tags->process( $field[ 'label' ], $form_data ); return $field; } add_filter( 'wpforms_payment_checkbox_field_display', 'wpf_dev_payment_checkbox_field_display', 10, 3 ); // Run smart tags on payment multiple select field label. function wpf_dev_payment_multiple_field_display( $field, $field_atts, $form_data ) { // Optional, you can limit to specific forms. Below, we restrict output to // form #365. if( $form_data[ 'id' ] != 365 ) return; $field[ 'label' ] = wpforms()->smart_tags->process( $field[ 'label' ], $form_data ); return $field; } add_filter( 'wpforms_payment_multiple_field_display', 'wpf_dev_payment_multiple_field_display', 10, 3 ); // Run smart tags on single payment field label. function wpf_dev_payment_single_field_display( $field, $field_atts, $form_data ) { // Optional, you can limit to specific forms. Below, we restrict output to // form #365. if( $form_data[ 'id' ] != 365 ) return; $field[ 'label' ] = wpforms()->smart_tags->process( $field[ 'label' ], $form_data ); return $field; } add_filter( 'wpforms_payment_single_field_display', 'wpf_dev_payment_single_field_display', 10, 3 );
Cette fonctionnalité ne prend pas en charge les données saisies par l'utilisateur (par exemple, {field_id="3"}
).
Et c'est tout ! Vous pouvez maintenant traiter vos Smart Tags dans les étiquettes de champ. Vous souhaitez traiter les Smart Tags dans les descriptions de champs ? Consultez notre article sur Comment traiter les Smart Tags dans les descriptions de champs.
En rapport
Référence du filtre : wpforms_textarea_field_display