# Video hero

<figure><img src="https://3026705042-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAJrvmfqcj9TMoPkl3bNc%2Fuploads%2Fs46880GQ2jf9ptZZw3ko%2Fani3.gif?alt=media&#x26;token=81ce686d-e429-4e45-a0c5-c91353772083" 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 section to your Shopify store

{% 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

### 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="https://content.gitbook.com/content/AJrvmfqcj9TMoPkl3bNc/blobs/Xfp4JpXo9rAPzvnUTrLs/image.png" 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.

***

<figure><img src="https://3026705042-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAJrvmfqcj9TMoPkl3bNc%2Fuploads%2FkUIzEsJKOeRiz891zyf5%2Flivechat883x471%20(1).png?alt=media&#x26;token=90cbed2c-e791-49c8-9f43-49a08bed6f1f" alt=""><figcaption><p><a href="https://apps.shopify.com/xflow?utm_source=foxecom&#x26;utm_medium=help_center_hyper&#x26;utm_campaign=banner">Install XFlow Back In Stock Automation FREE</a></p></figcaption></figure>
