# Video hero

The Video hero section shows a video that plays on its own, without sound, with a heading, text, and buttons on top. Use it to make a strong first impression and guide customers to your products or campaigns.
To add a YouTube or Vimeo video with sound, use the [Video](https://docs.foxecom.com/minimog-theme/theme-sections/video) section instead.
## How to add Video hero
1. Open the theme editor (**Edit theme**).
2. Click **Add section** under **Template** in the sidebar.
3. Select **Video hero**.
4. Choose **Shopify hosted** or **External** in **Video type**.
5. Add your video: click **Select** next to **Shopify hosted**, or paste a YouTube or Vimeo link in **External video url**.
6. Enter your heading in **Heading**.
7. Click **Save**.
If **Video hero** is already on the page, click it to edit it instead.
## Section settings
**Animations** works the same as in every section. See [Common section settings](https://docs.foxecom.com/minimog-theme/theme-sections/common-section-settings). In this section, **Custom classes** is under **Advanced settings** and works the same as in **Custom Attributes**.
### General
**Color scheme** and **Container type** work the same as in every section. The other settings set the height of the section and how the video looks.
| Setting | Description | Options |
| ------------------ | -------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------- |
| **Section height** | The height of the section. | **Adapt to video ratio**, **Small**, **Medium**, or **Large**. |
| **Video ratio** | The shape of the video. | **1:1**, **4:3**, **16:9**, or **21:9**.
*Works when **Section height** is **Adapt to video ratio**.* |
| **Show overlay** | Adds a dark layer over the video so the text stands out. | **On** or **Off**. |
### Video settings
| Setting | Description | Options |
| ---------------------- | ---------------------------------------- | --------------------------------------------------------------------------------------------------------------- |
| **Video type** | Where your video comes from. | **Shopify hosted**: an `.mp4` video from your Shopify files.
**External**: a YouTube or Vimeo video. |
| **Shopify hosted** | The video from your Shopify files. | Click **Select** to choose a video.
*Works when **Video type** is **Shopify hosted**.* |
| **External video url** | The link to your YouTube or Vimeo video. | Paste a YouTube or Vimeo link.
*Works when **Video type** is **External**.* |
### Content
Leave **Subheading**, **Heading**, and **Text** blank to show the video on its own.
| Setting | Description | Options |
| ---------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Content in container box** | Keeps the text and buttons within the **Container width** set in **Theme settings** > [Layout settings](https://docs.foxecom.com/minimog-theme/theme-settings/layout-settings). | **On** or **Off**. |
| **Content position** | Where the text and buttons sit on the video on desktop. | **Top left**, **Top center**, **Top right**, **Middle left**, **Middle center**, **Middle right**, **Bottom left**, **Bottom center**, or **Bottom right**. |
| **Content alignment** | How the text and buttons line up. | **Left**, **Center**, or **Right**. |
| **Text color** | The color of the text. Pick one that stands out from the video. | **Dark**, **Light**, or **Inherit**.
*Works when the content shows on top of the video.* |
| **Subheading** | A short line above the heading. | Enter text. |
| **Heading** | The main message on the video. | Enter text, such as `Seasonal Collection`. |
| **Heading size** | The size of the heading. | **Heading xs**, **Heading sm**, **Heading md**, **Heading lg**, **Heading xl**, or **Heading 2xl**. |
| **Text** | Text below the heading. You can make it bold or italic, add links, and add lists. | Enter text. |
| **Text size** | The size of the text. | **Small**, **Base size**, **Large**, **Extra large**, or **Default**. |
Keep your message short, and turn on **Show overlay** if the text is hard to read over the video.
### Button 1 and Button 2
The section can show two buttons. Both have the same settings.
| Setting | Description | Options |
| ---------------- | ---------------------------------------------------- | ------------------------------------------------------------------------------------ |
| **Button label** | The text on the button. | Enter text, such as `Shop now`.
*Leave blank to hide the button.* |
| **Button link** | The page customers go to when they click the button. | Paste a link or search for a page. |
| **Button style** | How the button looks. | **Primary button**, **Secondary button**, **White button**, or **Underline button**. |
| **Button size** | The size of the button. | **Button small**, **Button medium**, or **Button large**. |
### Mobile settings
| Setting | Description | Options |
| --------------------------- | ---------------------------------------------------------------------------------------------------------------------- | ------------------ |
| **Use content above image** | Where the text and buttons show on mobile. **On** places them on top of the video. **Off** shows them below the video. | **On** or **Off**. |


Turn off **Use content above image** if the text or buttons are hard to read over the video on small screens.
Your video plays on its own in the theme editor preview, with your heading and buttons on top.
## Related articles
Common section settings
Video