Créer un Chatbot avec flow builder

  • Dernière modifiation Jun 01, 2023
  • 277
0 0

Créer un bot avec Flow builder (Constructeur de Flux)

Note:
Dans ce tutoriel, nous allons voir comment créer un bot pour Facebook Messenger et un bot pour Instagram avec PhenixChat Flow Builder. Veuillez suivre les instructions de ce tutoriel étape par étape pour créer un bot interactif Facebook Messenger ou Instagram.


Pour construire un bot, tout d'abord, allez sur le tableau de bord de PhenixChat. Cliquez ensuite sur l'option Bot Manager dans la barre latérale gauche du tableau de bord.

Bot Manager

La page Bot Manager s'affiche aussitôt. En haut de la page, vous verrez le profil de votre compte Facebook. Si vous avez importé un autre profil Facebook, vous pouvez changer le profil Facebook.

Par défaut, vous serez sur la page de gestion de bot de Facebook. Pour créer un bot pour Instagram, cliquez sur le bouton "Change to Instagram".

Éditeur Visual Flow Builder

Pour créer un bot, cliquez sur le bouton "Create New Flow". L'éditeur du Flow Builder s'ouvrira dans un nouveau onglet de votre navigateur. L'éditeur est divisé en deux parties - Doc-menu et éditeur. Dans le Doc-menu, tous les composants sont rassemblés. Pour construire un bot, vous devez faire glisser les composants du menu Doc et les déposer dans l'éditeur. Ensuite, vous devez configurer les composants et les connecter les uns aux autres. Dans le menu Doc, il y a 17 composants pour les pages Facebook et 12 composants pour les comptes Instagram.

Démarrer le flux du Bot

Dans l'éditeur, vous voyez un élément appelé start bot flow. Ce composant est essentiel à la construction du bot. Double-cliquez sur l'élément Start bot Flow et la barre latérale droite appelée Configure Reference apparaît avec deux champs : Title et Choose Labels. Dans le champ Title, donnez un titre au bot.

Dans le champ Choose label(s), vous devez sélectionner les étiquettes dans un menu déroulant de différents champs. Vous pouvez sélectionner plusieurs étiquettes dans le champ Choose label(s). Cliquez ensuite sur le bouton Done et les informations seront ajoutées à l'élément.

Ajouter une nouvelle étiquette

À partir du champ Choose label(s), vous pouvez ajouter une nouvelle étiquette. Il suffit d'écrire le nom de l'étiquette et d'appuyer sur la touche Entrée.

Mots-clés de déclenchement

Faites maintenant glisser l'élément trigger keywords et déposez-le dans l'éditeur. Maintenant, double-cliquez sur l'élément et une barre latérale appelée configurer le déclencheur apparaîtra. Dans le champ, vous devez fournir des mots-clés séparés par des virgules. Lorsqu'un utilisateur écrit l'un de ces mots-clés, le robot démarre. Vous pouvez également sélectionner un type de correspondance - Correspondance exacte des mots-clés et Correspondance de la chaîne. Cliquez ensuite sur le bouton "Done". Les mots-clés apparaîtront sur le composant.

Reliez maintenant le composant Trigger Keywords au composant Start Bot Flow.

Ajouter des composants sans les faire glisser à partir du menu Dock

Vous pouvez également ajouter des composants sans les faire glisser depuis le menu Doc et les déposer dans l'éditeur. Depuis la sortie suivante de n'importe quel composant, faites glisser le curseur et déposez-le. Et instantanément, un menu des différents composants apparaîtra. Et dans le menu, sélectionnez un composant et le composant apparaîtra sur l'éditeur connecté avec le composant mère.

Si vous faites glisser votre curseur depuis la sortie bouton de n'importe quel composant et que vous le déposez sur l'éditeur, alors le composant bouton apparaîtra sur l'éditeur connecté au composant mère

NB. Le composant Bouton n'est pas présent dans le Doc-menu.

Texte

Si vous voulez construire un robot avec un élément texte, faites glisser le composant Texte et déposez-le sur l'éditeur. Double-cliquez sur le composant et une barre latérale intitulée Configurer le message texte apparaît avec un champ de texte. Dans le champ de texte, vous devez fournir votre message de réponse. Vous pouvez inclure le prénom ou le nom de l'utilisateur dans le message de réponse.

Vous pouvez également activer la saisie à l'écran en activant le bouton radio. Ensuite, vous pouvez sélectionner le délai de réponse en secondes..

Cliquez maintenant sur le bouton Done et l'information apparaîtra sur le composant. Ensuite, connectez le composant texte avec le composant Start bot flow.

Inclure des variables personnalisées dans le message de réponse

Vous pouvez également inclure des variables personnalisées dans le message de réponse. Cliquez sur le bouton "custom" et un menu déroulant de différentes variables apparaîtra. Et dans le menu déroulant, sélectionnez une variable. La variable personnalisée sera remplacée par la valeur réelle avant l'envoi.

Composant image, audio, vidéo et fichier

De même, vous pouvez ajouter des composants Image, Audio, Vidéo et Fichier. Pour ces composants, vous devez télécharger respectivement une image, un fichier audio, une vidéo et un fichier. Vous devez ensuite connecter les composants à d'autres composants.

FB Media (Media Facebook)

Pour ajouter le composant FB Media, faites glisser le composant FB Media depuis le menu Dock et déposez-le dans l'éditeur. Maintenant, double-cliquez sur le composant FB Media et la barre latérale droite appelée Facebook Media URL apparaîtra. Dans le champ Facebook Media URL, collez l'URL de votre page Facebook.

Vous pouvez activer la saisie à l'affichage et sélectionner le temps en secondes pour le délai de réponse. Cliquez maintenant sur le bouton "Done" et l'URL média de la page Facebook apparaîtra sur le composant.

Card (Carte)

Pour ajouter un composant de carte (Card), faites glisser le composant de carte depuis le menu Doc et placez-le dans l'éditeur. Le composant Carte apparaîtra avec un composant bouton. Double-cliquez maintenant sur le composant Carte et une barre latérale droite appelée Configurer le modèle générique apparaîtra. Téléchargez maintenant une image. Après avoir téléchargé une image, collez un lien dans le champ du lien de destination du clic sur l'image. Lorsqu'un utilisateur clique sur l'image, il est redirigé vers l'URL. Rédigez maintenant un titre dans le champ Titre et un sous-titre dans le champ Sous-titre.

Ensuite, vous devez configurer le composant bouton.

Lisez la section suivante pour savoir comment ajouter et configurer le composant bouton.

Button (Bouton)

Pour ajouter le composant Bouton, faites glisser votre curseur depuis la sortie du bouton d'un composant comme le composant Texte ou Carte et déposez-le. Instantanément, le composant Bouton apparaîtra connecté au composant mère.

Et parfois, le composant bouton apparaît automatiquement connecté avec d'autres composants, tels que le composant carte et le composant carrousel.

Maintenant, double-cliquez sur le composant bouton et une barre latérale droite appelée configurer le bouton apparaîtra. Maintenant, écrivez un texte dans le champ de texte du bouton - le texte apparaîtra sur le bouton. Ensuite, vous devez sélectionner un type de bouton dans le champ Type de bouton. Cliquez sur le champ de type de bouton et un menu déroulant de différents types de boutons - New postback, postback, Weburl, Webview [full], Webview [compact], Webview [tall], User birthday, User email, User phone, User location, Call us, Unsubscribe, Re-subscribe, Chat with human et Chat with robot apparaîtra.

Types de boutons

Nouveau postback

Sélectionnez New postback dans le type de bouton et cliquez sur le bouton "done".

Configurer Nouveau postback

