Getting started with Video Background

Overview

From replacing static images to background video on your home page, Video Background enables you to choose any public Vimeo, YouTube, or other preselected video and embed it on any page in your shop in minutes.

Not only does Video Background enable you to customize videos for your store, but each video can also be customized individually. You can personalize the same video for different pages, or you can choose the same customization options for different videos to create a sense of continuity in your shop.

Add new video

Video Page

Select the page where you want to display your video. You can click the image below for more details:

Video type

Select the type of video you want to use. Video Background features four types of videos that can be easily configured using the app. You can see examples of different videos configurations by clicking the image below:

Video position selection

A Video background can be placed in a different location on desktop and mobile directly from the app preferences page. You can choose Visual selection or Manual selection. If you go for manual selection, make sure to review this article first: How to obtain an element selector. In case you want to set different locations for mobile and desktop views, click on the image below for more details:

YouTube or Vimeo Video URL

Now, it is time to add the URL to the video you want to display. You can select one of the sample videos and see how it will look in your store. Click the image below for more details:

Video preferences

Set your video preferences. You will have the option to add video controls, mute the video, and

Advanced options 

Lastly, here you tune some extra settings, even additional CSS, if you are comfortable with it. Using the Gradient color, you will be able to remove the black bands shown when the video loads for the first time: