> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.poool.fr/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Comment créer un élément Engage en plusieurs étapes, grâce à la fonctionnalité champ caché ?

Vous souhaitez proposer une animation en plusieurs étapes sur votre site ? Vous pouvez au sein d'un seul élément Engage mettre en place un format qui contient plusieurs visuels et actions.
Ce type de format est intéressant pour guider vos nouveaux membres ou abonnés à travers un court parcours de découverte (format product tour ou mini onboarding).

![](https://storage.crisp.chat/users/helpdesk/website/-/5/f/5/0/5f50f52b22503800/enregistrement-de-lecran-2026-_192u6ef.gif =351x400)



|| Si ce format vous intéresse, un template est disponible dans notre [catalogue d'apparence](https://help.poool.fr/fr/article/catalogue-dapparences-engage-elements-1whqbze/) Engage. Vous aurez ainsi un premier squelette à votre disposition, que vous pourrez adapter avec vos propres textes et images. 

Pour ce cas d'usage, il faudra suivre 3 paramétrages :
1. Intégrer le composant "**champ caché**" comme base de la logique globale, avec une variable associée
2. Créer le design de chaque étape au sein de [rangées distinctes](https://help.poool.fr/fr/article/comment-utiliser-les-rangees-pour-structurer-son-wall-1p36g82/), et définir la valeur de la variable modifiée selon chacune des étapes
3. Configurer le passage d'une étape à l'autre, en changeant les valeurs des variables lors du clic sur le bouton

Retrouvez le détail pour chaque paramétrage dans la suite de cet article. 

# Mise en place du champ caché

Afin de contrôler le passage d'une étape à une autre, on utilise la fonctionnalité **champ caché**, disponible dans la sélection "champs de formulaires". 

![](https://storage.crisp.chat/users/helpdesk/website/-/5/f/5/0/5f50f52b22503800/capture-decran-2026-05-27-a-11_gn6z2n.png =2783x500)our ce champ > O*ptions de champ caché > Paramètres*, nous attribuons un **nom de variable**, qui permettra de configurer le changement des états au sein de l'élément. 

Dans notre exemple, nous définissons "**etape**" comme nom de variable et une valeur par défaut "1". 
Cela signifie que pour le premier affichage (par défaut), l'élément Engage sera sur le bloc qui correspond à l'étape 1. 

![](https://storage.crisp.chat/users/helpdesk/website/-/5/f/5/0/5f50f52b22503800/capture-decran-2026-05-27-a-11_v4hle1.png =550x500)


# Configurer l'affichage des différentes étapes

Chaque écran correspond à un bloc de composants intégrés dans [une rangée](https://help.poool.fr/fr/article/comment-utiliser-les-rangees-pour-structurer-son-wall-1p36g82/), sur laquelle nous appliquons nos paramètres d'affichage, en fonction de l'étape dans laquelle l'utilisateur se trouve. 

Dans les options "*Avancé*" de chacune de ces rangées, cible "**basé sur une variable**", la valeur de la variable "**etape**" est définie : 1, 2, ou 3. 
Le nom de la cible reprend le champ caché "field" , et le nom de la variable "etape" =>  "**field:etape"**.


![](https://storage.crisp.chat/users/helpdesk/website/-/5/f/5/0/5f50f52b22503800/enregistrement-de-lecran-2026-_ap3kn7.gif)
### Rangée n°1 : paramétrage pour l'écran n°1 du carroussel

![](https://storage.crisp.chat/users/helpdesk/website/-/5/f/5/0/5f50f52b22503800/capture-decran-2026-05-27-a-11_e674tt.png)
### Rangée n°2 : paramétrage pour la fonctionnalité n°2 du carroussel

![](https://storage.crisp.chat/users/helpdesk/website/-/5/f/5/0/5f50f52b22503800/capture-decran-2026-05-27-a-11_1wsud59.png)
### Rangée n°3 : paramétrage pour la fonctionnalité n°3 du carroussel

![](https://storage.crisp.chat/users/helpdesk/website/-/5/f/5/0/5f50f52b22503800/capture-decran-2026-05-27-a-11_cldm4d.png)



# Définir la logique de passage d'une étape à l'autre

Cette première configuration étant remplie, il faut à présent définir comment l'utilisateur passe d'une étape à l'autre. 

Dans notre cas, c'est le clic sur le bouton "**Etape suivante**" qui permet de changer d'écran. il faut donc paramétrer ce changement d'état dans le composant "bouton".

Ce paramétrage s'effectue dans les **options du bouton**. Dans l'onglet paramètre, vous allez définir :
* Texte du bouton
* Action = "**changer la valeur d'un champ**"
* Nom de variable du champ = nom de votre variable, ici "**etape**"
* Type de changement = **Incrémenter**
* Valeur du champ = 1. Techniquement, le bouton permet de changer la valeur "etape" = "etape" + 1
* Identifiant du bouton = identifiant de votre bouton d'action (utile pour le suivi analytics, afin d'isoler les interactions avec cet élément)
Ainsi l'affichage du bloc sera adapté automatiquement en fonction de la nouvelle valeur.

![](https://storage.crisp.chat/users/helpdesk/website/-/5/f/5/0/5f50f52b22503800/capture-decran-2026-05-27-a-11_1ha8ht7.png)



| Vous pouvez aussi paramétrer cette même logique en utilisant un composant cliquable à la place d'un bouton, selon le design souhaité. 

Une fois ces trois étapes remplies, définissez les conditions d'affichage habituelles et activez votre élément !

# Suivi des performances

Retrouvez les performances de votre élément dans votre onglet [statistiques](https://help.poool.fr/fr/article/comment-lire-les-statistiques-dans-engage-1qir23l/) : données impressions, vues et clics. 

En revanche, le détail par écran et par action ne sera pas dissocié dans le Dashboard. Plus précisément, vous aurez les indicateurs suivants :

* Impressions : prend en compte le chargement de l'élément global. 
* Vues : correspond à la visibilité de l'élément. Le détail par écran n'est pas disponible dans les statistiques Dashboard.
* Clics : représente l'ensemble des clics sur l'élément (hors bouton de fermeture). Le détail par boutons n'est pas disponibles dans les statistiques Poool. 

||| Si vous souhaitez obtenir un détail précis des performances de chaque action, nous vous recommandons de mettre en place un tracking spécifique (via tracking personnalisé, ou en utilisant nos connecteurs analytics). N'oubliez pas de renseigner correctement les identifiants de vos boutons pour une lecture facilitée dans vos outils analytics. 



