> For the complete documentation index, see [llms.txt](https://docs.satisfilabs.com/resource-center/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.satisfilabs.com/resource-center/ai-agent-engine/manage-your-content/enrichments/videos.md).

# Videos

## Embed a Video

{% embed url="<https://files.gitbook.com/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsxN9AGLZMIc5C8dx3zU7%2Fuploads%2FIdV5AvRmKrBU54FCgp4v%2Fembed%20video.mp4?alt=media&token=66f2fae5-c221-4f7e-8866-6dea28b416b7>" fullWidth="true" %}

1. In the Satisfi Labs dashboard, go to **Studio -> NLP Manager -> Responses**
2. Click the response you wish to update and select the pencil icon
3. Switch to **Code View**
4. Add the following line and hit enter:

```
#HTML
```

5. Copy and paste your desired video's embed code into your response. For example:

{% code overflow="wrap" %}

```
<iframe width="315" height="200" src="https://www.youtube.com/embed/XBPQE84h1mI" title="Learn more about Bridge Live Chat" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
```

{% endcode %}

To find your video's embed code, use the instructions in the table below:

{% tabs %}
{% tab title="YouTube" %}

<div data-full-width="true"><figure><img src="/files/aJpC8aK07Bf8zQ7so8hm" alt=""><figcaption></figcaption></figure></div>

1. Find your desired video
2. Right-click the video and select Copy Embed Code
   {% endtab %}

{% tab title="Vimeo" %}

<figure><img src="/files/sh2BMNMGX2vKMnrdXa1l" alt=""><figcaption></figcaption></figure>

1. Find your desired video
2. Click on **Share**
3. Copy the embed code
   {% endtab %}

{% tab title="Other Sources" %}
For video files hosted on other sites, you can use the code below to host your video within a response. You will need to swap out the URL and title placeholders. Note that certain video permissions and policy guidelines may restrict you from iframing a video.

{% code overflow="wrap" %}

```
<iframe width="315" height="200" src="YOUR VIDEO URL" title="VIDEO TITLE" frameborder="0" allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
```

{% endcode %}
{% endtab %}
{% endtabs %}

{% hint style="warning" %}
Note that you cannot host videos on your dashboard. Only image and GIF files are supported within the image library.
{% endhint %}

6. Adjust the embed code as needed and add response text:

{% tabs %}
{% tab title="Adjust Size" %}
There is no set video width and height we recommend, as chat containers vary in size. We recommend adjusting the width to 315 and the height to 200 to start; however, test the video response in your chat and make further adjustments as needed. &#x20;
{% endtab %}

{% tab title="Autoplay" %}
We recommend removing autoplay from the embed code; however, you can choose to keep it if you'd like.
{% endtab %}

{% tab title="Response Text" %}
Don't forget to add text to your response! After your embed code, write your response as shown in the example below:

{% code overflow="wrap" %}

```
<iframe width="315" height="200" src="YOUR VIDEO URL" title="VIDEO TITLE" frameborder="0" allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe> ADD YOUR RESPONSE TEXT HERE. THIS WILL APPEAR IN ADDITION WITH THE VIDEO!
```

{% endcode %}
{% endtab %}
{% endtabs %}

7. Publish your response and test it in your chat. You may need to resize the iframe to ensure the video is not cut off.&#x20;

## **Best Practices**

### **Keep Users Engaged**

{% tabs %}
{% tab title="Why it Helps" %}
Including videos can make the chatbot interface more appealing and retain user attention compared to text. A visually captivating chatbot can enhance the overall user experience, making interactions more pleasant and memorable.
{% endtab %}

{% tab title="Examples" %}
&#x20; ![](/files/j1VVt2gts1bGM1OJOYXw)  ![](/files/FjMfnkHJxyiEPevzC0on)
{% endtab %}
{% endtabs %}

### **Connect Emotionally**&#x20;

{% tabs %}
{% tab title="Why it Helps" %}
Videos have the power to evoke emotions. By choosing the right visuals, your chatbot can connect on a more personal level with users.
{% endtab %}

{% tab title="Example" %}

<figure><img src="/files/Hx57HLwx8vHxw1kpdIZK" alt="" width="375"><figcaption><p>A Sizzle Reel or Promotional Video Can Invoke Strong Fan Emotions and Promote Sales</p></figcaption></figure>
{% endtab %}
{% endtabs %}

### **Assist Visual Learners**

{% tabs %}
{% tab title="Why it Helps" %}
Videos can play a functional role by guiding users through complex instructions, such as downloading an app or accessing their event tickets.&#x20;
{% endtab %}

{% tab title="Example" %}

<figure><img src="/files/zzdLWiAdHIg48OPWAQBe" alt="" width="323"><figcaption><p>Video Walkthrough of How to Download the App</p></figcaption></figure>
{% endtab %}
{% endtabs %}