Instantanément, un nouveau bouton postback apparaît, connecté au composant Bouton. Maintenant, double-cliquez sur le composant New postback et la barre latérale droite appelée configurer New postback apparaîtra. Donnez un titre au nouveau postback dans le champ titre. Et sélectionnez les étiquettes dans le champ Choose label. Cliquez maintenant sur le bouton Done.

 Postback

Si vous sélectionnez Postback comme type de bouton, un champ appelé Postback ID apparaîtra. Dans ce champ, vous devez sélectionner un ID de postback. Cliquez sur le champ ID postback et un menu déroulant de différents ID postback apparaîtra. Et dans le menu déroulant, sélectionnez un ID de postback. Et cliquez sur le bouton "Done". L'id de postback apparaîtra sur le composant du bouton.

 Web Url, Webview [full], Webview [tall], Webview [compact]:
 
Si vous sélectionnez Web Url, Webview [full], Webview [tall] ou Webview [compact], un autre champ apparaîtra. Et dans ce champ, vous devez coller une URL. Maintenant, collez une URL et cliquez sur le bouton "done". Après cela, l'URL apparaîtra dans le composant Bouton.

Sélectionnez un type de bouton

Dans le champ du type de bouton, vous pouvez sélectionner l'adresse électronique de l'utilisateur, sa date de naissance, son numéro de téléphone ou sa localisation, un bouton de désabonnement, un bouton de réabonnement, une discussion avec un humain ou une discussion avec un robot. Après avoir sélectionné l'un des types de bouton, cliquez sur le bouton "Terminé". Le type de bouton apparaît instantanément sur le bouton.

Call us (Appelez-nous)

Sélectionnez le bouton "Appelez-nous" dans le menu déroulant des différents types de boutons et, immédiatement, un autre champ appelé "Numéro de téléphone" apparaît. Vous devez maintenant indiquer votre numéro de téléphone dans ce champ. Cliquez ensuite sur le bouton "Done".

Pour ajouter un composant Carrousel, faites glisser le composant Carrousel depuis le menu Doc et déposez-le dans l'éditeur. Instantanément, le composant Carrousel apparaîtra avec trois éléments de carrousel connectés au composant Carrousel et trois composants de bouton connectés aux trois composants de carrousel.

Maintenant, double-cliquez sur le composant Carrousel et la barre latérale droite appelée configurer le carrousel apparaîtra. Dans la barre latérale, vous pouvez activer la saisie à l'affichage et sélectionner le délai de réponse en secondes. Cliquez maintenant sur le bouton "Done".

Passons maintenant à l'élément du carrousel. Double-cliquez sur le bouton de l'élément carrousel et la barre latérale droite appelée Configurer l'élément carrousel apparaîtra avec quelques champs.

Téléchargez maintenant une image. Après avoir téléchargé une image, collez un lien dans le champ du lien de destination du clic sur l'image. Lorsqu'un utilisateur clique sur l'image, il est redirigé vers l'URL. Rédigez maintenant un titre dans le champ titre et un sous-titre dans le champ sous-titre. Activez la saisie à l'affichage et sélectionnez le délai en secondes.

De même, vous devez configurer les deux autres éléments du carrousel.

Vous devez maintenant configurer les boutons. Vous savez déjà comment configurer les boutons.

Vous pouvez ajouter d'autres composants aux composants des boutons si vous le souhaitez.

Maintenant, cliquez sur le bouton de sauvegarde ou appuyez sur ctrl + S et votre bot sera enregistré.

Quick Reply (Réponse rapide)

Pour ajouter un composant Réponse rapide, faites glisser le composant Réponse rapide depuis le menu Doc et déposez-le dans l'éditeur. Instantanément, le composant de réponse rapide apparaît dans l'éditeur. Vous pouvez également ajouter un composant de réponse rapide en faisant glisser votre curseur depuis la sortie des réponses rapides d'un composant et en le déposant sur l'éditeur.

