Video

Video shows one video behind a cover image with a play button, together with a caption, a heading, a short text and a link. Use it to show how your clothes are made, a campaign film or a behind the scenes story. You can add it to any page.

Upload a video or use YouTube or Vimeo

You have two choices:

• Video: a file uploaded to Shopify. The play button shows the video’s length.
• YouTube or Vimeo URL: paste the link to the video. YouTube and Vimeo don’t share the length, so none is shown.

If you set both, the section shows the uploaded video. A new Video section starts with a sample YouTube video, so remember to replace or remove the URL. Without any video, the cover is shown without a play button.

The video never starts on its own: it plays only when a customer selects the play button, and then shows its own player controls. This keeps the page fast and doesn’t distract customers who are reading.

Choose the cover

Cover image is shown before the video plays, 1920 x 1080px recommended. Without one, an uploaded video shows its own preview frame. A YouTube or Vimeo video without a cover image shows a placeholder illustration, so add a cover image when you use them.

Cover overlay opacity tints the cover with the background color of the section’s color scheme. Color scheme also colors the play button and the gradient behind the text.

Name the video for screen readers

Screen readers read the play button as “Watch video” followed by the video’s name:

• For an uploaded video, the name is its alternative text. Add it in Content > Files in your Shopify admin, the same way as for images.
• For YouTube and Vimeo videos, and for uploaded videos without alternative text, the section’s Heading is used.

Write the cover image’s alternative text in Content > Files too.

Place the text

On tablets and computers the caption, heading, text and link sit at the bottom of the cover. When the video starts, the text is removed so it doesn’t cover the player controls. On phones the text sits below the video.

The link shows only when you fill in both Link label and Link.

Make it touch the sections around it

With Use full page width on, the video reaches the edge of the screen. Vertical spacing is set to None by default, so the section touches the sections above and below like a solid band. Choose Compact, Regular or Spacious to add space around it.

Show it only between two dates

Turn on Schedule visibility and set a start, an end, or both. See Scheduling.

Settings

Settings: Video

Setting	Type	Default	Options
Video Upload a video, or add a YouTube or Vimeo URL below. If you add both, the section shows the uploaded video. Add alt text to the video in Files: screen readers announce it on the play button.	Video	—	—
YouTube or Vimeo URL Screen readers announce the section heading on the play button.	Video URL	https://www.youtube.com/watch?v=_9VUPq3SxOc	—
Cover image 1920 x 1080px recommended. Replaces the video preview. Add alt text to the image in Files.	Image	—	—
Cover overlay opacity	Slider	0%	0%–80%, step 5
Text
Caption	Text	Video	—
Heading	Text	Tell your brand story	—
Text	Multi-line text	Pair the video with a short description.	—
Link label	Text	—	—
Link	Link	—	—
Layout
Use full page width	Checkbox	On	—
Vertical spacing	Drop-down	None	None Compact Regular Spacious
Color scheme Sets the background of the play button and of the gradient behind the text.	Color scheme	scheme-3	—
Schedule
Schedule visibility	Checkbox	Off	—
Start date and time Use the format YYYY-MM-DD HH:MM, in your store's time zone. Leave empty to show it right away. Shown when Schedule visibility is on	Text	—	—
End date and time Use the format YYYY-MM-DD HH:MM, in your store's time zone. Leave empty to keep showing it. Shown when Schedule visibility is on	Text	—	—