How to add a background video to the homepage slider in Narrative theme?
Narrative is another great theme that we can find on Shopify for free.
One of the outstanding features of this theme is that it has a full-featured homepage slider that allow you to add image slides as well as video slides.
You can take advantage of this feature and add a video to each slide with Video Background.
It is possible to add videos to each slide easily using the following target:
where N is the index of the slide starting from 0.
If we want to put the video on the first slide, we have to write this selector:
and if we want to put the video on the third slide, we have to write this selector:
To do so, let's go to the app preferences page and tap on New background video at the bottom left corner. After that, let's make sure we have selected home page and let's click on Save and select target.
To make the video appear in our desired location, we need to copy the configuration mentioned above in the Element selector field. Don't forget to click on Save, at the bottom right corner, so that the changes can be applied.
Note that it is also important to consider the target element transparency:
If we want to replace the entire slider, we can use this selector: