Follow below steps:
- Go to theme -> Customize
- Add a new section ‘Custom liquid’
- Paste the below code
<style>
div:has(.custom-video-section) {
padding: 0 !important;
}
video {
display: block;
margin: 0 auto;
width: 100%;
}
@media screen and (min-width: 800px) {
.video-for-mobile {
display: none;
}
}
@media screen and (max-width: 800px) {
.video-for-desktop {
display: none;
}
video {
width: 100%;
}
}
</style>
<div class="custom-video-section">
<video class="video-for-desktop" autoplay loop playsinline muted>
<source
src="https://cdn.shopify.com/videos/c/o/v/fc5c6752c643485bacd65b1a5557b016.mp4"
/>
</video>
<video class="video-for-mobile" autoplay loop playsinline muted>
<source
src="https://cdn.shopify.com/videos/c/o/v/e1913e781f064577b59fa6b6f42f9afe.mp4"
/>
</video>
</div> 
