Custom Card
Introducing the Custom Card node, a feature that allows you to enhance the user experience by adding HTML-CSS styled cards in the chatbot's conversation flow. These interactive cards make the conversation more engaging and visually appealing for the users. Custom cards can be particularly useful for showcasing product details, providing rich media content, or displaying interactive elements within the chat interface.
Note: Custom Card is supported only for bot version 1. For assistance, please contact [email protected].
You can easily add your HTML-CSS code blocks and preview how the card will appear to the end-user. Custom cards are compatible with the Mobile SDK and the web app.
Adding a Custom Card node is simple, just follow the steps below:
Step 1 : Go to Builder, and then click on "+Add Node".
Step 2 : From the Display Information section, select the Custom Card node.
Step 3 : Fill in the fields provided with your HTML and CSS code. Detailed instructions for each field are provided below for your convenience.
- HTML: This field allows you to enter the HTML code for your custom card.
- CSS: This field allows you to enter the CSS code for your custom card.
For your reference:
Step 4 : Once you've entered the code, click on verify and then on accept to preview the output of your HTML and CSS.
Step 5 : Finally, click on "Save" to incorporate the custom card into your chatbot's conversation flow.
With the Custom Card node, you can create visually appealing and interactive elements to enhance your chatbot's capabilities and provide a richer user experience.
If you face any issues or queries please reach out to us at [email protected].