> 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-progress-bar.md).

# AX - Barre de progression

## Aperçu

**AX - Barre de progression** est un composant Experience Cloud qui affiche un indicateur visuel de progression montrant le pourcentage d’achèvement ou l’atteinte d’un objectif sur les pages des sites Experience.

Utilisez-le pour montrer aux utilisateurs du portail leur progression vers des objectifs, l’état d’avancement de processus en plusieurs étapes, le pourcentage d’exigences satisfaites, ou toute mesure numérique de progression à partir des données Salesforce. Configurez la valeur de progression, les libellés, les couleurs et le style dans Experience Builder.

Idéal pour l’intégration des nouveaux utilisateurs, le suivi des objectifs, l’exhaustivité du profil, le suivi de la formation, ou partout où les utilisateurs du portail ont besoin d’un retour visuel sur leur progression vers une cible.

## Paramètres

{% tabs %}
{% tab title="🎛️ Propriétés" %}

<table><thead><tr><th>Nom</th><th width="202">Description</th><th>Utilisation</th></tr></thead><tbody><tr><td><strong>Libellé</strong></td><td>Le texte affiché pour identifier l’objectif de la barre de progression.</td><td>Implémentez cette propriété pour fournir aux utilisateurs une compréhension claire de la progression indiquée par la barre.</td></tr><tr><td><h4>Valeur</h4></td><td>Une valeur numérique qui représente la progression actuelle.</td><td>Définissez cette propriété pour refléter le pourcentage ou la fraction de la tâche ou du processus qui a été achevé.</td></tr><tr><td><strong>Libellé de la valeur</strong></td><td>Le libellé qui sera affiché à côté de la valeur, souvent sous forme de pourcentage ou de fraction.</td><td>Utilisez-le pour fournir une représentation textuelle de la valeur de progression, afin de clarifier l’information pour les utilisateurs.</td></tr><tr><td><strong>Position de la valeur</strong></td><td>Position du libellé de la valeur par rapport à la barre de progression. Les options incluent <code>En haut à droite</code>, <code>Gauche</code>, <code>Droite</code>, <code>En haut à gauche</code>, <code>En bas à droite</code>, et <code>En bas à gauche</code>.</td><td>Choisissez une position de la valeur qui améliore la lisibilité et s’intègre au design du contenu environnant.</td></tr><tr><td><strong>Taille</strong></td><td>L’épaisseur de la barre de progression. Les options incluent <code>Plein</code>, <code>Très petit</code>, <code>Petit</code>, <code>Moyen</code>, et <code>Grand</code>.</td><td>Sélectionnez une taille qui garantit que la barre de progression soit visible et harmonieuse avec la conception globale de la mise en page.</td></tr><tr><td><strong>Orientation</strong></td><td>La direction dans laquelle la barre de progression se remplit. Peut être définie sur <code>Horizontale</code> ou <code>Verticale</code>.</td><td>Alignez l’orientation avec la mise en page et la direction du flux du contenu pour une visualisation intuitive de la progression.</td></tr><tr><td><strong>Afficher la valeur</strong></td><td>Un interrupteur pour afficher ou masquer le libellé de la valeur de progression.</td><td>Utilisez ce réglage pour afficher directement la progression numérique sur la barre pour l’utilisateur, ou pour conserver un design épuré et minimaliste.</td></tr><tr><td><strong>Variante</strong></td><td>La forme de la barre de progression. Les options sont <code>Base</code> pour une barre droite ou <code>Circulaire</code> pour un indicateur de progression rond.</td><td>Choisissez une variante qui correspond le mieux au style visuel du site et au type de progression affiché.</td></tr><tr><td><strong>Texturé</strong></td><td>Ajoute un effet texturé à la barre de progression pour un détail visuel supplémentaire.</td><td>Appliquez cette propriété pour créer une apparence plus dynamique et plus tactile de la barre de progression.</td></tr><tr><td><strong>Thème</strong></td><td>Des thèmes de couleur prédéfinis qui indiquent la nature ou l’état de la progression. Les thèmes disponibles incluent <code>Base</code>, <code>Alt inverse</code>, <code>Erreur</code>, <code>Info</code>, <code>Inverse</code>, <code>Hors ligne</code>, <code>Succès</code>, et <code>Avertissement</code>.</td><td>Sélectionnez un thème pour transmettre différentes significations — par exemple, utilisez <code>Succès</code> pour les tâches terminées ou <code>Avertissement</code> pour les actions en attente.</td></tr><tr><td><strong>Épaisseur</strong></td><td>Ajustez l’épaisseur de la barre de progression. Les options incluent <code>Moyen</code>, <code>Très petit</code>, <code>Petit</code>, et <code>Grand</code>.</td><td>Choisissez l’épaisseur qui garantit la visibilité de la barre de progression et sa compatibilité esthétique avec les autres éléments du site.</td></tr></tbody></table>
{% endtab %}

{% tab title="🎨 Style" %}

{% 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:

```
GET https://docs.avonnicomponents.com/experience-cloud/experience-cloud-fr/experience-components/ax-progress-bar.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.