> For the complete documentation index, see [llms.txt](https://halosoft.gitbook.io/concept-documentation/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://halosoft.gitbook.io/concept-documentation/section/carousel-images/block-slide.md).

# \[Block] Slide

1. Select the **Carousel images** option from the theme editor.
2. Click on **Add block**. Select **Slide** from **Theme Block** dropdown.

#### Cover image

<table><thead><tr><th width="263">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Image</td><td>Set up an image for slide</td></tr><tr><td>Mobile image</td><td>Set up an image for slide on mobile</td></tr></tbody></table>

#### Shopify-hosted video

<table><thead><tr><th width="266">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Video</td><td><p>Allows uploading a <strong>video</strong></p><p><em><mark style="color:red;">(Video plays in the page)</mark></em></p></td></tr></tbody></table>

#### Or embed video from URL

<table><thead><tr><th width="268">Setting</th><th>Description</th></tr></thead><tbody><tr><td>URL</td><td><p>Embed a video from URL</p><p><em><mark style="color:red;">(Video plays in the page)</mark></em></p></td></tr></tbody></table>

#### **Content**

*<mark style="color:red;">Negative top margin allows you to push content area to overlap on image banner</mark>*

<table><thead><tr><th width="243">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Negative top margin (desktop)</td><td>Determine the distance that permits overlapping content areas on image banners on desktop.</td></tr><tr><td>Negative top margin (tablet)</td><td>Determine the distance that permits overlapping content areas on image banners on tablet.</td></tr><tr><td>Negative top margin (mobile)</td><td>Determine the distance that permits overlapping content areas on image banners on mobile.</td></tr><tr><td>Background image</td><td>Set up an background image for the content</td></tr><tr><td>Subheading</td><td><p>Add text to display as a block <strong>subheading</strong></p><p><em><mark style="color:red;">(Leave the field blank to hide the</mark><mark style="color:red;"> </mark><mark style="color:red;"><strong>subheading</strong></mark><mark style="color:red;">)</mark></em></p></td></tr><tr><td>Font weight subheading</td><td>Select the Font Style from <strong>Font Heading</strong> or <strong>Font body</strong>. These two font families are specified in the <strong>Theme settings</strong> > <strong>Typography</strong></td></tr><tr><td>Subheading size</td><td><p>Font size of text:</p><ul><li><strong>XX-Small</strong></li><li><strong>X-Small</strong></li><li><strong>Small</strong></li><li><strong>Medium</strong></li><li><strong>Large</strong></li><li><strong>X-Large</strong></li><li><strong>XX-Large</strong></li><li><strong>XXX-Large</strong></li></ul></td></tr><tr><td>Heading</td><td>Add text to display as a block <strong>heading</strong><br><em><mark style="color:red;">(Leave the field blank to hide the</mark><mark style="color:red;"> </mark><mark style="color:red;"><strong>heading</strong></mark><mark style="color:red;">)</mark></em></td></tr><tr><td>Heading size</td><td><p>Font size of text:</p><ul><li><strong>Default</strong></li><li><strong>XX-Small</strong></li><li><strong>X-Small</strong></li><li><strong>Small</strong></li><li><strong>Medium</strong></li><li><strong>Large</strong></li><li><strong>X-Large</strong></li><li><strong>XX-Large</strong></li><li><strong>XXX-Large</strong></li></ul></td></tr><tr><td>Description</td><td>Add text to display as a <strong>custom content</strong> to describe this block <br><em><mark style="color:red;">(Leave the field blank to hide the</mark><mark style="color:red;"> </mark><mark style="color:red;"><strong>description text</strong></mark><mark style="color:red;">)</mark></em></td></tr><tr><td>Text size</td><td><p>Font size of text:</p><ul><li><strong>XX-Small</strong></li><li><strong>X-Small</strong></li><li><strong>Small</strong></li><li><strong>Medium</strong></li><li><strong>Large</strong></li><li><strong>X-Large</strong></li><li><strong>XX-Large</strong></li><li><strong>XXX-Large</strong></li></ul></td></tr><tr><td>Choose button style</td><td><p>Select the button style for the section:</p><ul><li><strong>Default</strong></li><li><strong>Transparent</strong></li></ul></td></tr><tr><td>Button label</td><td>Add text to display as a button on the block <br><em><mark style="color:red;">(Leave the field blank to hide the</mark><mark style="color:red;"> </mark><mark style="color:red;"><strong>link</strong></mark><mark style="color:red;">)</mark></em></td></tr><tr><td>Button link</td><td>Set the link of the button, for example the customer service page</td></tr><tr><td>Content alignment</td><td><p>Select content alignment from the dropdown menu:</p><ul><li><strong>Left</strong></li><li><strong>Center</strong></li><li><strong>Right</strong></li></ul></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 dynamically by asking a question.

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

```
GET https://halosoft.gitbook.io/concept-documentation/section/carousel-images/block-slide.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.