Maintenant, double-cliquez sur le composant Réponse rapide et une barre latérale droite appelée configurer la réponse rapide apparaîtra. Maintenant, dans le champ du type de réponse rapide, vous devez sélectionner un type de réponse rapide. Cliquez sur le champ du type de réponse rapide et un menu déroulant des différents types de réponses rapides - Nouveau postback, Postback, Téléphone et Email - apparaîtra.

Nouveau postback comme type de réponse rapide

Sélectionnez Nouveau postback comme type de réponse rapide, et un champ appelé Texte du bouton apparaît instantanément. Vous devez maintenant fournir un texte pour le bouton dans le champ texte du bouton. Cliquez ensuite sur le bouton "Done".

Et instantanément, un nouveau composant postback apparaîtra connecté au composant de réponse rapide.

 

Maintenant, double-cliquez sur le nouvel élément postback et la barre latérale droite appelée configurer le nouveau postback apparaîtra. Donnez un titre au nouveau postback dans le champ title. Et sélectionnez l'étiquette dans le champ Choose label. Cliquez maintenant sur le bouton "Done". 

Après cela, vous devez ajouter un autre composant avec la sortie suivante du composant New postback.

Postback comme réponse rapide

Si vous sélectionnez postback comme type de réponse rapide, deux champs - texte du bouton et id postback - apparaissent. Dans le champ du texte du bouton, vous devez écrire un texte pour le bouton. Et dans le champ postback id, vous devez sélectionner un postback. Cliquez sur le champ postback id et un menu déroulant de différents postback id apparaîtra. Et dans le menu déroulant, sélectionnez un id de postback. Et cliquez sur le bouton "Done". L'identifiant de postback apparaîtra dans le composant de réponse rapide.

Téléphone comme réponse rapide

Il suffit de sélectionner le téléphone comme type de réponse rapide dans le champ du type de réponse rapide et de cliquer sur le bouton "Done". Dans ce cas, la réponse rapide collectera votre numéro de téléphone à partir de votre profil Facebook et l'affichera dans le messager. Lorsqu'un utilisateur clique sur le numéro de téléphone, le système reçoit le numéro de téléphone. Et l'utilisateur recevra un message indiquant que le système a reçu votre numéro de téléphone.

Email comme réponse rapide

Il suffit de sélectionner Email comme type de réponse rapide dans le champ type de réponse rapide et de cliquer sur le bouton "Done". Dans ce cas, la réponse rapide collectera votre adresse e-mail à partir de votre profil Facebook et l'affichera dans le messager. Lorsqu'un utilisateur clique sur le numéro de téléphone, le système reçoit l'adresse électronique. Et l'utilisateur recevra un message indiquant que le système a reçu votre adresse électronique.

Ecommerce

Pour ajouter un composant Ecommerce, faites glisser le composant Ecommerce depuis le menu Doc et déposez-le dans l'éditeur. Instantanément, le composant Ecommerce apparaîtra dans l'éditeur.

Maintenant, double-cliquez sur le composant Ecommerce et une barre latérale droite appelée configurer Ecommerce avec quelques champs apparaîtra. Tout d'abord, vous devez sélectionner un magasin Ecommerce. Cliquez sur le champ "select your Ecommerce store" et un menu déroulant de différents magasins prédéfinis apparaîtra. Pour configurer le composant Ecommerce, vous devez d'abord créer des magasins.

Après avoir sélectionné un magasin, vous devez sélectionner les produits pour le carrousel/réponse générique. Il suffit de cliquer sur le champ pour qu'un menu déroulant de différents produits apparaisse. Sélectionnez maintenant les produits dans le menu déroulant. Bien entendu, vous pouvez sélectionner plusieurs produits. Ensuite, vous devez écrire le texte du bouton "Acheter maintenant". Vous pouvez également activer la saisie à l'écran et sélectionner le délai en secondes. Cliquez ensuite sur le bouton "Done".

