> ## Documentation Index
> Fetch the complete documentation index at: https://docs-staging-react-sdk-reference.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Messages personnalisés et traduction

> Cette section décrit comment créer des messages personnalisés et des traductions avec les formulaires.

Vous pouvez personnaliser les messages du formulaire pour offrir à vos utilisateurs une expérience unique. En outre, vous pouvez traduire les composants des formulaires, les erreurs et d’autres messages personnalisés dans d’autres langues pour une expérience localisée.

## Messages

Grâce à l’éditeur de formulaires, vous pouvez personnaliser les messages d’erreur et créer d’autres messages personnalisés pour vos utilisateurs.

### Messages d’erreur

Vous pouvez créer des messages d’erreur personnalisés pour remplacer les messages d’erreur par défaut de vos formulaires.

Pour créer des messages d’erreur personnalisés, suivez les étapes ci-après :

1. Dans Auth0 Dashboard, accédez à **Actions > Forms (Formulaires)**.
2. Sélectionnez **Messages** dans le menu de gauche de l’éditeur de formulaire.
3. Sélectionnez l’onglet **Errors (erreurs)**.
4. Saisissez vos messages d’erreur personnalisés dans les champs appropriés pour remplacer les messages par défaut.
5. Sélectionnez **Publish (Publier)** pour enregistrer.

### Messages personnalisés

Vous pouvez créer des messages personnalisés à ajouter aux messages par défaut pour une expérience de formulaire encore plus personnalisée. Par exemple, vous pouvez ajouter un message personnalisé qui s’affiche aux utilisateurs lorsqu’une action débouche sur une erreur dans un flux.

#### Créer des messages personnalisés

Pour créer des messages personnalisés, suivez les étapes ci-après :

1. Dans le menu de gauche de l’éditeur de formulaires, sélectionnez **Messages**.
2. Sélectionnez l’onglet **Custom (Personnalisés)** , puis **Add New Item (Ajouter un nouvel élément)**.
3. À gauche, ajoutez une clé unique pour votre message\*\*.\*\* Ensuite, **saisissez** votre message personnalisé dans le champ à droite.
4. Sélectionnez **Publish (Publier)** pour enregistrer.

<Frame>
  <img src="https://mintcdn.com/docs-staging-react-sdk-reference/6S6obn4-KToTtnCW/docs/images/fr-ca/cdy7uua7fh8z/1upBOwWqntPPQF8fqGeN6T/a65674d05c823c5fbe703265558693e4/custom-message.png?fit=max&auto=format&n=6S6obn4-KToTtnCW&q=85&s=64d597fc98e7929333376c950445fb78" alt="Dashboard > Forms > Custom messages and translations > Custom message" data-og-width="704" width="704" data-og-height="539" height="539" data-path="docs/images/fr-ca/cdy7uua7fh8z/1upBOwWqntPPQF8fqGeN6T/a65674d05c823c5fbe703265558693e4/custom-message.png" data-optimize="true" data-opv="3" srcset="https://mintcdn.com/docs-staging-react-sdk-reference/6S6obn4-KToTtnCW/docs/images/fr-ca/cdy7uua7fh8z/1upBOwWqntPPQF8fqGeN6T/a65674d05c823c5fbe703265558693e4/custom-message.png?w=280&fit=max&auto=format&n=6S6obn4-KToTtnCW&q=85&s=1c2c1008fbb721cf45dea8eef89dea97 280w, https://mintcdn.com/docs-staging-react-sdk-reference/6S6obn4-KToTtnCW/docs/images/fr-ca/cdy7uua7fh8z/1upBOwWqntPPQF8fqGeN6T/a65674d05c823c5fbe703265558693e4/custom-message.png?w=560&fit=max&auto=format&n=6S6obn4-KToTtnCW&q=85&s=b7b423fe6ce5917b97dc8cb6372c6d3e 560w, https://mintcdn.com/docs-staging-react-sdk-reference/6S6obn4-KToTtnCW/docs/images/fr-ca/cdy7uua7fh8z/1upBOwWqntPPQF8fqGeN6T/a65674d05c823c5fbe703265558693e4/custom-message.png?w=840&fit=max&auto=format&n=6S6obn4-KToTtnCW&q=85&s=3583b8c8365f12c631c88adc393984cb 840w, https://mintcdn.com/docs-staging-react-sdk-reference/6S6obn4-KToTtnCW/docs/images/fr-ca/cdy7uua7fh8z/1upBOwWqntPPQF8fqGeN6T/a65674d05c823c5fbe703265558693e4/custom-message.png?w=1100&fit=max&auto=format&n=6S6obn4-KToTtnCW&q=85&s=1f3434e4d48c1ec2e38dde6e1efe53d5 1100w, https://mintcdn.com/docs-staging-react-sdk-reference/6S6obn4-KToTtnCW/docs/images/fr-ca/cdy7uua7fh8z/1upBOwWqntPPQF8fqGeN6T/a65674d05c823c5fbe703265558693e4/custom-message.png?w=1650&fit=max&auto=format&n=6S6obn4-KToTtnCW&q=85&s=8d92a156c4e98dbb166701654ef321de 1650w, https://mintcdn.com/docs-staging-react-sdk-reference/6S6obn4-KToTtnCW/docs/images/fr-ca/cdy7uua7fh8z/1upBOwWqntPPQF8fqGeN6T/a65674d05c823c5fbe703265558693e4/custom-message.png?w=2500&fit=max&auto=format&n=6S6obn4-KToTtnCW&q=85&s=9d4af77a5c373a45aa519a917e25f918 2500w" />
