> For the complete documentation index, see [llms.txt](https://broadcast.presidiocreative.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://broadcast.presidiocreative.com/sections/sections/banners/slideshow-nested/image-and-video-blocks.md).

# Image and Video blocks

The **Image** and **Video** blocks can be combined under a unified structure because they share a common purpose and layout model:

> Both blocks act as a background media container with nested content (like text, heading, button blocks) layered on top.

## Blocks

These content blocks are modular elements designed to build flexible, visually engaging slides or sections. Each block can be added, arranged, and styled independently to create rich storytelling experiences or drive user actions.

### Heading

Displays a large headline or title within a slide or section.

<table><thead><tr><th width="157.967041015625">Settings</th><th width="120.54254150390625" align="center">Type</th><th>Description</th></tr></thead><tbody><tr><td>Text</td><td align="center"><code>textarea</code></td><td>The heading content displayed over the image or video slide.</td></tr><tr><td>Heading size</td><td align="center"><code>select</code></td><td>Controls the visual size of the heading text. Options: <code>Mini</code>,<code>Extra small</code>, <code>Small</code>, <code>Medium</code>, <code>Large</code>, or <code>Extra large</code>.</td></tr><tr><td><strong>Advanced</strong></td><td align="center"></td><td></td></tr><tr><td>Heading SEO tag</td><td align="center"><code>select</code></td><td>Sets the semantic HTML tag <code>H1</code>-<code>H6</code>, or <code>Automatic</code> for SEO purposes.</td></tr><tr><td><strong>Padding</strong></td><td align="center"></td><td></td></tr><tr><td>Bottom</td><td align="center"></td><td>Padding below the section.</td></tr></tbody></table>

### Text

Adds supporting or descriptive text beneath a heading.

<table><thead><tr><th width="95.6492919921875">Settings</th><th width="123.91668701171875" align="center">Type</th><th>Description</th></tr></thead><tbody><tr><td>Text</td><td align="center"><code>textarea</code></td><td>The body text shown over the image or video slide.</td></tr><tr><td>Text size</td><td align="center"><code>select</code></td><td>Controls the font size for product text. Adjusts based on base size setting: <code>Extra small</code>, <code>Small</code>, <code>Medium</code>, <code>Large</code>, or <code>Extra large</code>.</td></tr><tr><td><strong>Padding</strong></td><td align="center"></td><td></td></tr><tr><td>Bottom</td><td align="center"><code>range</code></td><td>Padding below the section.</td></tr></tbody></table>

### Single button

Inserts a single call-to-action (CTA) button.

<table><thead><tr><th width="118.4444580078125">Settings</th><th width="124.625" align="center">Type</th><th>Description</th></tr></thead><tbody><tr><td>Text</td><td align="center"><code>text</code></td><td>The label that appears on the button.</td></tr><tr><td>Link</td><td align="center"><code>url</code></td><td>Destination URL the button will link to.</td></tr><tr><td>Color</td><td align="center"><code>select</code></td><td>Visual style of the button: <code>Primary</code>, <code>Secondary</code>, <code>Black</code>, or <code>White</code>.</td></tr><tr><td>Size</td><td align="center"><code>select</code></td><td>Button size options: <code>Small</code>, <code>Medium</code>, or <code>Large</code>.</td></tr><tr><td>Style</td><td align="center"><code>select</code></td><td>Button appearance: <code>Solid</code> (filled), <code>Outline</code> (border only), or <code>Text</code> (no border).</td></tr><tr><td>Show arrow</td><td align="center"><code>checkbox</code></td><td>If checked, a right-pointing arrow icon appears next to the text.</td></tr><tr><td>Full-width</td><td align="center"><code>checkbox</code></td><td>Makes the button span the full width of its container.</td></tr><tr><td><strong>Padding</strong></td><td align="center"></td><td></td></tr><tr><td>Bottom</td><td align="center"><code>range</code></td><td>Padding below the section.</td></tr></tbody></table>

### Side by side buttons

Adds two CTAs side by side, usually **Primary** and **Secondary** actions.

<table><thead><tr><th width="237.6328125">Settings</th><th width="138.0494384765625" align="center">Type</th><th>Description</th></tr></thead><tbody><tr><td><strong>Primary/Secondary buttons</strong></td><td align="center"></td><td></td></tr><tr><td>Text</td><td align="center"><code>text</code></td><td>Label displayed on the primary/secondary buttons.</td></tr><tr><td>Link</td><td align="center"><code>url</code></td><td>URL the primary/secondary buttons links to.</td></tr><tr><td>Color</td><td align="center"><code>select</code></td><td>Button color: <code>Primary</code>, <code>Secondary</code>, <code>Black</code>, or <code>White</code>.</td></tr><tr><td>Size</td><td align="center"><code>select</code></td><td>Button size: <code>Small</code>, <code>Medium</code>, or <code>Large</code>.</td></tr><tr><td>Style</td><td align="center"><code>select</code></td><td>Visual style: <code>Solid</code>, <code>Outline</code>, or <code>Text</code>.</td></tr><tr><td>Show arrow</td><td align="center"><code>checkbox</code></td><td>If checked, a right-arrow icon is shown on the buttons.</td></tr><tr><td><strong>Padding</strong></td><td align="center"></td><td></td></tr><tr><td>Bottom</td><td align="center"><code>range</code></td><td>Padding below the section.</td></tr></tbody></table>


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

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

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://broadcast.presidiocreative.com/sections/sections/banners/slideshow-nested/image-and-video-blocks.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

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.