# Video

<figure><img src="https://lh4.googleusercontent.com/Xurl3pLdFXY2zajUCdd4Q3UC6yi6JFyo2bPCfH_GxmwX4Wb3P9yMgL7ksiEdiITJyUMjdPk61ZqdNZs0Z2HJC0BEh7Ikya_2AR9nMzJQOwnXdWf1Bpg8l9Bkz5daNjidZ7BBvOyhnPzxLQgZ7auOHhL7l7oADzNmBxuKe5u5vumNL2eZXIp1IWvGT03m8w" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
The `video` block allows you to embed on your page videos hosted on your server or on third-party sites.
{% endhint %}

## Basics

The `video` block gives you every tool to allow you to embed and style videos from YouTube, Vimeo and your own server. You can modify the source, settings, overlay colours or overlay layout.

{% hint style="info" %}
Div Overlay needs to be toggled on in the Settings tab for  Overlay Colours and Overlay Layout tabs to be visible.
{% endhint %}

![](https://lh6.googleusercontent.com/whsk3iF-KGduvcWn-XZhnhOV9lZJ_jh1hdoiTsiIz_i0fE8VrZml3KV_Hzy1aqCxLWCxn8c2FDvUvqystYzdNw17wHB3uWrP2v4HpaVEe7IOGCrBrAGp5awYnmYH28qrEMmGsALm3pAx52g6DjgpGZ-5VnQ8LZVYJlDhmN1s5ATL29cnF6Awu_WUVTJrkQ)     ![](https://lh6.googleusercontent.com/mkpXIf3GefsYDeYQ-ukB4ojb5mrIyLf02wJk4oH4sL-lFN_KhK0EU7m7qjYWp7CiDf1t1OrqETo5PRcrLcCa2eo4TxXOhOArFAp3NBEP82s2suARbe0GpKZJKugChH-ZPVOUOANmd2ml3dUaJtb-1CkIqOwZHsSO1rjH1FR8TowxKcdrEkxQf4CDLPAvHw)

<details>

<summary>Features</summary>

* Lazy-load the video
* Specific start and end
* Div block overlay with any child block, that activates on the user click
* Aspect ration control

</details>

To add a video block, toggle the block inserter and find the Cwicly video block.

Click to add it to your page.

<figure><img src="https://lh6.googleusercontent.com/9V9oNoLQ2VuSbAtePKZ6xSGE7n_rLN3b1S1WS9CqX5W-Ruj2sfik3WbyOp7K_x-24Vet4txCnzhv1SxXaIMnwHm602LNwH1485eLxo-sGBA0prAX4ev6LDtODzhHrW40qGgSHooxURZsqCF1t-OPLXHFFfbZHYk01-Req2fjx5MrDWsn5Ypy1NXoasfq8Q" alt=""><figcaption></figcaption></figure>

<details>

<summary>Add</summary>

1. Click on the ➕ ​​icon to open the Inserter Panel
2. Search for the <img src="/files/sHJscThWb2nW7KToY5IY" alt="" data-size="line"> `video` block
3. Click on the <img src="/files/sHJscThWb2nW7KToY5IY" alt="" data-size="line"> `video` block to insert it into your page

If you want to add a video inside a parent block:

1. Open the Quick Insert panel in the parent block
2. Search for the <img src="/files/sHJscThWb2nW7KToY5IY" alt="" data-size="line"> `video` block
3. Click on the <img src="/files/sHJscThWb2nW7KToY5IY" alt="" data-size="line"> `video` block to insert it into your parent block

</details>

{% embed url="<https://www.youtube.com/watch?index=14&list=PLvp2KVaJroeRnz3tnH0oYG8NLesimOkSY&v=dfWNUMN2NSs>" %}
Getting Started - Video Block
{% endembed %}

## Video Placeholder

<figure><img src="https://lh6.googleusercontent.com/7EPtqOObUFAL0Pj6NSVPUwSaMXriesANLxyJrT3pXaN5CZxirCLJhwEuscfKC4HhUEEKesYRZT79rvv6u91_qBJCaopChJvoFl2hFvTVrXLpXnL4aB-crq625blDCys-qw8jLFNrne5G0MslpurrsxNUILi2Kxo3F9tUaZspSJSVxXAs1gcBh2kDYdlZ1w" alt=""><figcaption></figcaption></figure>

This will open a Video Placeholder which is already set up for you with a sample video: Primary tab, Source tab, Static, video URL.

To add your own video, simply click on the Search icon or input your own URL.

## Source

The Video Source property allows you choose whether the video source will be static or dynamic.

{% content-ref url="/pages/-MUS\_7yq4PhKYuldyEMz" %}
[Source](/blocks/video/video-source.md)
{% endcontent-ref %}

## Settings

Allows you to specify different properties that affect how your video looks, sounds and starts or finishes.

{% content-ref url="/pages/hIyyg7USNLN3Di4jkTSf" %}
[Settings](/blocks/video/settings.md)
{% endcontent-ref %}

## Overlay Colours

## Div Overlay

The Div Overlay element is a unique feature that allows you to overlay whatever you decide like content over your video.

{% content-ref url="/pages/-MUSaqIzd70WgevTVq4V" %}
[Div Overlay](/blocks/video/div-overlay.md)
{% endcontent-ref %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.cwicly.com/blocks/video.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
