What is the video with text section?
The Video with text section allows customers to watch video content alongside some optional text and a button. It can either be set to autoplay, where audio is muted, or it can play with audio when the play icon is clicked.
Videos provide a way to display engaging, promotional and educational media on your store in a way that would be difficult to achieve through static images. Videos can enhance your customers' shopping experience and increase conversion rates.
How to set up the video with text section
Steps
- Open the Theme Editor.
- Click Add section and add a Video with text section to the page.
- There are two different methods to choose a video.
Video upload: Select a video file (e.g. an MP4) hosted on your Shopify store.
External video: This video from an external link supports YouTube or Vimeo videos. - It is recommended to add a Custom placeholder image that will display in the place of the video while it is loading, or if it cannot autoplay. This could be due to reasons such as a user’s poor internet connection, limited browser support or slow page load times.
- The Autoplay setting is turned off by default and can either be kept off or turned on.
Autoplay on: The video will automatically play WITHOUT audio, without the user having to click on anything.
Autoplay off: The video will play WITH audio once the user has clicked on the play icon. - In version 7.0.0 and above, a Color scheme can also be selected. Prior to using in the section, color schemes need to be set up in Theme settings > Colors.
Speed considerations
Videos, by their nature, are large and take time to load. If you’re trying to keep Symmetry performing well, avoid placing the Video with text section near the top of the page. Placing it further down the page will mean that the video will only load as and when it becomes closer to being in view.
FAQs
When I select autoplay, can the video play with audio?
No. Browsers don’t allow sound to be active by default on auto-playing videos. Most browsers will block the video, which can cause issues.
If you need audio in your video, it’s always best to give your customers the choice as to when they want to play the video.
Read Google's autoplay policy in Chrome for more.
Why does my video block display differently in 7.0.0 compared to previous versions?
In version 7.0.0 and above, the video block will display in it’s original aspect ratio i.e. the size that the video was uploaded at. In versions below 7.0.0, the video block does not use the native aspect ratio, so it may appear slightly stretched or cropped.
How do I use metafields to show a different video for each product?
After version 7.0.0, both video uploads and external videos are compatible with metafields on the product page. If you are using a version before 7.0.0, then metafield support may vary.
The video upload requires a product metafield of type File, while the external video requires a product metafield of type Text.
Video upload: A video, usually an MP4, hosted on your Shopify store.
Steps
- To use a metafield to link to a Video uploaded in Shopify, open the Shopify admin and go to Settings > Custom data.
- Click on Products to create a new product metafield for your video. The metafield should be a Product metafield of type File.
- In the Shopify admin, go to Products, edit a product and scroll down to find the newly created file metafield. Select a file that contains your video and Save.
- Open the Theme editor, and select Products and the desired product template from the dropdown at the top.
- View the product page and scroll to your video section.
- Next to Video upload select the Connect dynamic source icon to link to the File product metafield containing the video.
External video: This is a video from an external link and supports YouTube or Vimeo videos.
Steps
- To use a metafield to link to an external video, open the Shopify admin and go to Settings > Custom data
- Click on Products to create a new product metafield for your video. The metafield should be a Product metafield of type single line text.
- In the Shopify admin, go to Products, edit a product and scroll down to find the newly created product metafield of type text. Paste in a link to the Youtube or Vimeo video for that product and Save.
- Open the Theme editor, and select Products and the desired product template from the dropdown at the top.
- View the product page and scroll to your video section.
- Next to External video select the Connect dynamic source icon to link to the Text product metafield containing the link to the external video.
Note - Metafields of the appropriate type held in metaobjects can also be used.
Can't find what you're looking for?
Our support staff are here to answer your queries, so don't hesitate to write to us!
Contact us