- Website FAQ chatbot vs simple site search
- Website chatbot vs Facebook Messenger Bot
- How to create clickable hyperlinks in Dialogflow website chatbot
- How to add buttons to your Dialogflow website chatbot
- How to display images inside your Dialogflow website chatbot
- How to add line breaks inside your Dialogflow website chatbot
- Dialogflow webhook for website chatbots
- Reader Question: Do you know a good bot for websites I can try out?
- DialogFlow Web chatbox: Some UI design ideas
- Rich Website bot using Dialogflow API v2
Check out the interactive case study.
The existing web demo integration of Dialogflow cannot display rich controls like buttons. However, you often want your user to provide specific answers (e.g. Yes/No) while they are interacting with your chatbot. In this post, I will briefly explain how you can add buttons to your Dialogflow website chabot.
You need to understand the system explained here.
To implement buttons, you should use the Suggestion Chips message type within the Google Assistant tab in your Dialogflow console.
When you call the REST API, you will receive the following JSON corresponding to these suggestion chips:
You can then parse this JSON and render it in your UI as buttons.
When the user clicks on one of the buttons, you will simply take the text on the button and submit it to the /query endpoint to proceed with the conversation.