Appearance
Video
This guide describes setting up the Video section to add a video to a store page. Use videos to share information about your brand with customers, describe products, or welcome customers to your store, etc.
In the following video, a video section is displayed on a store's homepage. The video is linked from YouTube. The section's Cover image option is set to display a static image until the video is played. To reduce the height of the video, the Aspect ratio dropdown is set to Cinema.
For general guidance with modifying sections, refer to Sections overview.
Set up a video section
To set up a video section:
Go to Customize theme. At the top of the page, use the dropdown to select a template that contains a video section.
Note
The video section can be added into any page, except Checkout and Giftcard pages. To add a video section into the current page, select Add section > Video. Refer to Shopify help: Add a section.
From the side menu, select Video.
Select a setting described in the following table.
Section setting name | Description |
---|---|
Heading | In the Heading box, enter text to display as the section's title text. |
Cover image | Use the Cover image menu options to set up an image inside the section. The image is displayed when the video is not playing.
|
Video URL | In the Video URL box, enter a URL for the video. URLs from YouTube or Vimeo are accepted. |
Aspect ratio | Select the Aspect ratio dropdown to set a size for the video inside the section. The options are Standard - 16:9, Standard - 4:3, and Cinema. |
Full width | Select the Full width checkbox to turn on/ off displaying a border around the section. |
Alt text | In the Alt text box, enter text that describes the cover image for accessibility purposes. Refer to Shopify help: Adding alt text to media. |
Text color | Select the Text color dropdown to set a color for the text inside the section. The options are: Primary, Secondary, Tertiary, Black, and White. Refer to Colors. |
Color > Color scheme | Use the Color scheme dropdown to set the section's color scheme to Primary, Secondary or Tertiary. Refer to Colors. |
Theme settings | Select Theme Settings to access additional settings for the section. Refer to Section theme settings menu. |
Remove section | Select Remove section to delete the section from the current page template. |