Comment localiser l'ID du formulaire et l'ID du champ

Lorsque vous utilisez des extraits de code personnalisés ou du CSS avec WPForms, vous devrez souvent trouver des ID de formulaire et de champ spécifiques. Ces ID vous aident à cibler précisément le formulaire ou le champ que vous souhaitez personnaliser.

Ce guide vous montrera les moyens les plus rapides de trouver ces ID.

Trouver l'ID de votre formulaire

Le moyen le plus simple de trouver rapidement l'ID d'un formulaire se trouve sur la page Vue d'ensemble des formulaires. Pour accéder à cette page, allez dans WPForms » Tous les formulaires et recherchez la colonne Shortcode. L'ID de votre formulaire est le numéro à l'intérieur du shortcode.

Par exemple, la capture d'écran ci-dessous indique le shortcode [wpforms id="1233"]. L'ID de ce formulaire serait 1233.

Trouver l'ID de votre champ

Pour trouver l'ID d'un champ spécifique, modifiez votre formulaire dans le Constructeur de formulaires. Ensuite, cliquez sur le champ que vous souhaitez identifier et regardez le panneau Options du champ sur la gauche. L'ID du champ apparaît en haut de l'onglet Général.

Par exemple, si vous voyez « Texte sur une seule ligne (ID #15) », votre ID de champ est 15.

Comment utiliser ces ID

Lorsque vous voyez des extraits de code dans notre documentation, vous devrez remplacer les ID d'exemple par vos ID réels. Voici comment les utiliser correctement :

• Pour les ID de formulaire, remplacez VOTRE-ID-FORMULAIRE par votre numéro de formulaire réel. Par exemple, si votre ID de formulaire est 561, remplacez wpforms-VOTRE-ID-FORMULAIRE par wpforms-561.
• Pour les ID de champ, remplacez VOTRE-ID-CHAMP par votre numéro de champ réel. Par exemple, si votre ID de champ est 13, remplacez field_VOTRE-ID-CHAMP par field_13.

Donc, si votre ID de formulaire est 999 et votre ID de champ est 4, vous changeriez :

jQuery('#wpforms-123-field_13')

en :

jQuery('#wpforms-999-field_4')

Ces ID sont essentiels pour de nombreuses personnalisations :

• Les ID de formulaire sont nécessaires lors de l'application de CSS à un formulaire spécifique, de l'ajout de validation personnalisée ou de la création de fonctionnalités spécifiques au formulaire.
• Les ID de champ sont nécessaires lors de la mise en forme de champs spécifiques, de l'ajout de règles de validation personnalisées ou de la création de calculs spécifiques aux champs.

Par exemple, lors de la personnalisation des couleurs du bouton de soumission, l'utilisation d'ID de formulaire spécifiques garantit que vos modifications n'affectent que les formulaires prévus :

/* Customize submit button color for specific forms */
#wpforms-form-561 .wpforms-submit {
    background-color: red;
}

Et c'est tout ce dont vous avez besoin pour trouver et utiliser les ID de formulaire et de champ !

Ensuite, souhaitez-vous en savoir plus sur la personnalisation de vos formulaires ? Consultez notre guide sur l'ajout de styles CSS personnalisés pour vos formulaires.