# Video banner

Fully customizable video banner section with options for mobile and desktop devices including support for multiple buttons, heading styles, and text options:

<div data-full-width="true"><figure><img src="https://3528441459-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LovEU3LvzkJzFkXarYD-4120580575%2Fuploads%2FieGrqzwPOiGOWSfwBrvN%2FKapture%202023-07-21%20at%2001.24.45.gif?alt=media&#x26;token=e3abfdab-6261-4f33-a765-65d652159456" alt=""><figcaption></figcaption></figure></div>

Display a banner-style looping MP4 video for desktop and mobile. Customize with optional blocks to display text, headings, buttons, and pop-up YouTube or Vimeo videos.

### How to use

Overview of how to customize and configure the settings in the Video banner section:

{% embed url="<https://www.loom.com/share/62f3a96528b34d65ba99fefc96c76b18?sid=68495632-f143-44a6-a619-d41a6d8387b1>" fullWidth="false" %}

### Blocks

These blocks power the customization options in the Pipeline Video banner section. Add multiple blocks and organize the layout order to build the exact banner video section for your store.

<table data-view="cards"><thead><tr><th></th><th></th></tr></thead><tbody><tr><td><strong>Kicker</strong></td><td>Styled subheading text with size options</td></tr><tr><td><strong>Heading</strong></td><td>Styled heading with size options</td></tr><tr><td><strong>Text</strong></td><td>Standard body text with sizing</td></tr><tr><td><strong>Video popup</strong></td><td>Popup modal with support for YouTube and Vimeo videos</td></tr><tr><td><strong>Buttons</strong></td><td>Custom horizontal buttons with sizes and styles</td></tr><tr><td><strong>Spacer</strong></td><td>Add extra padding and line</td></tr></tbody></table>

### Video banner as an image banner

> *Tip*: The video banner can also be used as a regular image-style banner section

{% embed url="<https://www.loom.com/share/b8a552c0a35c4eeea4d22f2b8de77452?sid=f1ac7e59-29bc-496d-994f-8c123305edb0>" fullWidth="false" %}

> ***Tip:*** To fix the top gap when using a transparent header, adjust the Video banner section settings to `0px` for Padding top:

<figure><img src="https://3528441459-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LovEU3LvzkJzFkXarYD-4120580575%2Fuploads%2FXgn5BrGOvk6DIlvIh8Uj%2Fvideo%20banner%20top%20gap.png?alt=media&#x26;token=f1e7e67c-68ec-40d6-9b2e-7f03a1ccc528" alt=""><figcaption></figcaption></figure>


---

# 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://pipeline.groupthought.com/sections/list-of-sections/video-banner.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.