Système de gestion de contenu (CMS) : Ajouter et configurer une barre de progression
9 min
Ajoutez une barre de progression pour afficher une représentation visuelle des progrès vers la réalisation d'un objectif. Vous pouvez utiliser le codage Velo ou un champ de collection du système de gestion de contenu (CMS) pour représenter la valeur de progression. Pour la valeur cible, vous pouvez définir une valeur statique qui ne change pas, ou définir une valeur dynamique avec Velo ou en connectant un champ de collection.

Exemples d'utilisation des barres de progression :
- Affichez le nombre de tâches marquées comme « terminées » sur une liste de tâches.
- Affichez le pourcentage d'étapes complétées au cours d'un processus d'intégration.
- Affichez le montant collecté pour un objectif de collecte de fonds.
- Affichez le nombre de personnes qui ont signé une requête qui nécessite un certain nombre de votes.
Suggestion :
Vous pouvez utiliser Velo pour mettre à jour la valeur de la barre de progression sans vous connecter au système de gestion de contenu (CMS). Pour en savoir plus, veuillez consulter Télécharger l'API de la barre de progression.
Avant de commencer :
Ajoutez le CMS sur votre site et créer une collection qui comprend un type de champ « Nombre » pour votre valeur de progression. Si vous souhaitez utiliser une valeur dynamique pour la valeur cible, ajoutez également un champ « Nombre » qui représente la cible.
Pour ajouter et configurer une barre de progression :
Éditeur Wix
Éditeur Studio
- Accédez à votre éditeur.
- Assurez-vous que vous avez activé Velo dans votre éditeur :
- Cliquez sur Mode développeur en haut de la page.
- Cliquez sur Activer le mode développeur.
- Cliquez sur Ajouter des éléments
à gauche de l'éditeur.
- Cliquez sur Interactif.
- Cliquez sur la barre de progression sous Indicateurs.
- Cliquez et faites glisser la barre de progression de votre choix sur la page.
- Cliquez sur Paramètres dans la barre de progression.
- Saisissez un libellé qui permet aux visiteurs et aux lecteurs d'écran de savoir ce que la barre représente (ex. « Progression vers l'objectif »)
- Choisissez si vous souhaitez définir la valeur cible en tant que valeur dynamique ou valeur statique :
Valeur cible dynamique
Valeur cible statique