# Video hero

<figure><img src="/files/MVGsrTlil3qOQSCpan0K" alt=""><figcaption></figcaption></figure>

The **Video hero** section displays a fullwidth auto-playing video (without sound) to add dynamism to your page.

## How to add a Video hero

{% hint style="success" %}
Steps

1. In the theme editor **(Customize)**, click **Add section**
2. Locate **Hero video**
3. Make necessary changes
4. **Save.**
   {% endhint %}

## How to edit a Video hero

### Section settings

#### Video settings

* **Video**: Select a video that you've uploaded to Shopify Files or insert a YouTube or Vimeo video URL.&#x20;
* **Video alt text**: Describe the video for customers using screen readers.
* **Video height:** Set the height of the video.
* **Overlay opacity**: The transparent overlay on the video makes text easier to see. It is best to keep it at 20-60% so that the video does not disappear and the text is not too hard to see.
* **Enable parallax effect**: Scroll the background and foreground layers at different speeds, creating vibrant animated scenes.
* **Parallax direction**: Vertical/ Horizontal/ Zoom.

You can use a video from an external source such as:&#x20;

* Youtube&#x20;
* Vimeo
* Shopify-hosted URL address

#### Content settings

<figure><img src="/files/gHhsykzIvA3fdSnncmX0" alt=""><figcaption></figcaption></figure>

* **Content position**: Position of content in section.
* **Content alignment**: Center/Left/Right.

### Block settings

You are able to add the following to the video hero:

* Heading
* Subheading
* Text
* Button

Re-order the elements within the section if you want.


---

# 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.foxecom.com/sleek-theme/theme-sections/video-hero.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.
