You can make the most of your video content and create dynamic conversation by inserting videos directly into the chat and, as the videos are not hosted natively this won’t negatively impact any page load speeds.
We support embedded videos from YouTube, Vimeo and Wistia. If you need to embed videos from any other source, contact your Customer Success Manager for support.
Embedding a video into a ChatBot or Inpagebot
From YouTube
1. Click the share button below the YouTube video you want to use
2. Select the embed option, copy this code and paste it into the Question area of a BotSays, SingleChoice or MultipleChoice node.
3. Highlight your text and convert it to a code block by clicking the icon in the top-right corner of the box. You’ll notice that the text will now be in a grey box with an HTML tag in the corner.
4. Change the width to 100% and the height to auto. This will ensure your video resizes dynamically.
From Vimeo
1. Either click “Copy embed code” from the pop-up menu under the 3 dots in your library or, click the embed button at the top of the page.
2. Follow steps 2-4 from the YouTube instructions.
From Wistia
Embedding videos from Wistia is a little trickier than YouTube and Vimeo as you can’t use the embed code produced from the platform but an iframe code as mentioned in their article here – https://support.wistia.com/en/articles/8233354-embedding-and-sharing-media.
1. Find the code for your video from the link URL which will look something like this: https://wistia.com?wvideo=pj1mryf8bi or https://acmeinc.wistia.com/medias/pj1mryf8bi
2. Use this code and replace the highlighted video ID with yours:
<iframe src="https://acmeinc.wistia.com/medias/pj1mryf8bi?seo=true&videoFoam=false" allow="autoplay; fullscreen" allowtransparency="true" frameborder="0" scrolling="no" class="wistia_embed" name="wistia_embed" msallowfullscreen="" width="100%" height="auto"></iframe>
3. Follow steps 2-4 from the YouTube instructions.
Embedding a video in a VisualBot
Embedding a video in a visualbot is much the same as adding them to an InpageBot or ChatBot but to ensure the video always scales correctly you need to add some extra information to the code you are using.
1. Copy the URL or video ID of your video from YouTube, Vimeo or Wistia as above so that would be:
– YouTube: https://www.youtube.com/embed/e9lxFPrccfY?si=qW4IYfZPwp4UrQQX
– Vimeo: https://player.vimeo.com/video/812054001?badge=0&autopause=0&player_id=0&app_id=58479
– Wistia: https://acmeinc.wistia.com/medias/pj1mryf8bi?seo=true&videoFoam=false
2. Replace the Video URL in the code below and follow steps 2-4 from the YouTube instructions.
<div class="embed-container" style=" position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; width: 800px;"><iframe src="https://www.youtube.com/embed/e9lxFPrccfY?si=qW4IYfZPwp4UrQQX" frameborder="0" allowfullscreen="" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; "></iframe></div>
If you need help please reach out to your Customer Success Manager.