Si vous rencontrez des problèmes pour saisir automatiquement dans les formulaires Web sur un site Web que vous avez créé ou que vous gérez, vous pouvez optimiser le HTML pour mieux fonctionner avec Dashlane. Vous pouvez indiquer à Dashlane où et quoi saisir automatiquement en étiquetant les champs appropriés avec l'attribut data-form-type.
Cet article explique les scénarios les plus courants, mais vous pouvez utiliser n'importe laquelle des valeurs sur cette Page Github à propos de Dashlane et des formulaires Web.
Remarque: Si vous utilisez l'application Dashlane macOS, vous pouvez uniquement saisir automatiquement les détails de connexion enregistrés, même après optimisation du HTML. Cependant, vous pouvez mettre à jour vers l'Extension intelligente de Dashlane pour Safari pour accéder à notre fenêtre contextuelle d'extension riche en fonctionnalités et visionner votre coffre-fort dans le navigateur, ainsi que profiter des meilleures capacités de saisie automatique que Dashlane a à offrir.
Bien démarrer avec l'Extension intelligente de Dashlane pour Safari
Chaque attribut data-form-type doit avoir une ou plusieurs valeurs. Séparez les valeurs supplémentaires par une virgule sans espaces :
data-form-type="password,new"
Si vous ne voulez pas que Dashlane saisisse automatiquement un champ spécifique, utilisez la valeur « other » pour empêcher Dashlane de saisir automatiquement le champ. Cependant, vous verrez toujours l'Alerte Dashlane dans le HTML du formulaire lorsque vous consultez la page avec les outils de développeur ou similaire.
data-form-type=”other”
Installer Dashlane pour saisir automatiquement les identifiants, noms d'utilisateur, et mots de passe
Si vous avez une page web de connexion et que Dashlane ne peut pas saisir automatiquement le nom d'utilisateur et le mot de passe, ajoutez ces attributs data-form-type au HTML de la page web.
Pour le formulaire de connexion lui-même, utilisez :
data-form-type=”login”
Pour le nom d'utilisateur, utilisez :
data-form-type=”username”
Pour le mot de passe, utilisez :
data-form-type=”password”
Exemple d'un formulaire de connexion typique avec les attributs data-form-type ajoutés en gras :
<form action="/login" data-form-type="login">
<label for="username">Nom d'utilisateur</label>
<input type="text" id="username" data-form-type="username">
<label for="password">Mot de passe</label>
<input type="password" id="password" data-form-type="password">
</form>
Si votre champ de nom d'utilisateur permet aux personnes de se connecter avec un e-mail ou un numéro de téléphone, ajoutez « email,phone » comme attributs data-form-type supplémentaires au HTML de la page web.
Voici à quoi ressemble cette ligne de HTML, avec les attributs supplémentaires ajoutés en gras :
<label for="username">Nom d'utilisateur</label>
<input type="text" id="username" data-form-type="username,e-mail,téléphone">
Installer Dashlane pour saisir automatiquement les nouveaux mots de passe modifiés
Si votre page web permet aux gens de modifier leurs mots de passe et que Dashlane ne peut pas saisir automatiquement le nouveau mot de passe, ajoutez les attributs data-form-type suivants au HTML de la page web.
Pour le formulaire de changement de mot de passe lui-même, utilisez :
data-form-type=”change_password”
Pour l'ancien mot de passe, utilisez :
data-form-type=”password”
Pour le nouveau mot de passe, utilisez :
data-form-type=”password,new”
Pour une confirmation du nouveau mot de passe, utilisez :
data-form-type=”password,confirmation”
Exemple d'un formulaire de mot de passe typique, avec les attributs data-form-type ajoutés en gras :
<form action="/change-password" data-form-type="change_password">
<label for="old-password">Votre ancien mot de passe :</label>
<input type="password" id="old-password" data-form-type="password">
<label for="new-password">Votre nouveau mot de passe :</label>
<input type="password" id="new-password" data-form-type="password,new">
<label for="new-password-repeat">Répétez votre nouveau mot de passe :</label>
<input type="password" id="new-password-repeat" data-form-type="password,confirmation">
</form>
Installer Dashlane pour saisir automatiquement les informations de paiement
Si vous avez une page web qui permet aux gens de saisir leurs informations de carte bancaire et que Dashlane ne peut pas saisir automatiquement les informations, ajoutez les attributs data-form-type suivants au HTML de la page web :
Pour le formulaire de paiement lui-même, utilisez :
data-form-type=”payment”
Pour le numéro de carte bancaire, utilisez :
data-form-type=”payment,credit_card”
Si cela est divisé en plusieurs champs, utilisez ceci pour chaque :
“payment,credit_card,part”
Pour la date d'expiration, utilisez :
data-form-type=”payment,credit_card,date”
Si cela est divisé en mois et année, utilisez :
data-form-type="payment,credit_card,date,expiration,month"
et
data-form-type="payment,credit_card,date,expiration,year"
Pour le CVV de la carte bancaire, utilisez :
data-form-type="payment,credit_card,cvv"
Exemple d'un formulaire de paiement typique avec les attributs data-form-type ajoutés en gras :
<form action="/checkout-payment" data-form-type="payment">
<label>Numéro de carte bancaire</label>
<fieldset>
<input type="text" id="cc-number-block-1" aria-label="numéro de carte bancaire bloc 1" data-form-type="payment,credit_card,part">
<input type="text" id="cc-number-block-2" aria-label="numéro de carte bancaire bloc 2" data-form-type="payment,credit_card,part">
<input type="text" id="cc-number-block-3" aria-label="numéro de carte bancaire bloc 3" data-form-type="payment,credit_card,part">
<input type="text" id="cc-number-block-4" aria-label="numéro de carte bancaire bloc 4" data-form-type="payment,credit_card,part">
</fieldset>
<label>Date d'expiration/label>
<fieldset>
<select id="cc-expiration-month" data-form-type="payment,credit_card,date,expiration,month">
<option value="" aria-label="sélectionnez le mois d'expiration de votre carte">Mois</option>
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
</select>
<select id="cc-expiration-year" data-form-type="payment,credit_card,date,expiration,year">
<option value="" aria-label="sélectionnez l'année d'expiration de votre carte">Année</option>
<option value="24">24</option>
<option value="23">23</option>
<option value="21">21</option>
</select>
</fieldset>
<label for="cvv">CVV</label>
<input type="text" id="cvv" data-form-type="payment,credit_card,cvv">
</form>