</Frame>

#### Ajouter des messages personnalisés à vos formulaires

Pour référencer vos messages personnalisés dans vos formulaires, utilisez la fonction `{{t(’custom_unique_key’)}}` avec la clé unique du message personnalisé.

<Frame>
  <img src="https://mintcdn.com/docs-staging-react-sdk-reference/ASCRWWN0i_v0L85I/docs/images/fr-ca/cdy7uua7fh8z/45p4V7w5gw7DQZyJ08ECSH/d040720d9aa19f6e97e21defcd428e55/translation-function.png?fit=max&auto=format&n=ASCRWWN0i_v0L85I&q=85&s=ffc4aca7f365ef86e4b182bb0c43cf7b" alt="Dashboard > Forms > Custom messages and translations > Translation function" data-og-width="450" width="450" data-og-height="449" height="449" data-path="docs/images/fr-ca/cdy7uua7fh8z/45p4V7w5gw7DQZyJ08ECSH/d040720d9aa19f6e97e21defcd428e55/translation-function.png" data-optimize="true" data-opv="3" srcset="https://mintcdn.com/docs-staging-react-sdk-reference/ASCRWWN0i_v0L85I/docs/images/fr-ca/cdy7uua7fh8z/45p4V7w5gw7DQZyJ08ECSH/d040720d9aa19f6e97e21defcd428e55/translation-function.png?w=280&fit=max&auto=format&n=ASCRWWN0i_v0L85I&q=85&s=c0ae902be37dd284e9ee480985d38e56 280w, https://mintcdn.com/docs-staging-react-sdk-reference/ASCRWWN0i_v0L85I/docs/images/fr-ca/cdy7uua7fh8z/45p4V7w5gw7DQZyJ08ECSH/d040720d9aa19f6e97e21defcd428e55/translation-function.png?w=560&fit=max&auto=format&n=ASCRWWN0i_v0L85I&q=85&s=310a2b8b2d00ca59213b58e763d377bd 560w, https://mintcdn.com/docs-staging-react-sdk-reference/ASCRWWN0i_v0L85I/docs/images/fr-ca/cdy7uua7fh8z/45p4V7w5gw7DQZyJ08ECSH/d040720d9aa19f6e97e21defcd428e55/translation-function.png?w=840&fit=max&auto=format&n=ASCRWWN0i_v0L85I&q=85&s=d2ff4115d4ff15a5778c58c71c11ec98 840w, https://mintcdn.com/docs-staging-react-sdk-reference/ASCRWWN0i_v0L85I/docs/images/fr-ca/cdy7uua7fh8z/45p4V7w5gw7DQZyJ08ECSH/d040720d9aa19f6e97e21defcd428e55/translation-function.png?w=1100&fit=max&auto=format&n=ASCRWWN0i_v0L85I&q=85&s=4afb227c949097f3f506850e2ddcf160 1100w, https://mintcdn.com/docs-staging-react-sdk-reference/ASCRWWN0i_v0L85I/docs/images/fr-ca/cdy7uua7fh8z/45p4V7w5gw7DQZyJ08ECSH/d040720d9aa19f6e97e21defcd428e55/translation-function.png?w=1650&fit=max&auto=format&n=ASCRWWN0i_v0L85I&q=85&s=33681f9a7280327e4c628d2d907477f2 1650w, https://mintcdn.com/docs-staging-react-sdk-reference/ASCRWWN0i_v0L85I/docs/images/fr-ca/cdy7uua7fh8z/45p4V7w5gw7DQZyJ08ECSH/d040720d9aa19f6e97e21defcd428e55/translation-function.png?w=2500&fit=max&auto=format&n=ASCRWWN0i_v0L85I&q=85&s=6307593360d70ae72c87b5d88b12313c 2500w" />
</Frame>

## Traductions

Vous pouvez utiliser la fonctionnalité Translations (traduction) pour créer une expérience utilisateur internationale pour vos formulaires. Cette fonctionnalité s’appuie sur la langue du navigateur de l’utilisateur pour déterminer la langue appropriée pour vos formulaires.
Par défaut, des traductions pour certains messages d’erreur standard sont fournies en espagnol. Cependant, pour promouvoir une expérience utilisateur de qualité, vous pouvez définir les traductions de vos composants de formulaire, des erreurs et des messages personnalisés dans la langue de votre choix.

