Faire des carrousels dynamiques

Voici comment présenter un carrousel rempli dynamiquement à partir d’un Excel, Airtable ou G Sheet !

Vous avez créé un chatbot dont les contenus sont dynamiques et basés entièrement sur une base de donnée externe au chatbot (par exemple airtable).

Imaginons que vous présentez à vos utilisateurs des actualités classées par catégories. Les catégories sont dynamiques et les actualités aussi. Vous souhaitez qu’un utilisateur puisse décider de sa catégorie d’actu avant d’accéder aux actus qui correspondent.

1ere étape :

Récupérer les catégories d’actus

cf https://aide.vizir.co/fr/articles/4150122-declencher-un-workflow-depuis-un-outil-tiers

 

2ème étape :

Placer ces catégories dans un carrousel dans la ressource de collecte “categorie”

cf https://aide.vizir.co/fr/articles/3885130-comment-permettre-aux-utilisateurs-de-charger-des-images-dans-le-chatbot

 

3ème étape :

Récupérer la valeur de la catégorie sélectionnée grâce au clic du bouton de carrousel

 

WARNING TRICKY :

Dans le carrousel vous allez avoir un bouton “Sélectionner” => mai cette information seule ne vous permettrait pas de savoir ce que l’utilisateur a sélectionné. C’est pour cette raison que nous allons créer un payload un peu spécial pour ce bouton :

“Sélectionner_” suivi dynamiquement du nom de la catégorie, dans votre cas donc “{{tag.categorie.[].fields.nom}}”

Au moment du clic de l’utilisateur, il va falloir extraire la partie droite du “Sélectionner_” pour récupérer la catégorie sélectionnée par l’utilisateur.

WARNING :

Vous allez me dire “Pourquoi diable ne pas mettre directement dans le payload du bouton le nom de la catégorie sans le “Sélectionner_” => parceque les payloads de carrousels créent automatiquement des actions rapides. Si vous commencez à avoir des actions rapides avec des noms simples il va se passer n’importe quoi !!

Reprenons. Dès que j’ai extrait la partie droite et récupéré ma catégorie, je déclenche mon workflow pour récupérer les actus avec la bonne catégorie.

Dans Vizir, vous pouvez extraire la partie droite avec l’action API extract right comme ceci :

4ème étape :

Récupérer les actus correspondantes grâce à un workflow

https://aide.vizir.co/fr/articles/4150122-declencher-un-workflow-depuis-un-outil-tiers

 

5ème étape :

Placer ces actus dans un carrousel dans la ressource “actu”

cf https://aide.vizir.co/fr/articles/3885130-comment-permettre-aux-utilisateurs-de-charger-des-images-dans-le-chatbot

A vous de jouer !

Pour tout savoir sur les chatbots et l'IA, inscrivez-vous à la Newsletter