Configuring the dialog nodes to display dynamic rich media

Before you begin

Make sure you have created an intent to display images and play audio and video files in the chatbot response. For more information, see Creating intents in IBM documentation.

To display images from a public URL in the chatbot response

1. Log in to your IBM Cloud account. 
2. Launch Skill that is configured with BMC Helix Virtual Agent.
3. Select the Skill in which you want to edit the Dialog node.
4. Click Dialog. 
5. Select the dialog that you want to configure to display images from a public URL. 
6. Click Add node at the appropriate step in the dialog flow and fill out the following fields: 
   1. In Enter node name, specify a meaningful name for the node.
      Example: Show image
   2. In If assistant recognizes, select #intents and select the intent name.
      Example: #ShowImage
      
   3. In the Assistant responds section, select Text and click Add response type.
   4. In Enter response text, enter the complete public URL from where you want to render the image in the following format: 
      <img src="https://domainname/image path">
7. Click Try it out to check whether the image is rendering correctly. 

The following example shows how to configure a dialog to render an image in the chatbot response: 

To play an audio from a public URL in the chatbot response

1. Log in to your IBM Cloud account. 
2. Launch Skill that is configured with BMC Helix Virtual Agent.
3. Select the Skill in which you want to edit the Dialog node.
4. Click Dialog. 
5. Select the dialog that you want to configure to play audio from a public URL. 
6. Click Add node at the appropriate step in the dialog flow and fill out the following fields: 
   1. In Enter node name, specify a meaningful name for the node.
      Example: Play audio
   2. In If assistant recognizes, select #intents and select the intent name.
      Example: #PlayAudio
      
   3. In the Assistant responds section, select Text and click Add response type.
   4. In Enter response text, enter the complete public URL from where you want to play the audio in the following format: 
      <audio src="https://domainname/audio" controls>Your browser does not support the audio element.</audio>
7. Click Try it out to check whether the audio is playing correctly. 

The following example shows how to configure a dialog to play audio in the chatbot response: 

To play a video file from a public URL in the chatbot response

1. Log in to your IBM Cloud account. 
2. Launch Skill that is configured with BMC Helix Virtual Agent.
3. Select the Skill in which you want to edit the Dialog node.
4. Click Dialog. 
5. Select the dialog that you want to configure to play video from a public URL. 
6. Click Add node at the appropriate step in the dialog flow and fill out the following fields: 
   1. In Enter node name, specify a meaningful name for the node.
      Example: Play video
   2. In If assistant recognizes, select #intents and select the intent name.
      Example: #PlayVideo
      
   3. In the Assistant responds section, select Text and click Add response type.
   4. In Enter response text, enter the complete public URL from where you want to play the video in the following format: 
      <video contols> <source src="https://domainname/video" type="video/mp4"</video>
      Tip: You can control the size of the media player by specifying the width and height in the response text. 
7. Click Try it out to check whether the audio is playing correctly. 

The following example shows how to configure a dialog to play a video in the chatbot response: