> For the complete documentation index, see [llms.txt](https://nextsky-2.gitbook.io/milano-shopify/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://nextsky-2.gitbook.io/milano-shopify/theme-sections/video-with-text-overlay.md).

# Video with text overlay

<figure><img src="https://1163507529-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAGMtjb3mOlhr9pzqKwM0%2Fuploads%2FTsH5x5sRfOXLhnOmokuf%2Fimage.png?alt=media&amp;token=8b7a7a1f-a8f4-41d1-bb03-0568984f34c2" alt=""><figcaption></figcaption></figure>

## General settings

**Section width:** You can choose among Fluid container, Full width, Stretch width for the banner layout.

**Color scheme:** Set text color and background color with preset scheme

<figure><img src="https://1163507529-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAGMtjb3mOlhr9pzqKwM0%2Fuploads%2FpdLk5WpWcaCjpoNMfa3K%2Fimage.png?alt=media&amp;token=be62c082-6dc0-4c41-a2d9-7153945b5e6f" alt=""><figcaption></figcaption></figure>

## Video

**Video selection**: Choose between a video URL or a local video file to display. Note that if both are provided, the local video will take precedence.

<figure><img src="https://1163507529-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAGMtjb3mOlhr9pzqKwM0%2Fuploads%2FZHCbHqREgfxIjULC4CjI%2Fimage.png?alt=media&amp;token=41f600e7-5ed6-4c26-8ef1-41596a6d8482" alt=""><figcaption></figcaption></figure>

**Video poster**:

* **Choose Image**: Select an image to use as the video thumbnail.
* **Opacity**: Set the opacity level for the thumbnail image.
* **Height**: Adjust the height of the thumbnail image.

<figure><img src="https://1163507529-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAGMtjb3mOlhr9pzqKwM0%2Fuploads%2FGDr8TlP1DERT1oPEY71x%2Fimage.png?alt=media&amp;token=30bf941a-53ff-4f9c-b785-c2fe28fdf4d9" alt=""><figcaption></figcaption></figure>

## Custom height <a href="#custom-height" id="custom-height"></a>

**Custom height:** Define a custom height in desktop and mobile if the standard options do not meet your specific requirements, offering further customization.

<figure><img src="https://1163507529-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAGMtjb3mOlhr9pzqKwM0%2Fuploads%2FEO9s75ft2Eb7a7NMT3ZF%2Fimage.png?alt=media&amp;token=2cb45290-2e3f-4d8a-866d-0e1d8986836b" alt=""><figcaption></figcaption></figure>

## Content settings <a href="#content-settings" id="content-settings"></a>

**Content alignment:** Options to align text left, center, or right are available.

**Desktop content position:** Vertically and horizontally align the content for optimal positioning.

**Content width:** Define the width of the content box for a tailored fit.

**Content padding**: Configure the padding for the content box.

<figure><img src="https://1163507529-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAGMtjb3mOlhr9pzqKwM0%2Fuploads%2FTm6tbbq43LzlmWALcptZ%2Fimage.png?alt=media&amp;token=342a0eb2-2820-4de3-ac50-99b7d4be3a63" alt=""><figcaption></figcaption></figure>

## Content box <a href="#content-box" id="content-box"></a>

You can set a background color and adjust the opacity for the it.

<figure><img src="https://1163507529-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAGMtjb3mOlhr9pzqKwM0%2Fuploads%2Ff4rVLi6qNYbTtx2lhk57%2Fimage.png?alt=media&amp;token=f6bca6c4-dcef-4fca-922a-a084d33de605" alt=""><figcaption></figcaption></figure>

## Mobile options and Section padding <a href="#mobile-options-and-section-padding" id="mobile-options-and-section-padding"></a>

**Content Placement**: Choose to display content below the image or maintain the same layout as on desktop.

**Content alignment**: Set the alignment for content on mobile devices.

Section padding allows you to specify the space between the slideshow and the preceding or following sections, or both.

<figure><img src="https://1163507529-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAGMtjb3mOlhr9pzqKwM0%2Fuploads%2FhCCZ66O8isjomtYZ0r1k%2Fimage.png?alt=media&amp;token=5a63828b-e672-4582-b63a-a817743c8b52" alt=""><figcaption></figcaption></figure>

### Block settings <a href="#block-settings" id="block-settings"></a>

With each block added, you will have the option to relocate them and access more detailed settings.

### Heading <a href="#heading" id="heading"></a>

<figure><img src="https://1163507529-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAGMtjb3mOlhr9pzqKwM0%2Fuploads%2F7Oz05AqeFJtp5gMLMFo5%2Fimage.png?alt=media&amp;token=4d1ea37c-b2a1-4591-83c2-875a9c2ff61e" alt=""><figcaption></figcaption></figure>

## Subheading

<figure><img src="https://1163507529-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAGMtjb3mOlhr9pzqKwM0%2Fuploads%2FfEOxqkyl91S4B8N1OeLD%2Fimage.png?alt=media&amp;token=2a56f635-a7c2-4b23-bce8-3f557430087b" alt=""><figcaption></figcaption></figure>

## Description

<figure><img src="https://1163507529-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAGMtjb3mOlhr9pzqKwM0%2Fuploads%2FR9zO3wj1OaqbKiNSjm4B%2Fimage.png?alt=media&amp;token=d93e535e-ffb2-42a4-ae23-3db32dfc1a04" alt=""><figcaption></figcaption></figure>

## Button

<figure><img src="https://1163507529-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAGMtjb3mOlhr9pzqKwM0%2Fuploads%2FtEnif8ohLOaP7YeZFpgx%2Fimage.png?alt=media&amp;token=969b09f5-b157-4c10-9e69-ec680f381c31" alt=""><figcaption></figcaption></figure>

## Spacing

<figure><img src="https://1163507529-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAGMtjb3mOlhr9pzqKwM0%2Fuploads%2FgJHHsVgtF7KvsbzdZQYO%2Fimage.png?alt=media&amp;token=8fe36641-a224-432b-9d65-096c96859027" alt=""><figcaption></figcaption></figure>

## Timer

<figure><img src="https://1163507529-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAGMtjb3mOlhr9pzqKwM0%2Fuploads%2FmbR0GnTTVCQGpfszH3CB%2Fimage.png?alt=media&amp;token=744fff70-8e62-440c-a37d-3c927dcd9fb5" alt=""><figcaption></figcaption></figure>

## Custom HTML

<figure><img src="https://1163507529-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAGMtjb3mOlhr9pzqKwM0%2Fuploads%2F7OBVlexATzlxGc7TnrgZ%2Fimage.png?alt=media&amp;token=85c0fdd9-9441-417d-8a08-61bb7c849d0f" alt=""><figcaption></figcaption></figure>