Ensuite, vous devez connecter le composant Ecommerce avec les autres composants.

Les produits que vous avez sélectionnés apparaîtront sous forme de carrousel ou de modèle générique dans le messager. Et en cliquant sur le bouton "Acheter maintenant", l'utilisateur pourra acheter le produit.

OTN

Pour ajouter un composant OTN, faites glisser le composant OTN depuis le menu doc et déposez-le dans l'éditeur. Instantanément, le composant OTN apparaîtra dans l'éditeur.

Maintenant, double-cliquez sur le composant OTN et une barre latérale droite appelée configurer OTN avec deux champs apparaîtra.

D'abord, vous devez écrire un titre pour le composant OTN dans le champ titre. Ensuite, vous devez sélectionner un postback OTN prédéfini dans le champ OTN postback id.

Vous pouvez également activer la saisie à l'écran et sélectionner le délai en secondes.

Cliquez ensuite sur le bouton Terminé.

Créer un postback OTN

Si vous n'avez pas de postback RTO prédéfini, vous devez d'abord créer un postback RTO. Pour créer un retour OTN, sélectionnez Nouveau OTN dans le menu déroulant du champ ID du retour OTN. Et cliquez sur le bouton Done.

Cliquez maintenant sur le composant New OTN et une barre latérale droite appelée Configure New OTN apparaîtra avec quelques champs. Donnez un nom de modèle dans les champs de nom de modèle et choisissez des étiquettes dans le champ d'étiquettes. Vous pouvez activer la saisie à l'affichage et sélectionner un délai de réponse en secondes. Cliquez ensuite sur le bouton "Done". L'information apparaîtra dans le nouveau modèle OTN.

Cliquez maintenant sur le composant New postback et une barre latérale droite appelée configure new postback apparaîtra avec quelques champs. Donnez un titre dans le champ title et choisissez des étiquettes dans le champ Choose labels. Cliquez maintenant sur le bouton "Done". Vous devez maintenant connecter un composant avec le nouveau composant postback. Ensuite, cliquez sur le bouton Save et votre robot avec OTN sera enregistré.

Boutons d'action

Pour ajouter le composant Boutons d'action, faites glisser le composant Bouton d'action depuis le menu Dock et déposez-le dans l'éditeur. Instantanément, le composant Boutons d'action apparaît dans l'éditeur

 

Maintenant, double-cliquez sur le composant Bouton d'action, et une barre latérale droite appelée Configurer le bouton d'action avec un champ appelé Bouton d'action apparaîtra. Dans ce champ, vous devez sélectionner un bouton d'action. Cliquez sur le champ du bouton d'action et un menu déroulant de différents boutons d'action (modèle "Get started", modèle "No match", modèle "Un-subscribe", modèle "Re-subscribe", modèle "Email quick reply", modèle "Location quick reply", modèle "Brithday quick reply", modèle "Chat with human" et modèle "Chat with robot") apparaît. Vous devez maintenant sélectionner un modèle de bouton d'action dans le menu déroulant. Cliquez ensuite sur le bouton d'action. Instantanément, le nom du modèle de bouton d'action apparaîtra sur le composant de bouton d'action.

Vous devez maintenant connecter le composant de bouton d'action au composant de flux de démarrage du bot.

Vues:277

Articles Récents

  • Comment Configurer Le Plugin Messenger a...
    96
  • Comment Créer Un Menu Persistant Dans Me...
    171
  • Comment Ajouter Des Produits
    102
  • Créer une Boutique
    102
  • Utilisation De La Boutique E-Commerce
    39

Articles Populaires

  • Importer des pages et groupes Facebook,...
    286
  • Créer un Chatbot avec flow builder
    277
  • Composant Texte
    277
  • Comment intégrer MailChimp à PhenixChat...
    228
  • Domaine Personnalisé
    216
;