Pour activer les traductions, suivez les étapes ci-dessous :

1. Dans Auth0 Dashboard, accédez à **Actions > Forms (Formulaires)**.
2. Sélectionnez **Translations (Traductions)** dans le menu de gauche de l’éditeur de formulaire.
3. Cochez **Enable additional languages (Activer des langues supplémentaires)**.
4. Sélectionnez les langues souhaitées dans le menu déroulant **Additional languages (Langues supplémentaires)**.

### Traduire les messages

Avec l’éditeur de langue, vous pouvez définir des traductions pour vos composants de formulaire, erreurs et autres messages personnalisés.

Pour définir vos traductions, suivez les étapes ci-après :

1. Sélectionnez la langue souhaitée dans la liste déroulante **Select language (Sélectionner la langue)**.
2. Sélectionnez l’un des onglets suivants pour commencer à définir vos traductions :

   1. **Components (Composants)**
   2. **Errors (Erreurs)**
   3. **Custom (Personnalisés)**
3. Pour chaque champ disponible, fournissez vos traductions si nécessaire.
4. Sélectionnez **Publish (Publier)** pour enregistrer.

<Frame>
  <img src="https://mintcdn.com/docs-staging-react-sdk-reference/OwNehXm0zD5OjAmR/docs/images/fr-ca/cdy7uua7fh8z/5HY9FA6HZct2XNv5K4pCHY/c5977a7825e15285c3d77c2ca1e299a8/translation-message.png?fit=max&auto=format&n=OwNehXm0zD5OjAmR&q=85&s=18337e9ee0e4db313898d0572e8828be" alt="Dashboard > Forms > Custom messages and translations > Translation message" data-og-width="701" width="701" data-og-height="885" height="885" data-path="docs/images/fr-ca/cdy7uua7fh8z/5HY9FA6HZct2XNv5K4pCHY/c5977a7825e15285c3d77c2ca1e299a8/translation-message.png" data-optimize="true" data-opv="3" srcset="https://mintcdn.com/docs-staging-react-sdk-reference/OwNehXm0zD5OjAmR/docs/images/fr-ca/cdy7uua7fh8z/5HY9FA6HZct2XNv5K4pCHY/c5977a7825e15285c3d77c2ca1e299a8/translation-message.png?w=280&fit=max&auto=format&n=OwNehXm0zD5OjAmR&q=85&s=9324432ab4896973e5e6e1be1135edde 280w, https://mintcdn.com/docs-staging-react-sdk-reference/OwNehXm0zD5OjAmR/docs/images/fr-ca/cdy7uua7fh8z/5HY9FA6HZct2XNv5K4pCHY/c5977a7825e15285c3d77c2ca1e299a8/translation-message.png?w=560&fit=max&auto=format&n=OwNehXm0zD5OjAmR&q=85&s=5cb231104cd84ff95aa3535c415d3c7d 560w, https://mintcdn.com/docs-staging-react-sdk-reference/OwNehXm0zD5OjAmR/docs/images/fr-ca/cdy7uua7fh8z/5HY9FA6HZct2XNv5K4pCHY/c5977a7825e15285c3d77c2ca1e299a8/translation-message.png?w=840&fit=max&auto=format&n=OwNehXm0zD5OjAmR&q=85&s=b0696a88e88252c623f2784e9a2a554e 840w, https://mintcdn.com/docs-staging-react-sdk-reference/OwNehXm0zD5OjAmR/docs/images/fr-ca/cdy7uua7fh8z/5HY9FA6HZct2XNv5K4pCHY/c5977a7825e15285c3d77c2ca1e299a8/translation-message.png?w=1100&fit=max&auto=format&n=OwNehXm0zD5OjAmR&q=85&s=15bb76a13ed61c6fb59ae18f2604951f 1100w, https://mintcdn.com/docs-staging-react-sdk-reference/OwNehXm0zD5OjAmR/docs/images/fr-ca/cdy7uua7fh8z/5HY9FA6HZct2XNv5K4pCHY/c5977a7825e15285c3d77c2ca1e299a8/translation-message.png?w=1650&fit=max&auto=format&n=OwNehXm0zD5OjAmR&q=85&s=f3d1c68df3b687af33e8e96def668d3d 1650w, https://mintcdn.com/docs-staging-react-sdk-reference/OwNehXm0zD5OjAmR/docs/images/fr-ca/cdy7uua7fh8z/5HY9FA6HZct2XNv5K4pCHY/c5977a7825e15285c3d77c2ca1e299a8/translation-message.png?w=2500&fit=max&auto=format&n=OwNehXm0zD5OjAmR&q=85&s=1f5eae0fad9ebaba8ec5ffa4fc73ea26 2500w" />
</Frame>
