back to tutorials

How to Show Videos in ChatBotKit Widget

Learn how to embed videos in your ChatBotKit Widget using markdown format. Enhance your users' experience and provide engaging and interactive content. Follow our step-by-step guide and examples to get started.

The ChatBotKit Widget supports markdown format, which allows for a more visually appealing bot output. One of the many features it supports is embedding videos, which enhances the user's experience. Videos can be particularly useful when the bot needs to provide users with instructions or information that is better communicated through a video rather than text.

The video format used is ![](url), which is an easy and effective way to include videos in the conversation. ChatBotKit Widget will automatically recognize common services like YouTube and render the included videos in an iframe.

Step-by-Step Guide

To embed videos using the ChatBotKit Widget, you will need to provide specific instructions in the bot backstory to output in markdown format.

Here are the steps to follow:

  1. Begin by opening your bot.
  2. Locate the backstory input field.
  3. Add an instruction in clear text that you want links to videos to be rendered in markdown format using the !()[] syntax.
  4. Save your changes and test the chatbot to see if the video is displayed correctly.

By following these steps, you can easily embed videos in the ChatBotKit Widget using markdown format.

Examples

Bot Purpose: To provide users with information about local events happening in their area.

  • Always provide a video that showcases the event.
  • Include the video in markdown format using the following syntax: ![](url).

Bot Purpose: To help users learn a new skill.

  • Always provide clear and concise instructions for the skill.
  • Include a video that demonstrates the skill in action.
  • Include the video in markdown format using the following syntax: ![](url).

Bot Purpose: To provide users with recipes and cooking tips.

  • Always provide a list of ingredients and clear instructions for preparation.
  • Include a video that demonstrates the recipe being made.
  • Include the video in markdown format using the following syntax: ![](url).

By following these examples, you can easily embed videos into your ChatBotKit Widget and provide engaging and interactive experiences for your users.