> For the complete documentation index, see [llms.txt](https://docs.avonnicomponents.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.avonnicomponents.com/experience-cloud/experience-cloud-fr/experience-components/ax-alert.md).

# AX - Alerte

## Aperçu

**AX - Alerte** est un composant Experience Cloud qui affiche des messages et des notifications importants aux utilisateurs du portail sur les pages des sites Experience.

Utilisez-le pour afficher des alertes système, des messages d'erreur, des avertissements, des confirmations de réussite ou des annonces urgentes. Contrôlez quand les alertes apparaissent, ce qu'elles indiquent et leur apparence — le tout configuré dans Experience Builder sans code.

Idéal pour les avis de maintenance du portail, les confirmations de soumission de formulaire, les alertes d'état du compte ou pour guider les utilisateurs à travers des processus sur les portails clients ou partenaires.

<figure><img src="/files/8510be6fcbb952d1bcf2a2481ec7a33c47cb7459" alt=""><figcaption></figcaption></figure>

## Configuration

### Propriétés

**Variante** personnalise l'apparence de l'alerte afin de mieux refléter le type de message que vous transmettez. Choisissez celle qui correspond au message que vous souhaitez diffuser pour une meilleure compréhension de l'utilisateur :

| Variante          | Quand l’utiliser                                                           |
| ----------------- | -------------------------------------------------------------------------- |
| **Base**          | Une alerte standard à usage général.                                       |
| **Erreur**        | Pour les notifications ou problèmes critiques.                             |
| **Hors ligne**    | Indique des problèmes de connectivité ou de disponibilité.                 |
| **Avertissement** | Pour les alertes qui nécessitent une attention mais ne sont pas critiques. |

**Contenu** est le message principal véhiculé dans l'alerte, garantissant que les utilisateurs sont informés de la notification ou de la situation spécifique. Pour des messages plus riches, vous pouvez à la place fournir un balisage personnalisé via l'emplacement de contenu du composant.

**Nom de l'icône** définit une icône Lightning Design System pour l'alerte (par exemple `utility:info`), représentant visuellement la nature ou le contexte du message. **Taille de l’icône** contrôle la taille d'affichage de l'icône — XX-Small, X-Small, Small, Medium ou Large — et nécessite un **Nom de l'icône**.

**Fermable** affiche un bouton de fermeture afin que les utilisateurs puissent fermer manuellement l'alerte. Activez-le lorsque le message est informatif et que les utilisateurs doivent pouvoir le quitter.

**Texturé** applique un motif d'arrière-plan texturé à l'alerte pour un aspect plus distinctif.

## Style

Personnalisez l'apparence de l'alerte depuis le **Style** section de l’éditeur de propriétés.

{% tabs %}
{% tab title="Espacement" %}
Ajuste les marges de l'alerte :

* **Début du bloc :** Définissez la marge supérieure.
* **Fin du bloc :** Ajustez la marge inférieure.
* **Début en ligne :** Configurez la marge gauche.
* **Fin en ligne :** Modifiez la marge droite.
  {% endtab %}

{% tab title="Arrière-plan" %}
Permet de personnaliser l'arrière-plan :

* **Couleur :** Sélectionnez une couleur unie pour l'arrière-plan.
* **Dégradé linéaire :** Choisissez cette option pour un effet de dégradé dynamique et visuellement attrayant.
  {% endtab %}

{% tab title="Texte" %}
Permet de personnaliser le texte :

* **Couleur :** Modifiez la couleur du texte pour une meilleure visibilité.
* **Graisse de police :** Choisissez l'épaisseur de la police pour mettre l'accent.
* **Alignement horizontal :** Sélectionnez l'alignement du texte pour un affichage optimal dans l'alerte.
  {% endtab %}

{% tab title="Bordure" %}
Propose des options pour personnaliser l'apparence de la bordure :

* **Couleur :** Choisissez une couleur pour le bord de la bordure.
* **Taille :** Sélectionnez l'épaisseur de la bordure.
* **Style :** Déterminez l'aspect général grâce à différents styles.
  {% endtab %}

{% tab title="Icône" %}
Permet diverses personnalisations de l'apparence de l'icône :

* **Couleur de fond :** Modifiez la couleur d'arrière-plan derrière l'icône.
* **Couleur de premier plan :** Modifiez la couleur principale de l'icône.
* **Icône de fermeture au premier plan :** Spécifiez la couleur de l'icône de fermeture de l'alerte.
* **Utilitaire de couleur au premier plan :** Effectuez d'autres ajustements de couleur pour une meilleure visibilité et un meilleur contraste.
  {% endtab %}
  {% endtabs %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.avonnicomponents.com/experience-cloud/experience-cloud-fr/experience-components/ax-alert.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.