> ## Documentation Index
> Fetch the complete documentation index at: https://docs.bosscart.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Single Video

> Displaying Videos on Your Website

### **Displaying Videos on Your Website**

You have **two options** when adding videos to your site, depending on how you want them hosted and displayed:

**1. Hosted Video**

* Fully **native and built-in** to your platform.
* Gives you **full control** over playback, settings, captions, and chapters.
* Best for **branded content** or exclusive videos that you want to keep internal.

**2. Video Link**

* Use external sources like **YouTube, Vimeo, Loom, and more**.
* No need to upload—simply paste the link and configure display settings.
* Ideal for **public-facing videos** that are hosted elsewhere.

If you **haven’t uploaded a video yet**, check out the relevant guide for **step-by-step instructions**.

[Video Manager](/builder/video/getting-started/video-manager)

### Video Link

If you want to add a video from an external source like **YouTube, Vimeo, Loom, or others**, follow these steps:

1. **Navigate to the left-side taskbar.**
2. **Select the "Widget" tab.**
3. **Choose the "Video" widget.**

This method allows you to **quickly integrate external videos**, keeping your content **dynamic and flexible**.

<img src="https://mintcdn.com/alavon365/m47yzIyDG9neC9jn/images/builder/ad6b2a57a7d2751f.png?fit=max&auto=format&n=m47yzIyDG9neC9jn&q=85&s=9e896f6a7f1b61782b6a38ac5c0d134d" alt="" width="1425" height="799" data-path="images/builder/ad6b2a57a7d2751f.png" /><p>Video Widget</p>

### **Editing Your Video Widget**

Once you’ve placed the **video widget**, a **sidebar window** will appear, giving you the option to:

* **Upload a video** – Select from your hosted videos for full native integration.
* **Use the link option** – Quickly embed external videos from sources like YouTube, Vimeo, or Loom.

Let’s proceed by **choosing the link option**, allowing you to **add videos via URL**

<img src="https://mintcdn.com/alavon365/QV57KeevJvB6qbiC/images/builder/68c1bf58c34aa2ed.png?fit=max&auto=format&n=QV57KeevJvB6qbiC&q=85&s=20cdb6cb8e75eb69fe0ba76b759a9ada" alt="" width="1298" height="788" data-path="images/builder/68c1bf58c34aa2ed.png" />

Once you’ve added your **video URL**, you can refine how it appears using the following options:

* **Custom Thumbnail** – Instead of using the default thumbnail from platforms like YouTube, you can **upload your own** from the **File Manager** to better match your branding.
* **Custom Video Player** – Applies your **branding colors** to the video and modifies the **toolbar** for a more **native** and cohesive look within your platform.
* **Shadow Effect** – If desired, you can **add a shadow** around your video to enhance its **visual depth** and complement your design style.

These options give you greater **control over presentation**, making embedded videos feel **seamlessly integrated** with your site.

<Warning>
  **Note**: If using the **Custom Video Player** Option, Shadows cannot be applied.
</Warning>

<img src="https://mintcdn.com/alavon365/QV57KeevJvB6qbiC/images/builder/87349cadb620bc8c.png?fit=max&auto=format&n=QV57KeevJvB6qbiC&q=85&s=22bc4a2153e9ca2652d192a398b1c650" alt="" width="1413" height="811" data-path="images/builder/87349cadb620bc8c.png" />

<Tabs>
  <Tab title="Without Custom Player">
    <img src="https://mintcdn.com/alavon365/zazDpBR889DAW7oG/images/builder/287adb90a351d983.png?fit=max&auto=format&n=zazDpBR889DAW7oG&q=85&s=4a76830f5aad65d7319a7c6ef7eed3e6" alt="" width="1196" height="671" data-path="images/builder/287adb90a351d983.png" />
  </Tab>

  <Tab title="With Custom Player">
    <img src="https://mintcdn.com/alavon365/zazDpBR889DAW7oG/images/builder/1e8543a309429126.png?fit=max&auto=format&n=zazDpBR889DAW7oG&q=85&s=ae72d14ed80cee3b6aa1f49201a05fc5" alt="" width="1195" height="673" data-path="images/builder/1e8543a309429126.png" />
  </Tab>
</Tabs>

### Hosted Video

Using **built-in hosted videos** gives you far greater flexibility over **display settings, playback behavior, and engagement features**.

**Key Advantages:**

* **Customizable Display** – Adjust how videos appear, including **thumbnails, player design, and shadows**.
* **Playback Control** – Define **autoplay preferences, looping, and visibility options**.
* **Engagement Features** – Enable **comment sections**, allowing users to interact, discuss, and provide feedback directly within the platform.

This ensures a **seamless, fully integrated experience**, making hosted videos feel **native** to your site while offering a deeper level of customization.

* **Navigate to the left-side taskbar.**
* **Select the "Widget" tab.**
* **Choose the "Video" widget.**

<img src="https://mintcdn.com/alavon365/QV57KeevJvB6qbiC/images/builder/68c1bf58c34aa2ed.png?fit=max&auto=format&n=QV57KeevJvB6qbiC&q=85&s=20cdb6cb8e75eb69fe0ba76b759a9ada" alt="" width="1298" height="788" data-path="images/builder/68c1bf58c34aa2ed.png" />

At this step, you can either:

* **Select a hosted video** if you’ve already uploaded content.
* **Upload a new video** directly from this menu.

If you’re new to video hosting or want to explore all **available features**, check out the guide below for a deeper dive into **uploading, customizing, and optimizing** your videos.

[Video Manager](/builder/video/getting-started/video-manager)

**Customizing Your Video Display** Once you've uploaded your video, you can fine-tune how it appears with several built-in options. Adjust playback controls, visibility settings, and engagement features to match your needs.

For a full breakdown of each setting, including autoplay,, captions, and reactions, check out the detailed guide:

[Video Manager](/builder/video/getting-started/video-manager)

<img src="https://mintcdn.com/alavon365/jdtI0XQKlmiI8Ux4/images/builder/095501743cc45d63.gif?s=c4fc16e751739ac62b5beae678cd1db2" alt="" width="800" height="450" data-path="images/builder/095501743cc45d63.gif" />

Here's how your video can look with multiple interactive features enabled:

* **Comments** – Viewers can engage and discuss directly on the video page.
* **Reactions** – Users can express feedback with quick emoji responses.
* **Views Counter** – Displays the total number of times the video has been watched.
* **Autoplay** – The video starts playing automatically when loaded.

These options help create a **more dynamic, engaging experience**, encouraging user interaction while keeping content seamlessly accessible.
