Include a Video section to display a YouTube or Vimeo video viewer on a template.
Add this section to the
Customize section settings
Click the Video section to open its settings.
Wide display
Enable Wide display for the section to span the full width of the window. Otherwise, the section will be limited by a horizontal container.
Aspect ratio
An aspect ratio is the ratio of its width to its height. In the video section, select one of two options for the Aspect ratio setting: 16:9 and 4:3.
Enable video autoplay and looping
For product videos, activate autoplay by enabling Autoplay video. Repeat the video automatically at its end by selecting Autoloop video.
Mute video
Enable Mute video to disable the sound by default. Customers can still unmute the video with the player's controls.
Show video controls
Activate Show video controls to include the video player's features for controlling the playback (pause, full screen, mute, etc.).
Darken video
Reduce the brightness of the video by selecting Darken video. There is also an Overlay feature to consider as an alternative.
Connect the video
Copy the URL for a YouTube or Vimeo video then paste it into the Video link field.
HTML5 MP4 File URL
Upload your video file to the Files portion of your Shopify Settings, then connect it with the section using the HTML5 MP4 File URL field.
Connect an MP4 file
- In the Shopify admin editor, open Settings
- Open Files
- Click Upload files
- Locate the file on your device
- Once uploaded, click the Link icon to copy the file URL
- Paste this URL to the HTML5 MP4 File URL field
Show text when video is playing
Activate Show text when video is playing to have the text remain visible while the video plays. Leave this disabled to limit the text to before the video plays.
Add image
Click Select image to add a static image as a cover for the video. Merchants often use this to highlight a particular shot or frame from the video.
Select an Image focal point to adjust how the image fits in its container.
Add text
Include text using the Heading and Text fields. Connect another page with the Button label and Button link fields.
Select a Text animation option to have the text Fade in, Fade up, or Fade down. Select None to disable animation.
Text position
Control the position for the text by selecting an option from the Text position dropdown.
The options are:
- Top left
- Top center
- Top right
- Center left
- Center
- Center right
- Bottom left
- Bottom center
- Bottom right
Enable parallax scrolling
To activate the parallax effect for this feature, select Enable parallax scrolling.
Use the Parallax section height range finder to control the height of the parallax-viewing window.