With the Video hero section, you can create a bold first impression by showcasing your brand and spotlighting important messages through a dynamic and visually engaging video banner.
How to add the video hero section
- Log in to your Theme editor and navigate to the page you would like to display this section.
- You'll see a list of available sections on the left-hand side. Locate the Add section button and click on it.
- From the list of available sections, find and select Video hero.
Section details
After adding the Video hero section, use the available settings to customize its appearance and align it with your store’s style.
- Full page width: By default, this section spans the full width of the page. Expanse, Fetch and Gem include an option to turn this off.
- Heading: The most prominent text within the slide.
- Heading text size: Adjusts the font size of the heading text.
- Subheading or Text: Ideal for adding supplementary information or descriptive content.
- Button text: Sets the text shown on the button at the bottom of the section.
- Button link: Defines the URL the button leads to. When a YouTube link is used, clicking it will open the video in a player.
- Text alignment: Sets how the heading, subheading, and button are positioned within the section.
- Video: Only applicable on Expanse, Fetch, and Gem. Allows you to select a video uploaded to your store’s files section.
- Video URL: Paste a video URL from YouTube, Video or an MP4 video added in the files section of your store. More info here.
- Text protection: Applies a darker overlay to the video so the text remains clear and readable.
- Desktop Height: Adjusts the section’s height in pixels on desktop.
- Mobile height: Determines how tall the section appears on mobile.